test(auth): more permission testing

frontend/src/components/layout/side-components/admin.tsx

@@ -1,4 +1,5 @@
 import {
+    AlignJustify,
     Atom,
     Logs,
     Minus,
@@ -25,76 +26,120 @@ import {
     CollapsibleContent,
     CollapsibleTrigger,
 } from "../../ui/collapsible";
+import { useSubModuleStore } from "@/lib/store/useSubModuleStore";
 
-const items = [
-    {
-        title: "Servers",
-        url: "/servers",
-        icon: Server,
-        isActive: false,
-    },
-];
-const data = {
-    navMain: [
-        {
-            title: "Admin",
-            url: "#",
-            icon: ShieldCheck,
-            items: [
-                {
-                    title: "Settings",
-                    url: "/settings",
-                    icon: Settings,
-                    isActive: true,
-                },
-                {
-                    title: "Modules",
-                    url: "/modules",
-                    icon: Settings,
-                    isActive: false,
-                },
-                {
-                    title: "Swagger",
-                    url: "#",
-                    icon: Webhook,
-                    isActive: true,
-                },
-                {
-                    title: "Logs",
-                    url: "#",
-                    icon: Logs,
-                    isActive: false,
-                },
-                {
-                    title: "Users",
-                    url: "/users",
-                    icon: Users,
-                    isActive: true,
-                },
-                {
-                    title: "UCD",
-                    url: "https://ucd.alpla.net:8443/",
-                    icon: Atom,
-                    isActive: false,
-                    newWindow: true,
-                },
-                {
-                    title: "Lst Api",
-                    url: "/api/docs",
-                    icon: Webhook,
-                    isActive: false,
-                },
-            ],
-        },
-    ],
+const iconMap: any = {
+    ShieldCheck: ShieldCheck,
+    AlignJustify: AlignJustify,
+    Settings: Settings,
+    Atom: Atom,
+    Logs: Logs,
+    Users: Users,
+    Webhook: Webhook,
+    Server: Server,
 };
 
 export function AdminSideBar() {
+    const { subModules } = useSubModuleStore();
+
+    const items = subModules.filter((m) => m.moduleName === "admin");
     return (
         <SidebarGroup>
             <SidebarGroupLabel>Admin section</SidebarGroupLabel>
             <SidebarGroupContent>
-                <SidebarMenu>
+                {items.map((item: any, index) => {
+                    const Icon = iconMap[item.icon] || AlignJustify;
+                    // drop down menu setup
+                    return (
+                        <SidebarMenu key={item.name}>
+                            {item.link === "#" ? (
+                                <Collapsible
+                                    key={item.name}
+                                    defaultOpen={index === 1}
+                                    className="group/collapsible"
+                                >
+                                    <SidebarMenuItem>
+                                        <CollapsibleTrigger asChild>
+                                            <SidebarMenuButton>
+                                                <Icon />
+                                                {item.name}{" "}
+                                                <Plus className="ml-auto group-data-[state=open]/collapsible:hidden" />
+                                                <Minus className="ml-auto group-data-[state=closed]/collapsible:hidden" />
+                                            </SidebarMenuButton>
+                                        </CollapsibleTrigger>
+                                        {item.subSubModule?.length > 0 ? (
+                                            <CollapsibleContent>
+                                                <SidebarMenuSub>
+                                                    {item.subSubModule.map(
+                                                        (i: any) => {
+                                                            const SubIcon =
+                                                                iconMap[
+                                                                    i.icon
+                                                                ] ||
+                                                                AlignJustify;
+                                                            return (
+                                                                <SidebarMenuSubItem
+                                                                    key={i.name}
+                                                                >
+                                                                    {i.isActive && (
+                                                                        <SidebarMenuSubButton
+                                                                            asChild
+                                                                        >
+                                                                            <a
+                                                                                href={
+                                                                                    i.link
+                                                                                }
+                                                                                target={
+                                                                                    i.newWindow
+                                                                                        ? "_blank"
+                                                                                        : "_self"
+                                                                                }
+                                                                            >
+                                                                                <SubIcon />
+                                                                                <span>
+                                                                                    {
+                                                                                        i.name
+                                                                                    }
+                                                                                </span>
+                                                                            </a>
+                                                                        </SidebarMenuSubButton>
+                                                                    )}
+                                                                </SidebarMenuSubItem>
+                                                            );
+                                                        }
+                                                    )}
+                                                </SidebarMenuSub>
+                                            </CollapsibleContent>
+                                        ) : null}
+                                    </SidebarMenuItem>
+                                </Collapsible>
+                            ) : (
+                                <SidebarMenu>
+                                    {items.map((item) => {
+                                        if (item.link === "#") return;
+                                        return (
+                                            <SidebarMenuItem key={item.name}>
+                                                <SidebarMenuButton asChild>
+                                                    <a href={item.link}>
+                                                        <Icon />
+                                                        <span>{item.name}</span>
+                                                    </a>
+                                                </SidebarMenuButton>
+                                            </SidebarMenuItem>
+                                        );
+                                    })}
+                                </SidebarMenu>
+                            )}
+                        </SidebarMenu>
+                    );
+                })}
+            </SidebarGroupContent>
+        </SidebarGroup>
+    );
+}
+
+{
+    /* <SidebarMenu>
                     {data.navMain.map((item, index) => (
                         <Collapsible
                             key={item.title}
@@ -156,8 +201,5 @@ export function AdminSideBar() {
                             </SidebarMenuButton>
                         </SidebarMenuItem>
                     ))}
-                </SidebarMenu>
-            </SidebarGroupContent>
-        </SidebarGroup>
-    );
+                </SidebarMenu> */
 }