import { Box } from "@mui/material";
import { useLocation } from "react-router-dom";
import { Grid } from "../components/grid/Grid";
import { SPACING } from "../data/spacing";
import {
  ROUTE_ADMINX_DIFFRENCE_KILLER,
  ROUTE_ADMINX_DIFFRENCE_KILLER_SLAUGHTER,
  ROUTE_ADMINX_INCREASE_HATCHING,
  ROUTE_CITY_DIFFRENCE_KILLER,
  ROUTE_CITY_DIFFRENCE_KILLER_SLAUGHTER,
  ROUTE_CITY_INCREASE_HATCHING,
  ROUTE_PROVINCE_DIFFRENCE_KILLER,
  ROUTE_PROVINCE_DIFFRENCE_KILLER_SLAUGHTER,
  ROUTE_PROVINCE_INCREASE_HATCHING,
  ROUTE_SUPER_ADMIN_DIFFRENCE_KILLER,
  ROUTE_SUPER_ADMIN_DIFFRENCE_KILLER_SLAUGHTER,
  ROUTE_SUPER_ADMIN_INCREASE_HATCHING,
} from "../routes/routes";
import { CityManageDiffrenceKillerOperation } from "../features/city/components/city_manage-diffrence-killer-operation/CityManageDiffrenceKillerOperation";
import { ProvinceBarDifference } from "../features/province/components/province-bar-difference/ProvinceBarDifference";
import { BackButton } from "../components/back-button/BackButton";
import { CityIncreaseHatching } from "../features/city/components/city-increase-hatching/CityIncreaseHatching";

const DiffrenceKillerPage = () => {
  const { pathname } = useLocation();

  return (
    <>
      <Box display="flex" justifyContent="center" xs={12}>
        <Grid container xs={12} md={10}>
          <Grid container xs={12} gap={SPACING.SMALL}>
            <Grid xs={12} justifyContent="center">
              {pathname === ROUTE_ADMINX_DIFFRENCE_KILLER ||
              pathname === ROUTE_SUPER_ADMIN_DIFFRENCE_KILLER ||
              pathname === ROUTE_CITY_DIFFRENCE_KILLER ||
              pathname === ROUTE_PROVINCE_DIFFRENCE_KILLER ? (
                <>
                  {" "}
                  <Grid item xs={12} mb={2} justifyContent="center">
                    <BackButton />
                  </Grid>
                  <CityManageDiffrenceKillerOperation />
                </>
              ) : (
                <BackButton />
              )}
            </Grid>
          </Grid>
          <Grid xs={12} sm={12}>
            {(pathname.includes(ROUTE_ADMINX_DIFFRENCE_KILLER_SLAUGHTER) ||
              pathname.includes(ROUTE_SUPER_ADMIN_DIFFRENCE_KILLER_SLAUGHTER) ||
              pathname.includes(ROUTE_PROVINCE_DIFFRENCE_KILLER_SLAUGHTER) ||
              pathname.includes(ROUTE_CITY_DIFFRENCE_KILLER_SLAUGHTER)) && (
              <ProvinceBarDifference />
            )}

            {(pathname.includes(ROUTE_PROVINCE_INCREASE_HATCHING) ||
              pathname.includes(ROUTE_ADMINX_INCREASE_HATCHING) ||
              pathname.includes(ROUTE_CITY_INCREASE_HATCHING) ||
              pathname.includes(ROUTE_SUPER_ADMIN_INCREASE_HATCHING)) && (
              <CityIncreaseHatching />
            )}
          </Grid>
        </Grid>

        <Grid container justifyContent="space-between" gap={SPACING.SMALL}>
          <Grid xs={12}></Grid>
        </Grid>
      </Box>
    </>
  );
};

export default DiffrenceKillerPage;