test(notification): added framework for managment tab

frontend/src/components/admin/notificationMGT/NotificationMGT.tsx

@@ -1,8 +1,22 @@
+import { getnotifications } from "@/utils/querys/admin/notifications";
+import { notifyColumns } from "@/utils/tableData/notifications/notifyColumns";
+import { NotifyTable } from "@/utils/tableData/notifications/notifyData";
+import { useQuery } from "@tanstack/react-query";
+
 export default function NotificationMGT() {
+    const { data, isError, isLoading } = useQuery(getnotifications());
+
+    if (isLoading) return <div>Loading adjustmnet data...</div>;
+    if (isError) {
+        return (
+            <div>
+                <p>There was an error getting the adjustments.</p>
+            </div>
+        );
+    }
     return (
         <div>
-            Manage all notifications from here instad of going to the db,
-            locking some items that are auto updated on server restarts
+            <NotifyTable columns={notifyColumns} data={data} />
         </div>
     );
 }

frontend/src/routes/__root.tsx

@@ -1,4 +1,9 @@
-import { createRootRoute, Link, Outlet } from "@tanstack/react-router";
+import {
+    createRootRoute,
+    Link,
+    Outlet,
+    useLocation,
+} from "@tanstack/react-router";
 //import {TanStackRouterDevtools} from "@tanstack/router-devtools";
 import Cookies from "js-cookie";
 import { SidebarProvider } from "../components/ui/sidebar";
@@ -17,11 +22,12 @@ import {
 import { SessionProvider } from "../components/providers/Providers";
 import { Toaster } from "sonner";
 //import { Button } from "../components/ui/button";
-
 import { useSessionStore } from "../lib/store/sessionStore";
 import { useSession } from "@/hooks/useSession";
 import { useLogout } from "@/hooks/useLogout";
+import ExportInventoryData from "@/components/logistics/warehouse/ExportInventoryData";
 import { AddCards } from "@/components/dashboard/AddCards";
+//import { AddCards } from "@/components/dashboard/AddCards";
 
 // same as the layout
 export const Route = createRootRoute({
@@ -30,16 +36,20 @@ export const Route = createRootRoute({
         const { session } = useSession();
         const { user } = useSessionStore();
         const logout = useLogout();
+        const location = useLocation();
 
         return (
-            <>
+            <div className="overflow-hidden">
                 <SessionProvider>
                     <ThemeProvider>
-                        <nav className="flex justify-end">
+                        <nav className="flex justify-end w-full shadow ">
                             <div className="m-2 flex flex-row">
-                                <div className="m-auto pr-2">
-                                    <AddCards />
-                                </div>
+                                {location.pathname === "/" && (
+                                    <div className="m-auto pr-2 flex flex-row gap-2">
+                                        <ExportInventoryData />
+                                        <AddCards />
+                                    </div>
+                                )}
                                 <div className="m-1">
                                     <ModeToggle />
                                 </div>
@@ -88,16 +98,18 @@ export const Route = createRootRoute({
                                 )}
                             </div>
                         </nav>
-                        <SidebarProvider defaultOpen={sidebarState}>
-                            <AppSidebar />
-                            <Toaster expand={true} richColors closeButton />
-                            <Outlet />
-                        </SidebarProvider>
+                        <main>
+                            <SidebarProvider defaultOpen={sidebarState}>
+                                <AppSidebar />
+                                <Toaster expand={true} richColors closeButton />
+                                <Outlet />
+                            </SidebarProvider>
+                        </main>
                     </ThemeProvider>
                 </SessionProvider>
 
                 {/* <TanStackRouterDevtools position="bottom-right" /> */}
-            </>
+            </div>
         );
     },
 });

frontend/src/utils/querys/admin/notifications.tsx

@@ -0,0 +1,26 @@
+import { queryOptions } from "@tanstack/react-query";
+import axios from "axios";
+
+export function getnotifications() {
+    const token = localStorage.getItem("auth_token");
+    return queryOptions({
+        queryKey: ["getNotifications"],
+        queryFn: () => fetchUsers(token),
+        enabled: !!token, // Prevents query if token is null
+        staleTime: 1000,
+        refetchInterval: 2 * 2000,
+        refetchOnWindowFocus: true,
+    });
+}
+
+const fetchUsers = async (token: string | null) => {
+    const { data } = await axios.get(`/api/notify/notifications`, {
+        headers: {
+            "Content-Type": "application/json",
+            Authorization: `Bearer ${token}`,
+        },
+    });
+    // if we are not localhost ignore the devDir setting.
+    //const url: string = window.location.host.split(":")[0];
+    return data.data ?? [];
+};