import { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { AdvancedTable } from "../../../../components/advanced-table/AdvancedTable";
import { Grid } from "../../../../components/grid/Grid";
import { provinceGetOnlyKillHousesService } from "../../services/province-get-only-kill-houses";
import { ProvinceManageSlaughtersCarState } from "../province-manage-slaughters-car-state/ProvinceManageSlaughtersCarState";

export const ProvinceManageSlaughters = () => {
  const dispatch = useDispatch();
  const [killhouses, setKillhouses] = useState([]);

  const { provinceGetOnlyKillHouses } = useSelector(
    (state) => state.provinceSlice
  );

  useEffect(() => {
    dispatch(provinceGetOnlyKillHousesService("kill_house"));
  }, []);

  useEffect(() => {
    const d = provinceGetOnlyKillHouses?.map((item) => {
      return [
        item.killer ? "کشتارکن" : "کشتارگاه",
        item.name,
        <ProvinceManageSlaughtersCarState
          killHouseKey={item.key}
          state={item.allowState}
          key={item.key}
        />,
      ];
    });
    setKillhouses(d);
  }, [provinceGetOnlyKillHouses]);

  return (
    <Grid>
      <AdvancedTable
        name={"خریداران"}
        columns={["ماهیت", "خریدار", "دسترسی ثبت خودرو"]}
        data={killhouses}
      />
    </Grid>
  );
};
