import CustomTable from "@/app/component/CustomTable";
import Head from "@/components/dashboard/userAccount/components/Head";
import { useState } from "react";
import ItemSurgeries from "./ItemSurgeries";
import ModalAddSurgeries from "./modal";

function Surgeries({ data, changeData, loading, updateData }) {
  const surgeries = data && data.other && data.other.surgeries;
  const tableHead = [
    "ردیف",
    "نوع جراحی",
    "نام بیمارستان",
    "سال انجام جراحی",
    "",
  ];
  const centerTable = [0, 3];
  const [open, setOpen] = useState(false);

  return (
    <div className="opacity-page">
      <Head text="لیست جراحی ها">
        <ModalAddSurgeries
          open={open}
          setOpen={setOpen}
          loading={loading}
          updateData={updateData}
          changeData={changeData}
        />
      </Head>
      {surgeries?.length ? (
        <CustomTable
          zeroRadius={true}
          tableHead={tableHead}
          centerTable={centerTable}
        >
          {surgeries?.map((row, idx) => (
            <ItemSurgeries
              key={idx}
              row={row}
              idx={idx}
              changeData={changeData}
            />
          ))}
        </CustomTable>
      ) : (
        <p className="text-center py-10 text-gray-500">هیچ جراحی وجود ندارد!</p>
      )}
    </div>
  );
}

export default Surgeries;
