import { Box } from "@mui/material";
import React from "react";
import { Grid } from "../components/grid/Grid";
import { useLocation } from "react-router-dom";
import { BackButton } from "../components/back-button/BackButton";
import {
  ROUTE_SLAUGHTER_HOUSE_VET_FREE_BUY_ROUTE,
  ROUTE_SLAUGHTER_OUT_PROVINCE_BUY,
} from "../routes/routes";
import { SlaughterFreeBuyBars } from "../features/slaughter-house/components/slaughter-free-buy-bars/SlaughterFreeBuyBars";

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

  return (
    <>
      <Box display={"flex"} justifyContent="center">
        <Grid
          container
          direction="column"
          justifyContent="center"
          xs={12}
          sm={12}
          md={10}
          lg={10}
        >
          <BackButton />
          {(pathname === ROUTE_SLAUGHTER_OUT_PROVINCE_BUY ||
            pathname === ROUTE_SLAUGHTER_HOUSE_VET_FREE_BUY_ROUTE) && (
            <SlaughterFreeBuyBars />
          )}
        </Grid>
      </Box>
    </>
  );
};

export default SlaughterFreeBuy;
