'use client';

import { Suspense } from 'react';
import DashboardLayout from '../../../src/features/dashboard/components/DashboardLayout';
import OrdersPage from '../../../src/features/orders/pages/OrdersPage';
import { CircularProgress, Box } from '@mui/material';

function OrdersContent() {
  return (
    <DashboardLayout>
      <Box sx={{ p: 4 }}>
        <OrdersPage />
      </Box>
    </DashboardLayout>
  );
}

export default function OrdersPageRoute() {
  return (
    <Suspense
      fallback={
        <Box
          sx={{
            display: 'flex',
            justifyContent: 'center',
            alignItems: 'center',
            minHeight: '100vh',
          }}
        >
          <CircularProgress />
        </Box>
      }
    >
      <OrdersContent />
    </Suspense>
  );
}