test(auth): more auth work

frontend/src/components/layout/lst-sidebar.tsx

@@ -9,19 +9,23 @@ import {AdminSideBar} from "./side-components/admin";
 import {useSessionStore} from "../../lib/store/sessionStore";
 import {hasAccess} from "../../utils/userAccess";
 import {moduleActive} from "../../utils/moduleActive";
+import {useModuleStore} from "../../lib/store/useModuleStore";
 
 export function AppSidebar() {
     const {user} = useSessionStore();
+    const {modules} = useModuleStore();
+
+    console.log(user);
     return (
         <Sidebar collapsible="icon">
             <SidebarContent>
                 <Header />
                 {moduleActive("production") && <ProductionSideBar />}
-                {moduleActive("logistics") && hasAccess(user, "logistics", "view") && <LogisticsSideBar />}
-                {moduleActive("forklift") && hasAccess(user, "forklift", "view") && <ForkliftSideBar />}
-                {moduleActive("admin") && hasAccess(user, "eom", "view") && <EomSideBar />}
-                {moduleActive("quality") && hasAccess(user, "quality", "view") && <QualitySideBar />}
-                {moduleActive("admin") && hasAccess(user, "admin", "view") && <AdminSideBar />}
+                {moduleActive("logistics") && hasAccess(user, "logistics", modules) && <LogisticsSideBar />}
+                {moduleActive("forklift") && hasAccess(user, "forklift", modules) && <ForkliftSideBar />}
+                {moduleActive("admin") && hasAccess(user, "eom", modules) && <EomSideBar />}
+                {moduleActive("quality") && hasAccess(user, "quality", modules) && <QualitySideBar />}
+                {moduleActive("admin") && hasAccess(user, "admin", modules) && <AdminSideBar />}
             </SidebarContent>
             <SidebarFooter>
                 <SidebarTrigger />

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

@@ -13,21 +13,25 @@ const items = [
         title: "Silo Adjustments",
         url: "#",
         icon: Cylinder,
+        role: ["technician", "supervisor", "manager", "admin", "systemAdmin"],
     },
     {
         title: "Bulk orders",
         url: "#",
         icon: Truck,
+        role: ["technician", "supervisor", "manager", "admin", "systemAdmin"],
     },
     {
         title: "Forecast",
         url: "#",
         icon: Truck,
+        role: ["technician", "supervisor", "manager", "admin", "systemAdmin"],
     },
     {
         title: "Ocme cycle counts",
         url: "#",
         icon: Package,
+        role: ["technician", "supervisor", "manager", "admin", "systemAdmin"],
     },
 ];
 

frontend/src/lib/store/sessionStore.ts

@@ -1,11 +1,17 @@
 import {create} from "zustand";
 
 type User = {
-    id: number;
+    user_id: string;
+    email: string;
     username: string;
+    roles: keyof Roles[];
     role: string;
 };
 
+interface Roles {
+    role: string;
+}
+
 export type SessionState = {
     user: User | null;
     token: string | null;

frontend/src/lib/store/useGetRoles.ts

@@ -0,0 +1,48 @@
+import {create} from "zustand";
+import {useSessionStore} from "./sessionStore";
+//import useSWR from "swr";
+
+interface Modules {
+    module_id: string;
+    name: string;
+    active: boolean;
+    roles: string;
+    add_user: string;
+    add_date: Date;
+    upd_user: string;
+    upd_date: Date;
+}
+
+interface SettingState {
+    userRoles: Modules[];
+
+    fetchUserRoles: () => Promise<void>;
+    setUserRoles: (userRoles: Modules[]) => void;
+}
+interface FetchModulesResponse {
+    data: Modules[];
+}
+
+export const useModuleStore = create<SettingState>()((set) => ({
+    userRoles: [],
+    setUserRoles: (userRoles) => set({userRoles}),
+    fetchUserRoles: async () => {
+        try {
+            //const response = await axios.get<{data: Setting[]}>(`${process.env.NEXT_PUBLIC_URL}/api/settings/client`);
+            const {token} = useSessionStore();
+            const response = await fetch(`/api/auth/getuseraccess`, {
+                method: "GET",
+                headers: {
+                    "Content-Type": "application/json",
+                    Authentication: `Beaer ${token}`,
+                    // You can add other headers here if necessary
+                },
+            });
+            const data: FetchModulesResponse = await response.json();
+            //console.log(data);
+            set({userRoles: data.data});
+        } catch (error) {
+            console.error("Failed to fetch settings:", error);
+        }
+    },
+}));

frontend/src/lib/store/useModuleStore.ts

@@ -1,16 +1,17 @@
+import {Modules} from "@/types/modules";
 import {create} from "zustand";
 //import useSWR from "swr";
 
-interface Modules {
-    module_id: string;
-    name: string;
-    active: boolean;
-    roles: string;
-    add_user: string;
-    add_date: Date;
-    upd_user: string;
-    upd_date: Date;
-}
+// interface Modules {
+//     module_id: string;
+//     name: string;
+//     active: boolean;
+//     roles: string;
+//     add_user: string;
+//     add_date: Date;
+//     upd_user: string;
+//     upd_date: Date;
+// }
 
 interface SettingState {
     modules: Modules[];

frontend/src/main.tsx

@@ -1,4 +1,4 @@
-import {StrictMode} from "react";
+import React from "react";
 import ReactDOM from "react-dom/client";
 import "./styles.css";
 import {RouterProvider, createRouter} from "@tanstack/react-router";
@@ -19,15 +19,23 @@ declare module "@tanstack/react-router" {
     }
 }
 
-// Render the app
-const rootElement = document.getElementById("root")!;
-if (!rootElement.innerHTML) {
-    const root = ReactDOM.createRoot(rootElement);
-    root.render(
-        <StrictMode>
-            <QueryClientProvider client={queryClient}>
-                <RouterProvider router={router} />
-            </QueryClientProvider>
-        </StrictMode>
-    );
-}
+ReactDOM.createRoot(document.getElementById("root")!).render(
+    <React.StrictMode>
+        <QueryClientProvider client={queryClient}>
+            <RouterProvider router={router} />
+        </QueryClientProvider>
+    </React.StrictMode>
+);
+
+// // Render the app
+// const rootElement = document.getElementById("root")!;
+// if (!rootElement.innerHTML) {
+//     const root = ReactDOM.createRoot(rootElement);
+//     root.render(
+//         <StrictMode>
+//             <QueryClientProvider client={queryClient}>
+//                 <RouterProvider router={router} />
+//             </QueryClientProvider>
+//         </StrictMode>
+//     );
+// }

frontend/src/types/modules.ts

@@ -0,0 +1,10 @@
+export interface Modules {
+    module_id: string;
+    name: string;
+    active: boolean;
+    roles: string;
+    add_User: string;
+    add_Date: Date;
+    upd_user: string;
+    upd_date: Date;
+}

frontend/src/utils/moduleActive.ts

@@ -19,5 +19,5 @@ import {useModuleStore} from "../lib/store/useModuleStore";
 export function moduleActive(moduleName: string): boolean {
     const {modules} = useModuleStore();
     const module = modules.find((m: any) => m.name === moduleName);
-    return module ? module.active : false;
+    return module ? true : false;
 }

frontend/src/utils/userAccess.ts

@@ -1,52 +1,25 @@
-interface User {
-    id: number;
+import {Modules} from "@/types/modules";
+
+type User = {
+    user_id: string;
+    email: string;
     username: string;
-    role: keyof Roles;
-}
+    roles: keyof Roles[];
+    role: string;
+};
 
 interface Roles {
-    [roleName: string]: RolePermissions;
+    role: string;
 }
 
-interface RolePermissions {
-    [moduleName: string]: Feature[];
-}
-
-type Feature = string;
-
-const rolePermissions: Roles = {
-    admin: {
-        production: ["view", "manage", "update", "admin"],
-        logistics: ["view", "manage", "update", "admin"],
-        quality: ["view", "request", "manage", "update", "admin"],
-        forklift: ["view", "manage", "update", "admin"],
-        admin: ["view", "view_logs", "manage", "update", "admin"],
-    },
-    manager: {
-        production: ["view", "manage"],
-        logistics: ["view", "manage"],
-        quality: ["view", "manage"],
-        forklift: ["view", "manage"],
-        admin: ["view_logs"],
-    },
-    supervisor: {
-        production: ["view", "update"],
-        logistics: ["view", "update"],
-        quality: ["view", "update"],
-        forklift: ["view"],
-        admin: [],
-    },
-    user: {
-        production: ["view"],
-        logistics: ["view"],
-        quality: ["view"],
-        forklift: [],
-        admin: [],
-    },
-};
-
 // user will need access to the module.
 // users role will determine there visual access
-export function hasAccess(user: User | null, moduleName: string, feature: Feature): boolean {
-    return user?.role ? rolePermissions[user.role]?.[moduleName]?.includes(feature) || false : false;
+export function hasAccess(user: User | null, moduleName: string | null, modules: Modules[]): boolean {
+    // get the modules for the id
+    const filteredModule = modules?.filter((f) => f.name === moduleName);
+    console.log(filteredModule);
+    // userroles and filter out by the module id,
+
+    console.log(user);
+    return false;
 }