HT_DASHBOARD_frontend/src/layouts/dashbord/tab/ContractTabs.tsx

import { Tabs } from "@mui/material";
import { TabProps, useTab } from "./tabutil";
import { PageID, TabID } from "pages";
import { getPath } from "routes/path";

const tabs: TabProps[] = [
  {
    label: "一覧",
    tabId: TabID.NONE,
  },
  {
    label: "詳細",
    tabId: TabID.A,
  },
];

export default function ContractTabs() {
  const { elements, getTabIndex } = useTab(tabs);

  return (
    <Tabs
      value={getTabIndex}
      textColor="inherit"
      //   scrollButtons
      //   allowScrollButtonsMobile
      variant="scrollable"
    >
      {elements}
    </Tabs>
  );
}