handle change data and update data in dashboard page for all tabs

components/dashboard/userAccount/detailUser/medications/ItemMedication.js

@@ -3,7 +3,7 @@ import TextLoading from "@/app/component/loading/Text";
 import { TableCell, TableRow } from "@mui/material";
 import ModalEditItem from "@/components/dashboard/userAccount/components/modal/ModalEditItem";
 import Content from "./modal/Content";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 
 function ItemMedication({ row, idx, changeData }) {
   const contentData = {
@@ -14,6 +14,14 @@ function ItemMedication({ row, idx, changeData }) {
   const [data, setData] = useState(contentData);
   const resetData = () => setData(contentData);
 
+  useEffect(() => {
+    setData({
+      name: row.name,
+      dose: row.dose,
+      frequency: row.frequency,
+    });
+  }, [row]);
+
   return (
     <TableRow
       key={idx}

components/dashboard/userAccount/detailUser/medications/index.js

@@ -4,7 +4,9 @@ import { useState } from "react";
 import ItemMedication from "./ItemMedication";
 import ModalAddMedications from "./modal";
 
-function Medications({ data, changeData }) {
+function Medications({ data, changeData, updateData, loading }) {
+  const { other } = data;
+  const { medications } = other && other[0];
   const tableHead = ["ردیف", "نام دارو", "دوز مصرفی", "تعداد و زمان مصرف", ""];
   const centerTable = [0];
   const [open, setOpen] = useState(false);
@@ -15,16 +17,18 @@ function Medications({ data, changeData }) {
         <ModalAddMedications
           open={open}
           setOpen={setOpen}
+          loading={loading}
+          updateData={updateData}
           changeData={changeData}
         />
       </Head>
-      {data.medications.length ? (
+      {medications.length ? (
         <CustomTable
           zeroRadius={true}
           tableHead={tableHead}
           centerTable={centerTable}
         >
-          {data.medications.map((row, idx) => (
+          {medications.map((row, idx) => (
             <ItemMedication
               key={idx}
               row={row}

components/dashboard/userAccount/detailUser/medications/modal/index.js

@@ -6,7 +6,13 @@ import { useState } from "react";
 import Content from "./Content";
 import CloseModalD from "@/components/icons/CloseModalD";
 
-function ModalAddMedications({ open, setOpen, changeData }) {
+function ModalAddMedications({
+  open,
+  setOpen,
+  loading,
+  changeData,
+  updateData,
+}) {
   const contentItem = {
     name: "",
     dose: "",
@@ -26,7 +32,7 @@ function ModalAddMedications({ open, setOpen, changeData }) {
     <>
       {/* Button Modal */}
       <>
-        <UpdateBtn />
+        <UpdateBtn updateData={updateData} loading={loading} />
         <AddBtn handleOpen={handleOpen} />
       </>