import { Switch, TableBody, TableCell, TableRow } from "@mui/material";
import { useState } from "react";
import { Grid } from "../../../../components/grid/Grid";

export const ProvinceManageUsersRowPoultry = ({ row, item }) => {
  const { details } = item;

  const [checked, setChecked] = useState(details.active);

  const handleChange = () => {
    setChecked(!checked);
  };

  return (
    <TableBody>
      {/* {row.userRoles.map((userRolesRow) => ( */}
      <TableRow key={details.unitName}>
        <TableCell align="center" component="th" scope="row">
          {details.breedingUniqueId}
        </TableCell>
        <TableCell align="center">{details.unitName}</TableCell>
        <TableCell align="center">
          {details.cityOperator ? details.cityOperator : "-"}
        </TableCell>
        <TableCell align="center">{details.address.province.name}</TableCell>
        <TableCell align="center">{details.address.city.name}</TableCell>
        <TableCell align="center">{details.address.address}</TableCell>
        <TableCell align="center">{details.numberOfHalls}</TableCell>
        <TableCell align="center">
          {details.totalCapacity.toLocaleString()}
        </TableCell>
        <TableCell align="center">-</TableCell>
        <TableCell align="center">
          {details.userBankInfo && details.userBankInfo.bankName ? (
            <Grid container direction="column">
              <Grid>نام بانک: {details.userBankInfo.bankName}</Grid>
              <Grid>شماره کارت: {details.userBankInfo.card}</Grid>
              <Grid>شماره حساب: {details.userBankInfo.account}</Grid>
              <Grid>شبا: {details.userBankInfo.shaba}</Grid>
            </Grid>
          ) : (
            "-"
          )}
        </TableCell>
        <TableCell align="center">
          <Switch checked={checked} onChange={handleChange} color="primary" />
        </TableCell>
      </TableRow>
      {/* ))} */}
    </TableBody>
  );
};
