update,

002_source/cms/src/app/dashboard/customers/page.tsx

@@ -1,5 +1,7 @@
+'use client';
+
 import * as React from 'react';
-import type { Metadata } from 'next';
+// import type { Metadata } from 'next';
 import Box from '@mui/material/Box';
 import Button from '@mui/material/Button';
 import Card from '@mui/material/Card';
@@ -17,7 +19,7 @@ import { CustomersSelectionProvider } from '@/components/dashboard/customer/cust
 import { CustomersTable } from '@/components/dashboard/customer/customers-table';
 import type { Customer } from '@/components/dashboard/customer/customers-table';
 
-export const metadata = { title: `List | Customers | Dashboard | ${config.site.name}` } satisfies Metadata;
+// export const metadata = { title: `List | Customers | Dashboard | ${config.site.name}` } satisfies Metadata;
 
 const customers = [
   {
@@ -182,6 +184,10 @@ export default function Page({ searchParams }: PageProps): React.JSX.Element {
   const sortedCustomers = applySort(customers, sortDir);
   const filteredCustomers = applyFilters(sortedCustomers, { email, phone, status });
 
+  React.useEffect(() => {
+    console.log('helloworld');
+  }, []);
+
   return (
     <Box
       sx={{
@@ -192,25 +198,38 @@ export default function Page({ searchParams }: PageProps): React.JSX.Element {
       }}
     >
       <Stack spacing={4}>
-        <Stack direction={{ xs: 'column', sm: 'row' }} spacing={3} sx={{ alignItems: 'flex-start' }}>
+        <Stack
+          direction={{ xs: 'column', sm: 'row' }}
+          spacing={3}
+          sx={{ alignItems: 'flex-start' }}
+        >
           <Box sx={{ flex: '1 1 auto' }}>
             <Typography variant="h4">Customers</Typography>
           </Box>
           <Box sx={{ display: 'flex', justifyContent: 'flex-end' }}>
-            <Button startIcon={<PlusIcon />} variant="contained">
+            <Button
+              startIcon={<PlusIcon />}
+              variant="contained"
+            >
               Add
             </Button>
           </Box>
         </Stack>
         <CustomersSelectionProvider customers={filteredCustomers}>
           <Card>
-            <CustomersFilters filters={{ email, phone, status }} sortDir={sortDir} />
+            <CustomersFilters
+              filters={{ email, phone, status }}
+              sortDir={sortDir}
+            />
             <Divider />
             <Box sx={{ overflowX: 'auto' }}>
               <CustomersTable rows={filteredCustomers} />
             </Box>
             <Divider />
-            <CustomersPagination count={filteredCustomers.length + 100} page={0} />
+            <CustomersPagination
+              count={filteredCustomers.length + 100}
+              page={0}
+            />
           </Card>
         </CustomersSelectionProvider>
       </Stack>