"use client";

import { InventoryResult } from "@/app/api/inventory";
import { PrinterCombo } from "@/app/api/settings/printer";
import { WarehouseResult } from "@/app/api/warehouse";
import { Box, Tab, Tabs } from "@mui/material";
import { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
import InventorySearch from "./InventorySearch";

type TabValue = "item" | "location";

interface Props {
  inventories: InventoryResult[];
  printerCombo?: PrinterCombo[];
  warehouses?: WarehouseResult[];
}

/** FP-MTMS Version Checklist | Functions Ref. No. 79 | v1.0.0 | 2026-09-10 */
const InventorySearchPage: React.FC<Props> = ({
  inventories,
  printerCombo,
  warehouses = [],
}) => {
  const { t } = useTranslation("inventory");
  const [tab, setTab] = useState<TabValue>("item");

  const handleTabChange = useCallback((_: React.SyntheticEvent, value: string) => {
    setTab(value as TabValue);
  }, []);

  return (
    <Box>
      <Tabs value={tab} onChange={handleTabChange} sx={{ mb: 2 }}>
        <Tab value="item" label={t("Item Search")} />
        <Tab value="location" label={t("Location Search")} />
      </Tabs>

      {tab === "item" && (
        <InventorySearch inventories={inventories} printerCombo={printerCombo} />
      )}
      {tab === "location" && (
        <InventorySearch
          inventories={inventories}
          printerCombo={printerCombo}
          warehouses={warehouses}
          enableLocationFilter
        />
      )}
    </Box>
  );
};

export default InventorySearchPage;