feat: enhance Authorized component to accept role prop for group-based access control

Author: Aloento

src/Components/Auth/With.tsx

@@ -4,12 +4,15 @@ import { useAuth } from "react-oidc-context";
 /**
  * @author Aloento
  * @since 1.0.0
- * @version 0.1.0
+ * @version 0.2.0
  */
-export function Authorized({ children }: { children: ReactNode }): ReactNode {
+export function Authorized({ children, role }: { children: ReactNode, role?: string }): ReactNode {
   const auth = useAuth();
 
   if (auth.isAuthenticated || process.env.NODE_ENV === "development") {
+    if (role && !((auth.user?.profile as any)?.groups as string[])?.includes(role)) {
+      return null;
+    }
     return children;
   }
 

src/Components/Layout/MobileMenu.tsx

@@ -5,7 +5,7 @@ import { Authorized } from "../Auth/With";
 /**
  * @author Aloento
  * @since 1.0.0
- * @version 0.1.0
+ * @version 0.2.0
  */
 export function MobileMenu() {
   const auth = useAuth();

src/Components/Layout/ProfileMenu.tsx

@@ -4,7 +4,7 @@ import { useAuth } from "react-oidc-context";
 /**
  * @author Aloento
  * @since 1.0.0
- * @version 0.1.0
+ * @version 0.2.0
  */
 export function ProfileMenu() {
   const auth = useAuth();