abilites to localStorage

src/app/(main)/home/page.tsx

@@ -1,18 +1,28 @@
 import { Metadata } from "next";
 import { I18nProvider } from "@/i18n";
-import DashboardPage from "@/components/DashboardPage/DashboardPage";
 import DashboardPageButton from "@/components/DashboardPage/DashboardTabButton";
 import ProgressByClientSearch from "@/components/ProgressByClientSearch";
 import { Suspense } from "react";
 import Tabs, { TabsProps } from "@mui/material/Tabs";
 import Tab from "@mui/material/Tab";
+import { getServerI18n } from "@/i18n";
+import DashboardPage from "@/components/DashboardPage";
 
 export const metadata: Metadata = {
   title: "Dashboard",
 };
 
-const Dashboard: React.FC = () => {
-  return <div>test</div>;
+// type Props = {
+//   test: string 
+// }
+const Dashboard: React.FC = async () => {
+  const { t } = await getServerI18n("dashboard");
+
+  return (
+    <I18nProvider namespaces={["dashboard", "common"]}>
+      <DashboardPage/>
+    </I18nProvider>
+  )
 };
 
 export default Dashboard;

src/app/layout.tsx

@@ -4,7 +4,7 @@ import ThemeRegistry from "@/theme/ThemeRegistry";
 
 export const metadata: Metadata = {
   title: "FPSMS",
-  description: "FPSMS - Timesheet Management System",
+  description: "FPSMS - xxxx Management System",
 };
 
 export default async function RootLayout({

src/components/DashboardPage/DashboardPage.tsx

@@ -14,11 +14,19 @@ import { useRouter } from "next/navigation";
 import ProgressByClient from "./ProgressByClient";
 import ProgressByClientSearch from "@/components/ProgressByClientSearch";
 import { Suspense } from "react";
+import { getSession } from "next-auth/react";
 
-const DashboardPage: React.FC = () => {
+type Props = {
+  abilities: string[]
+}
+const DashboardPage: React.FC<Props> = ({
+  abilities
+}) => {
   const [tabIndex, setTabIndex] = useState(0);
   const { t } = useTranslation("dashboard");
   const router = useRouter();
+  window.localStorage.setItem("abilities", JSON.stringify(abilities))
+
   const handleCancel = () => {
     router.back();
   };
@@ -32,10 +40,10 @@ const DashboardPage: React.FC = () => {
     <ThemeProvider theme={theme}>
       <Tabs value={tabIndex} onChange={handleTabChange} variant="scrollable">
         <Tab label="Project Financial Summary" />
-        <Tab label="Project Cash Flow" />
+        {/* <Tab label="Project Cash Flow" />
         <Tab label="Project Progress by Client" />
         <Tab label="Project Resource Utilization" />
-        <Tab label="Staff Utilization" />
+        <Tab label="Staff Utilization" /> */}
       </Tabs>
       {tabIndex === 2 && <ProgressByClient />}
       {/* <Grid container height="100vh" style={{ backgroundColor: theme.palette.background.default}}>

src/components/DashboardPage/DashboardWrapper.tsx

@@ -0,0 +1,18 @@
+import { authOptions } from "@/config/authConfig"
+import { getServerSession, Session } from "next-auth"
+import DashboardPage from "./DashboardPage"
+
+export type SessionWithAbilities = {
+    abilities: string[]
+} & Session | null
+
+const DashboardWrapper: React.FC = async () => {
+    const session: SessionWithAbilities = await getServerSession(authOptions)
+
+    return (    
+        <DashboardPage
+        abilities={session ? session?.abilities : []}
+        />
+    )
+}
+export default DashboardWrapper

src/components/DashboardPage/index.ts

@@ -1 +1 @@
-export { default } from "./DashboardPage";
+export { default } from "./DashboardWrapper";

src/components/NavigationContent/NavigationContent.tsx

@@ -36,7 +36,7 @@ const navigationItems: NavigationItem[] = [
     icon: <Dashboard />,
     label: "Dashboard",
     path: "",
-    children: [
+    // children: [
       // {
       //   icon: <SummarizeIcon />,
       //   label: "Project Financial Summary",
@@ -62,7 +62,7 @@ const navigationItems: NavigationItem[] = [
       //   label: "Staff Utilization",
       //   path: "/dashboard/StaffUtilization",
       // },
-    ],
+    // ],
   },
   {
     icon: <RequestQuote />,
@@ -193,73 +193,73 @@ const navigationItems: NavigationItem[] = [
   },
   {
     icon: <RequestQuote />,
-    label: "Master Data",
+    label: "Settings",
     path: "",
     children: [
       {
         icon: <RequestQuote />,
         label: "User",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "User Group",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Material",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Maintain By-product",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Finished Goods",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Equipment Type",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Equipment",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Warehouse",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Supplier",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "Customer",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "QC Check Item",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "QC Category",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
       {
         icon: <RequestQuote />,
         label: "QC Check Template",
-        path: "/masterData/user",
+        path: "/settings/user",
       },
     ],
   },

src/config/authConfig.ts

@@ -5,6 +5,7 @@ import { LOGIN_API_PATH } from "./api";
 export interface SessionWithTokens extends Session {
   accessToken?: string;
   refreshToken?: string;
+  abilities: string[]
 }
 
 export const authOptions: AuthOptions = {
@@ -50,6 +51,7 @@ export const authOptions: AuthOptions = {
         // Add the data from the token to the session
         accessToken: token.accessToken as string | undefined,
         refreshToken: token.refreshToken as string | undefined,
+        abilities: token.abilities as string[]
       };
 
       return sessionWithToken;