feat: init categories

pooriaset · pooriaset · commit d26b68c5dcb7 · 2024-12-22T11:25:53.000+03:30
diff --git a/src/app/[locale]/layout.tsx b/src/app/[locale]/layout.tsx
@@ -26,28 +26,29 @@ import IconsSymbols from '@/components/Icons/components/IconsSymbols';
 import { getServerSession } from 'next-auth';
 import SessionProvider from '@/components/Auth/SessionProvider';
 import { Toaster } from 'react-hot-toast';
+import { Provider } from 'jotai';
 
 export type LocaleLayoutParams = { params: { locale: Locale } };
 
-export async function generateMetadata(): Promise<Metadata> {
-  try {
-    const { data } = await getClient().query<GetGeneralSettingsQuery>({
-      query: GET_GENERAL_SETTINGS,
-    });
+// export async function generateMetadata(): Promise<Metadata> {
+//   try {
+//     const { data } = await getClient().query<GetGeneralSettingsQuery>({
+//       query: GET_GENERAL_SETTINGS,
+//     });
 
-    return {
-      title: {
-        template: `%s | ${data.generalSettings?.title!}`,
-        default: data.generalSettings?.title! ?? 'Test',
-      },
-      description: data.generalSettings?.description!,
-    };
-  } catch (error) {
-    return {
-      title: 'NextJs Woo',
-    };
-  }
-}
+//     return {
+//       title: {
+//         template: `%s | ${data.generalSettings?.title!}`,
+//         default: data.generalSettings?.title! ?? 'Test',
+//       },
+//       description: data.generalSettings?.description!,
+//     };
+//   } catch (error) {
+//     return {
+//       title: 'NextJs Woo',
+//     };
+//   }
+// }
 
 export default async function LocaleLayout({
   children,
@@ -66,25 +67,27 @@ export default async function LocaleLayout({
       <body>
         <IconsSymbols />
         <SessionProvider session={session}>
-          <AppRouterCacheProvider>
-            <ThemeProvider theme={themes[locale] ?? defaultTheme}>
-              <Toaster
-                // rtl={languages?.[locale]?.direction == 'rtl'}
-                position="top-center"
-              />
-              <ApolloProvider>
-                <AppProvider userAgent={reqUserAgent}>
-                  <CssBaseline />
-                  <GlobalStyles styles={globalStyles} />
-                  <RTLProvider>
-                    <I18nProvider locale={locale}>
-                      <ConfirmAlertProvider>{children}</ConfirmAlertProvider>
-                    </I18nProvider>
-                  </RTLProvider>
-                </AppProvider>
-              </ApolloProvider>
-            </ThemeProvider>
-          </AppRouterCacheProvider>
+          <Provider>
+            <AppRouterCacheProvider>
+              <ThemeProvider theme={themes[locale] ?? defaultTheme}>
+                <Toaster
+                  // rtl={languages?.[locale]?.direction == 'rtl'}
+                  position="top-center"
+                />
+                <ApolloProvider>
+                  <AppProvider userAgent={reqUserAgent}>
+                    <CssBaseline />
+                    <GlobalStyles styles={globalStyles} />
+                    <RTLProvider>
+                      <I18nProvider locale={locale}>
+                        <ConfirmAlertProvider>{children}</ConfirmAlertProvider>
+                      </I18nProvider>
+                    </RTLProvider>
+                  </AppProvider>
+                </ApolloProvider>
+              </ThemeProvider>
+            </AppRouterCacheProvider>
+          </Provider>
         </SessionProvider>
       </body>
     </html>
diff --git a/src/app/[locale]/test/page.tsx b/src/app/[locale]/test/page.tsx
@@ -0,0 +1,56 @@
+'use client';
+
+import { Box, Stack } from '@mui/material';
+import React, { FC, ReactNode } from 'react';
+
+export interface IMenuCategoryItem {
+  id: string;
+  icon: ReactNode;
+  title: string;
+}
+
+const MenuCategoryItem: FC<IMenuCategoryItem> = ({ title }) => {
+  return (
+    <Stack
+      alignItems="center"
+      justifyContent="center"
+      sx={{
+        width: 110,
+        height: 65,
+        backgroundColor: (theme) => theme.palette.grey[200],
+      }}
+    >
+      {title}
+    </Stack>
+  );
+};
+
+const page = () => {
+  const categories: IMenuCategoryItem[] = [
+    {
+      id: '1',
+      icon: '',
+      title: 'مد و پوشاک',
+    },
+    {
+      id: '2',
+      icon: '',
+      title: 'زیبایی و سلامت',
+    },
+    {
+      id: '3',
+      icon: '',
+      title: 'ساعت و طلا',
+    },
+  ];
+
+  return (
+    <Stack overflow="auto">
+      {categories.map((category) => {
+        return <MenuCategoryItem {...category} key={category.id} />;
+      })}
+    </Stack>
+  );
+};
+
+export default page;
