import { Tab, Tabs } from "@mui/material";
import { useEffect, useState } from "react";
//import { TabContext, TabPanel } from "@material-ui/lab";
import GeneralEndpoints from "apiDocs/endpoints/generalEndpoints";
import AviationEndpoints from "apiDocs/endpoints/aviationEndpoints";
import AgricultureEndpoints from "apiDocs/endpoints/agricultureEndpoints";
import MiningEndpoints from "apiDocs/endpoints/miningEndpoints";
import ConstructionEndpoints from "apiDocs/endpoints/constructionEndpoints";
import React from "react";

interface TabPanelProps {
  children?: React.ReactNode;
  index: any;
  value: any;
}

function TabPanelMine(props: TabPanelProps) {
  const { children, value, index, ...other } = props;

  return (
    <div
      role="tabpanel"
      hidden={value !== index}
      aria-labelledby={`simple-tab-${index}`}
      {...other}>
      {value === index && <React.Fragment>{children}</React.Fragment>}
    </div>
  );
}

export default function Endpoints() {
  const [currentTab, setCurrentTab] = useState("general");

  return (
    <>
      <Tabs
        value={currentTab}
        onChange={(_, value) => setCurrentTab(value)}
        indicatorColor="primary"
        textColor="primary"
        variant="fullWidth">
        <Tab label={"General"} value={"general"} />
        <Tab label={"Agriculture"} value={"agriculture"} />
        <Tab label={"Aviation"} value={"aviation"} />
        <Tab label={"Mining"} value={"mining"} />
        <Tab label={"Construction"} value={"construction"} />
      </Tabs>
      <TabPanelMine value={currentTab} index="general">
        <GeneralEndpoints />
      </TabPanelMine>
      <TabPanelMine value={currentTab} index="aviation">
        <AviationEndpoints />
      </TabPanelMine>
      <TabPanelMine value={currentTab} index="agriculture">
        <AgricultureEndpoints />
      </TabPanelMine>
      <TabPanelMine value={currentTab} index="mining">
        <MiningEndpoints />
      </TabPanelMine>
      <TabPanelMine value={currentTab} index="construction">
        <ConstructionEndpoints />
      </TabPanelMine>
    </>
  );
}
