import { Suspense } from "react";
import { Metadata } from "next";
import Typography from "@mui/material/Typography";
import { getServerI18n } from "@/i18n";
import QrCodeHandleSearchWrapper from "@/components/qrCodeHandles/qrCodeHandleSearchWrapper";
import QrCodeHandleEquipmentSearchWrapper from "@/components/qrCodeHandles/qrCodeHandleEquipmentSearchWrapper";
import QrCodeHandleWarehouseSearchWrapper from "@/components/qrCodeHandles/qrCodeHandleWarehouseSearchWrapper";
import QrCodeHandleTabs from "@/components/qrCodeHandles/qrCodeHandleTabs";
import { I18nProvider } from "@/i18n";
import Box from "@mui/material/Box";

export const metadata: Metadata = { title: "QR Code Handle" };

const QrCodeHandlePage: React.FC = async () => {
  const { t } = await getServerI18n("qrCodeHandle");
  
  return (
    <Box sx={{ width: "100%" }}>
      <Typography variant="h5" sx={{ mb: 3 }}>
        {t("QR Code Handle")}
      </Typography>
      
      <I18nProvider namespaces={["qrCodeHandle","navigation","common","user","warehouse"]}>
        <QrCodeHandleTabs
          userTabContent={
            <Suspense fallback={<QrCodeHandleSearchWrapper.Loading />}>
              <I18nProvider namespaces={["qrCodeHandle","navigation","common","user","dashboard"]}>
                <QrCodeHandleSearchWrapper />
              </I18nProvider>
            </Suspense>
          }
          equipmentTabContent={
            <Suspense fallback={<QrCodeHandleEquipmentSearchWrapper.Loading />}>
              <I18nProvider namespaces={["qrCodeHandle","navigation","common","project","dashboard"]}>
                <QrCodeHandleEquipmentSearchWrapper />
              </I18nProvider>
            </Suspense>
          }
          warehouseTabContent={
            <Suspense fallback={<QrCodeHandleWarehouseSearchWrapper.Loading />}>
              <I18nProvider namespaces={["qrCodeHandle","navigation","common","warehouse","dashboard"]}>
                <QrCodeHandleWarehouseSearchWrapper />
              </I18nProvider>
            </Suspense>
          }
        />
      </I18nProvider>
    </Box>
  );
};

export default QrCodeHandlePage;