fix: user management & profit chart

src/views/apps/ecommerce/orders/details/index.tsx

@@ -1,43 +1,59 @@
+'use client'
+
 // MUI Imports
 import Grid from '@mui/material/Grid2'
 
 // Type Imports
-import type { OrderType } from '@/types/apps/ecommerceTypes'
 
 // Component Imports
+import { redirect, useParams } from 'next/navigation'
+import Loading from '../../../../../components/layout/shared/Loading'
+import { useOrder } from '../../../../../services/queries/orders'
+import BillingAddress from './BillingAddressCard'
+import CustomerDetails from './CustomerDetailsCard'
 import OrderDetailHeader from './OrderDetailHeader'
 import OrderDetailsCard from './OrderDetailsCard'
-import ShippingActivity from './ShippingActivityCard'
-import CustomerDetails from './CustomerDetailsCard'
 import ShippingAddress from './ShippingAddressCard'
-import BillingAddress from './BillingAddressCard'
 
-const OrderDetails = ({ orderData, order }: { orderData?: OrderType; order: string }) => {
+const OrderDetails = () => {
+
+  const params = useParams()
+
+  const { data, isLoading } = useOrder(params.id as string)
+
+  if (isLoading) {
+    return <Loading />
+  }
+
+  if (!data) {
+    redirect('not-found')
+  }
+
   return (
     <Grid container spacing={6}>
       <Grid size={{ xs: 12 }}>
-        <OrderDetailHeader orderData={orderData} order={order} />
+        <OrderDetailHeader orderData={data} />
       </Grid>
       <Grid size={{ xs: 12, md: 8 }}>
         <Grid container spacing={6}>
           <Grid size={{ xs: 12 }}>
-            <OrderDetailsCard />
-          </Grid>
-          <Grid size={{ xs: 12 }}>
-            <ShippingActivity order={order} />
+            <OrderDetailsCard data={data} />
           </Grid>
+          {/* <Grid size={{ xs: 12 }}>
+            <ShippingActivity order={data.order_number} />
+          </Grid> */}
         </Grid>
       </Grid>
       <Grid size={{ xs: 12, md: 4 }}>
         <Grid container spacing={6}>
           <Grid size={{ xs: 12 }}>
-            <CustomerDetails orderData={orderData} />
+            <CustomerDetails orderData={data} />
           </Grid>
+            {/* <Grid size={{ xs: 12 }}>
+              <ShippingAddress />
+            </Grid> */}
           <Grid size={{ xs: 12 }}>
-            <ShippingAddress />
-          </Grid>
-          <Grid size={{ xs: 12 }}>
-            <BillingAddress />
+            <BillingAddress data={data} />
           </Grid>
         </Grid>
       </Grid>