import { Box } from "@mui/material";
import { Grid } from "../components/grid/Grid";
import { SPACING } from "../data/spacing";
import {
  ROUTE_CITYVET_REGISTER_INFO,
  ROUTE_VETFARM_REGISTER_INFO,
} from "../routes/routes";
import { useLocation } from "react-router-dom";
// import { VetFarmOperations } from "../features/vet-farm/components/vet-farm-operations/VetFarmOperations";
import { VetFarmSubmitFarmInfo } from "../features/vet-farm/components/vet-farm-submit-farm-info/VetFarmSubmitFarmInfo";

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

  return (
    <>
      <Box display={"flex"} justifyContent="center">
        <Grid
          container
          direction="column"
          justifyContent="center"
          xs={12}
          sm={12}
          md={10}
          lg={10}
        >
          {/* <Grid justifyContent="center" my={SPACING.MEDIUM}>
            <Card>
              <VetFarmOperations />
            </Card>
          </Grid> */}
          <Grid container justifyContent="space-between" gap={SPACING.SMALL}>
            <Grid xs={12}>
              {(pathname === ROUTE_VETFARM_REGISTER_INFO ||
                pathname === ROUTE_CITYVET_REGISTER_INFO) && (
                <VetFarmSubmitFarmInfo />
              )}
            </Grid>
          </Grid>
        </Grid>
      </Box>
    </>
  );
};
export default VetFarm;