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

function Medications({ data, changeData, updateData, loading }) {
  const medications = data && data.other && data.other.medications;
  const tableHead = ["ردیف", "نام دارو", "دوز مصرفی", "تعداد و زمان مصرف", ""];
  const centerTable = [0];
  const [open, setOpen] = useState(false);

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

export default Medications;
