"use client";

import Check from "@mui/icons-material/Check";
import Close from "@mui/icons-material/Close";
import Button from "@mui/material/Button";
import Stack from "@mui/material/Stack";
import Tab from "@mui/material/Tab";
import Tabs, { TabsProps } from "@mui/material/Tabs";
import { useRouter } from "next/navigation";
import React, { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
import ClaimProjectDetails from "./ClaimDetails";
// import TaskSetup from "./TaskSetup";
// import StaffAllocation from "./StaffAllocation";
// import ResourceMilestone from "./ResourceMilestone";

const CreateProject: React.FC = () => {
  const [tabIndex, setTabIndex] = useState(0);
  const { t } = useTranslation();
  const router = useRouter();

  const handleCancel = () => {
    router.back();
  };

  const handleTabChange = useCallback<NonNullable<TabsProps["onChange"]>>(
    (_e, newValue) => {
      setTabIndex(newValue);
    },
    [],
  );

  return (
    <>
      <ClaimProjectDetails />
      <Stack direction="row" justifyContent="flex-end" gap={1}>
        <Button variant="outlined" startIcon={<Close />} onClick={handleCancel}>
          {t("Cancel")}
        </Button>
        <Button variant="contained" startIcon={<Check />}>
          {t("Confirm")}
        </Button>
      </Stack>
    </>
  );
};

export default CreateProject;
