[fixed] - closing date

src/Components/Banner/AddBanner.jsx

@@ -31,6 +31,7 @@ import Header from "../Header";
 import ToastBox from "../ToastBox";
 import BannerMainCard from "./BannerMainCard";
 
+
 const AddBanner = ({ createApi, navigateLink, title, center }) => {
   const toast = useToast();
   const navigate = useNavigate();

src/Components/Pagination.jsx

@@ -49,7 +49,7 @@ const Pagination = ({
           value={pageSize}
           onChange={handlePageSizeChange}
         >
-          {[15, 20, 30]?.map((size) => (
+          {[15, 20, 30, 500]?.map((size) => (
             <option key={size} value={size}>
               {size}
             </option>

src/Constants/Paginations.js

@@ -1,2 +1,3 @@
 export const TABLE_PAGINATION = { page: 1, size: 20 }
-export const IMAGE_URI = import.meta.env.VITE_API_IMAGE_URL
+export const IMAGE_URI = import.meta.env.VITE_API_IMAGE_URL
+export const INVESTOR_TABLE_PAGINATION = { page: 1, size: 500 }

src/Pages/IO_Management/CreateIO/IOArtifactsVideo.jsx

@@ -217,7 +217,7 @@ const IOArtifactsAdd = ({ isOpen, onClose, firstField, actionId, setActionId, da
         isOpen={alert}
         onClose={() => setAlert(false)}
         alertHandler={handleSave}
-        message={"Are you sure you want to update this artifact?"}
+        message={"Are you sure you want to add this artifact?"}
         isLoading={isLoading}
       />
     </>

src/Pages/IO_Management/CreateIO/IOCashDetails/IOCashDetails.jsx

@@ -107,7 +107,8 @@ const IOCashDetails = () => {
             </Tab>
           </TabList>
           {IODetails?.isInvestedAmount
-            ? isMaker() && (
+            ? isMaker() && 
+              IODetails?.ioSatatus !== "Exited" && (
                 <Button
                   onClick={handleAdd}
                   leftIcon={<AddIcon />}

src/Pages/IO_Management/CreateIO/IOCashDetails/Pending.jsx

@@ -38,7 +38,7 @@ import { useUpdateIOCaseMutation } from "../../../../Services/io.service";
 import RequestApproveModal from "./RequestApproveModal";
 import RequestRejectModal from "./RequestRejectModal";
 import AddCaseDetails from "./AddCaseDetails";
-import { encryptString } from "../../../../Constants/Constants";
+import { encryptString, isMaker } from "../../../../Constants/Constants";
 
 const formatDate = (date) => new Date(date).toLocaleDateString();
 
@@ -105,8 +105,7 @@ const Pending = () => {
     "Comments",
     "Update By",
     "Update On",
-    ...(localStorage?.getItem('role')!==encryptString(import.meta.env.VITE_VITE_MAKER) ? ["Actions"] : []),
-    
+    ...(!isMaker() ? ["Actions"] : []),
   ];
 
   const extractedArray = filteredData?.map((item, index) => ({
@@ -132,9 +131,9 @@ const Pending = () => {
           $
         </Badge>
         {parseFloat(item?.transactionAmount || 0).toLocaleString(undefined, {
-            minimumFractionDigits: 2,
-            maximumFractionDigits: 2,
-          })}
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })}
       </Text>
     ),
     Comments: (
@@ -167,64 +166,69 @@ const Pending = () => {
     ),
     Actions: (
       <Box display={"flex"} justifyContent={"center"}>
-        {localStorage?.getItem("role") !== encryptString(import.meta.env.VITE_VITE_MAKER)  ? <Box>
-          {index===0&&<Box display={"flex"} justifyContent={"center"} gap={2}>
-        <Tooltip
-          rounded={"sm"}
-          fontSize={"xs"}
-          label="Approve"
-          bg="#fff"
-          color={"green.500"}
-          placement="left-start"
-        >
+        {!isMaker() ? (
+          <Box>
+            {index === 0 && (
+              <Box display={"flex"} justifyContent={"center"} gap={2}>
+                <Tooltip
+                  rounded={"sm"}
+                  fontSize={"xs"}
+                  label="Approve"
+                  bg="#fff"
+                  color={"green.500"}
+                  placement="left-start"
+                >
+                  <Button
+                    // colorScheme="forestGreen"
+                    // color="green.500"
+                    rounded={"sm"}
+                    size={"xs"}
+                    textTransform={"inherit"}
+                    fontWeight={500}
+                    px={2}
+                    py={1}
+                    onClick={() => {
+                      setActionId(item.id);
+                      onConfirmOpen();
+                    }}
+                    colorScheme="green"
+                    variant={"solid"}
+                    cursor={"pointer"}
+                  >
+                    <CheckIcon fontSize={"12px"} />
+                  </Button>
+                </Tooltip>
+                <Tooltip
+                  rounded={"sm"}
+                  fontSize={"xs"}
+                  label="Reject"
+                  bg="#fff"
+                  color={"red.500"}
+                  placement="left-start"
+                >
+                  <Button
+                    colorScheme="red"
+                    // color="red.500"
+                    rounded={"sm"}
+                    size={"xs"}
+                    textTransform={"inherit"}
+                    fontWeight={500}
+                    px={2}
+                    onClick={() => {
+                      setActionId(item.id);
+                      onRejectOpen();
+                    }}
+                    py={1}
+                    // variant={"solid"}
+                  >
+                    <CloseIcon fontSize={"10px"} />
+                  </Button>
+                </Tooltip>
+              </Box>
+            )}
+          </Box>
+        ) : (
           <Button
-            // colorScheme="forestGreen"
-            // color="green.500"
-            rounded={"sm"}
-            size={"xs"}
-            textTransform={"inherit"}
-            fontWeight={500}
-            px={2}
-            py={1}
-            onClick={() => {
-              setActionId(item.id);
-              onConfirmOpen();
-            }}
-            colorScheme="green"
-            variant={"solid"}
-            cursor={"pointer"}
-          >
-            <CheckIcon fontSize={"12px"} />
-          </Button>
-        </Tooltip>
-        <Tooltip
-          rounded={"sm"}
-          fontSize={"xs"}
-          label="Reject"
-          bg="#fff"
-          color={"red.500"}
-          placement="left-start"
-        >
-          <Button
-            colorScheme="red"
-            // color="red.500"
-            rounded={"sm"}
-            size={"xs"}
-            textTransform={"inherit"}
-            fontWeight={500}
-            px={2}
-            onClick={() => {
-              setActionId(item.id);
-              onRejectOpen();
-            }}
-            py={1}
-            // variant={"solid"}
-          >
-            <CloseIcon fontSize={"10px"} />
-          </Button>
-        </Tooltip></Box>}
-        
-        </Box> : <Button
             colorScheme="green"
             rounded={"sm"}
             size={"xs"}
@@ -236,7 +240,8 @@ const Pending = () => {
             }}
           >
             <ViewIcon me={"4px"} /> View
-          </Button>}
+          </Button>
+        )}
       </Box>
     ),
   }));
@@ -314,9 +319,9 @@ const Pending = () => {
                 $
               </Badge>
               {parseFloat(IODetails?.ioCash || 0).toLocaleString(undefined, {
-            minimumFractionDigits: 2,
-            maximumFractionDigits: 2,
-          })}
+                minimumFractionDigits: 2,
+                maximumFractionDigits: 2,
+              })}
             </Th>
             <Th
               textAlign={"center"}

src/Pages/IO_Management/CreateIO/IODetails.jsx

@@ -12,11 +12,12 @@ import {
   useUpdateIOMutation,
 } from "../../../Services/io.service";
 import ToastBox from "../../../Components/ToastBox";
-import {
-  useToast,
-} from "@chakra-ui/react";
+import { useToast } from "@chakra-ui/react";
 import { formatDatee } from "../../../Components/FormField";
-import { formatDateToYYYYMMDD, removeTrailingZeros } from "../../../Constants/Constants";
+import {
+  formatDateToYYYYMMDD,
+  removeTrailingZeros,
+} from "../../../Constants/Constants";
 
 const schema = yup.object().shape({
   investmentNameEnglish: yup
@@ -25,7 +26,7 @@ const schema = yup.object().shape({
     .min(3, "IO name in English must be at least 3 characters long")
     .max(150, "IO name in English must be at most 150 characters long"),
 
-  investmentNameArabic: yup 
+  investmentNameArabic: yup
     .string()
     .required("IO name in Arabic is required")
     .min(3, "IO name in Arabic must be at least 3 characters long")
@@ -42,15 +43,15 @@ const schema = yup.object().shape({
     .required("Description in Arabic is required")
     .min(10, "Description in Arabic must be at least 10 characters long")
     .max(2000, "Description in Arabic must be at most 500 characters long"),
-    expectedReturnArabic: yup
-      .string()
-      .required("Expected return in Arabic is required"),
+  expectedReturnArabic: yup
+    .string()
+    .required("Expected return in Arabic is required"),
 
-      goalAmount: yup
-      .number()
-      .typeError("Goal Amount is must be number")
-      .required('Goal amount is required')
-      .positive('Goal amount must be a positive number'),
+  goalAmount: yup
+    .number()
+    .typeError("Goal Amount is must be number")
+    .required("Goal amount is required")
+    .positive("Goal amount must be a positive number"),
   closingDate: yup
     .date()
     .notRequired("Closing date is required")
@@ -69,28 +70,25 @@ const schema = yup.object().shape({
 
   InvestmentDetails: yup.string().notRequired(),
 
-  comment: yup.string().notRequired()
-  // .min(10, "Comment must be at least 10 characters long")
-  .max(100, "Comment must be at most 100 characters long"),
-
-  expectedReturn: yup
+  comment: yup
     .string()
-    .required("Expected return is required"),
+    .notRequired()
+    // .min(10, "Comment must be at least 10 characters long")
+    .max(100, "Comment must be at most 100 characters long"),
+
+  expectedReturn: yup.string().required("Expected return is required"),
 });
 
 const IODetails = ({ enableNextTab, index, data }) => {
-
   const params = useParams();
   const navigate = useNavigate();
   const toast = useToast();
 
-
   const handleInputChangeCreate = (index, newValue) => {
-    
     const updatedValues = [...values];
     updatedValues[index].value = newValue;
     setValues(updatedValues);
-    console.log(values); 
+    console.log(values);
   };
 
   const handleInputChangeEdit = (index, newValue) => {
@@ -143,9 +141,12 @@ const IODetails = ({ enableNextTab, index, data }) => {
   });
 
   const miniValue = data?.country?.map(
-    ({ countryName, flagIcon, minInvestmentAmt, countryCode, id, currency }, index) => {
+    (
+      { countryName, flagIcon, minInvestmentAmt, countryCode, id, currency },
+      index
+    ) => {
       return {
-        id:id,
+        id: id,
         country: countryName,
         value: minInvestmentAmt,
         logo: flagIcon,
@@ -154,18 +155,19 @@ const IODetails = ({ enableNextTab, index, data }) => {
     }
   );
 
-  const minInvestmentById = IObyID?.data?.minInvestmentAmt?.map(({minInvestmentAmt, country, currencyCode,  country_xid,id })=>{
-    console.log(currencyCode);
-    return{
-      _id:id,
-      id:country_xid,
-      country: country?.countryName,
-      value: removeTrailingZeros(minInvestmentAmt),
-      logo: country?.flagIcon,
-      curr: currencyCode,
+  const minInvestmentById = IObyID?.data?.minInvestmentAmt?.map(
+    ({ minInvestmentAmt, country, currencyCode, country_xid, id }) => {
+      console.log(currencyCode);
+      return {
+        _id: id,
+        id: country_xid,
+        country: country?.countryName,
+        value: removeTrailingZeros(minInvestmentAmt),
+        logo: country?.flagIcon,
+        curr: currencyCode,
+      };
     }
-  })
-
+  );
 
   const schemaEdit = yup.object().shape({
     investmentNameEnglish: yup
@@ -173,73 +175,67 @@ const IODetails = ({ enableNextTab, index, data }) => {
       .required("IO name in English is required")
       .min(3, "IO name in English must be at least 3 characters long")
       .max(150, "IO name in English must be at most 150 characters long"),
-  
+
     investmentNameArabic: yup
       .string()
       .required("IO name in Arabic is required")
       .min(3, "IO name in Arabic must be at least 3 characters long")
       .max(50, "IO name in Arabic must be at most 50 characters long"),
-  
+
     descriptionEnglish: yup
       .string()
       .required("Description in English is required")
       .min(10, "Description in English must be at least 10 characters long")
       .max(1000, "Description in English must be at most 1000 characters long"),
-  
+
     descriptionArabic: yup
       .string()
       .required("Description in Arabic is required")
       .min(10, "Description in Arabic must be at least 10 characters long")
       .max(2000, "Description in Arabic must be at most 500 characters long"),
-      expectedReturnArabic: yup
-        .string()
-        .required("Expected return in Arabic is required"),
-  
-        goalAmount: yup
-        .number()
-        .typeError("Goal Amount is must be number")
-        .required('Goal amount is required')
-        .positive('Goal amount must be a positive number')
-        .min(IObyID?.data?.totalAmtInvestmentInUSD, `Goal amount should not be lesser then amount raised ${IObyID?.data?.totalAmtInvestmentInUSD}`),
-    closingDate: yup
-      .date()
-      .notRequired("Closing date is required")
-      .min(new Date(), "Closing date cannot be in the past"),
-  
+    expectedReturnArabic: yup
+      .string()
+      .required("Expected return in Arabic is required"),
+
+    goalAmount: yup
+      .number()
+      .typeError("Goal Amount is must be number")
+      .required("Goal amount is required")
+      .positive("Goal amount must be a positive number")
+      .min(
+        IObyID?.data?.totalAmtInvestmentInUSD,
+        `Goal amount should not be lesser then amount raised ${IObyID?.data?.totalAmtInvestmentInUSD}`
+      ),
+    closingDate: yup.date().notRequired("Closing date is required"),
+
     holdingPeriod: yup.string().required("Holding period is required"),
     holdingPeriodArabic: yup.string().required("Holding period is required"),
     isShariah: yup.string().required("CheckBox is required"),
 
-  
     // minInvestmentAmount: yup
     //   .number()
     //   .required("Minimum investment is required")
     //   .positive("Minimum investment must be a positive number")
     //   .min(1, "Minimum investment must be at least 1"),
-  
+
     ISIN: yup.string().notRequired(),
-  
+
     InvestmentDetails: yup.string().notRequired(),
-  
-    comment: yup.string().notRequired()
-    .min(10, "Comment must be at least 10 characters long")
-    .max(100, "Comment must be at most 100 characters long"),
-  
-    expectedReturn: yup
+
+    comment: yup
       .string()
-      .required("Expected return is required"),
+      .notRequired()
+      .min(10, "Comment must be at least 10 characters long")
+      .max(100, "Comment must be at most 100 characters long"),
+
+    expectedReturn: yup.string().required("Expected return is required"),
   });
-  
-  
 
-  
-  const [values, setValues] = useState(id?minInvestmentById:miniValue);
+  const [values, setValues] = useState(id ? minInvestmentById : miniValue);
 
-  
   const formatNumber = (num) => {
     // Remove non-numeric characters and format with commas
-    return num.replace(/\D/g, '')
-              .replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+    return num.replace(/\D/g, "").replace(/\B(?=(\d{3})+(?!\d))/g, ",");
   };
   // console.log(values);
 
@@ -253,10 +249,11 @@ const IODetails = ({ enableNextTab, index, data }) => {
     formState: { errors },
   } = useForm({
     resolver: yupResolver(id ? schemaEdit : schema),
+    mode: "all",
   });
 
   useEffect(() => {
-    setIOloading(IObyIDisLoading)
+    setIOloading(IObyIDisLoading);
     setIODetails({
       ...IObyID?.data,
     });
@@ -277,10 +274,9 @@ const IODetails = ({ enableNextTab, index, data }) => {
         minInvestmentAmount: IObyID?.data?.minInvestmentAmount,
         holdingPeriodArabic: IObyID?.data?.minInvestmentAmount,
         expectedReturnArabic: IObyID?.data?.minInvestmentAmount,
-        isShariah: IObyID?.data?.isShariah
+        isShariah: IObyID?.data?.isShariah,
       });
     }
-
   }, [id, IObyID]);
 
   //=======================[ Creator ]
@@ -293,8 +289,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       isRequired: true,
       section: " ",
       width: "49%",
-      maxLength:150,
-      helperText:`Maximum length should be 150 characters. You have entered ${watch()?.investmentNameEnglish?.length || 0} characters.`
+      maxLength: 150,
+      helperText: `Maximum length should be 150 characters. You have entered ${
+        watch()?.investmentNameEnglish?.length || 0
+      } characters.`,
     },
     {
       label: "IO Name (Arabic)",
@@ -305,8 +303,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       arabic: true,
       section: " ",
       width: "49%",
-      maxLength:150,
-      helperText:`Maximum length should be 150 characters. You have entered ${watch()?.investmentNameArabic?.length || 0} characters.`
+      maxLength: 150,
+      helperText: `Maximum length should be 150 characters. You have entered ${
+        watch()?.investmentNameArabic?.length || 0
+      } characters.`,
     },
     {
       label: "Description",
@@ -316,8 +316,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       isRequired: true,
       section: " ",
       width: "49%",
-      maxLength:1000,
-      helperText:`Maximum length should be 1000 characters. You have entered ${watch()?.descriptionEnglish?.length || 0} characters.`
+      maxLength: 1000,
+      helperText: `Maximum length should be 1000 characters. You have entered ${
+        watch()?.descriptionEnglish?.length || 0
+      } characters.`,
     },
     {
       label: "Description (Arabic)",
@@ -328,9 +330,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       arabic: true,
       section: " ",
       width: "49%",
-      maxLength:1000,
-      helperText:`Maximum length should be 1000 characters. You have entered ${watch()?.descriptionArabic?.length || 0} characters.`
-      
+      maxLength: 1000,
+      helperText: `Maximum length should be 1000 characters. You have entered ${
+        watch()?.descriptionArabic?.length || 0
+      } characters.`,
     },
     {
       label: "Holding Period",
@@ -341,8 +344,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       section: " ",
       width: "49%",
       value: IObyID?.data?.holdingPeriod,
-      maxLength:20,
-      helperText:`Maximum length should be 20 characters. You have entered ${watch()?.holdingPeriod?.length || 0} characters.`
+      maxLength: 20,
+      helperText: `Maximum length should be 20 characters. You have entered ${
+        watch()?.holdingPeriod?.length || 0
+      } characters.`,
     },
     {
       label: "Holding Period (Arabic)",
@@ -354,11 +359,12 @@ const IODetails = ({ enableNextTab, index, data }) => {
       section: " ",
       width: "49%",
       value: IObyID?.data?.holdingPeriodArabic,
-      maxLength:20,
-      helperText:`Maximum length should be 20 characters. You have entered ${watch()?.holdingPeriodArabic?.length || 0} characters.`
+      maxLength: 20,
+      helperText: `Maximum length should be 20 characters. You have entered ${
+        watch()?.holdingPeriodArabic?.length || 0
+      } characters.`,
     },
 
-
     {
       label: "Expected Return",
       name: "expectedReturn",
@@ -371,7 +377,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
 
     {
       label: "Expected Return (Arabic)",
-      name: "expectedReturnArabic", 
+      name: "expectedReturnArabic",
       type: "text",
       isRequired: true,
       arabic: true,
@@ -381,16 +387,15 @@ const IODetails = ({ enableNextTab, index, data }) => {
     },
     {
       label: "Shariah",
-      name: "isShariah", 
+      name: "isShariah",
       type: "checkBox",
-      value:IObyID?.data?.isShariah,
+      value: IObyID?.data?.isShariah,
       // isRequired: true,
       section: " ",
       width: "32.3%",
       value: IObyID?.data?.isShariah,
     },
 
-
     {
       label: "Investment Type",
       placeHolder: "Select option",
@@ -428,19 +433,19 @@ const IODetails = ({ enableNextTab, index, data }) => {
       name: "closingDate",
       // value: "IObyID?.data?.closingDate",
       type: "date",
-      isRequired: true,
+      // isRequired: true,
       section: " ",
       width: "32.3%",
-      dateValue:formatDatee(IObyID?.data?.closingDate),
+      dateValue: formatDatee(IObyID?.data?.closingDate),
       // helperText: IObyID && `Current closing date is : ${formatDate(IObyID?.data?.closingDate)}`
-      closingDate:true
+      closingDate:id ? null : true
     },
     {
       label: "ISIN",
       placeHolder: "",
       name: "ISIN",
       type: "text",
-      align:"right",
+      align: "right",
       section: " ",
       width: "32.3%",
     },
@@ -452,8 +457,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       section: " ",
       width: "32.3%",
       value: IObyID?.data?.InvestmentDetails,
-      maxLength:20,
-      helperText:`Maximum length should be 20 characters. You have entered ${watch()?.InvestmentDetails?.length || 0} characters.`
+      maxLength: 20,
+      helperText: `Maximum length should be 20 characters. You have entered ${
+        watch()?.InvestmentDetails?.length || 0
+      } characters.`,
     },
 
     {
@@ -462,10 +469,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       name: "table",
       type: "table",
       section: " ",
-      width: "100%", 
+      width: "100%",
       isRequired: true,
       options: investmentTypeOptions,
-      handleInputChange:id ?  handleInputChangeEdit : handleInputChangeCreate,
+      handleInputChange: id ? handleInputChangeEdit : handleInputChangeCreate,
       value: values,
     },
 
@@ -478,8 +485,10 @@ const IODetails = ({ enableNextTab, index, data }) => {
       width: "100%",
       options: investmentTypeOptions,
       value: IObyID?.data?.comment,
-      maxLength:100,
-      helperText:`Maximum length should be 100 characters. You have entered ${watch()?.comment?.length || 0} characters.`
+      maxLength: 100,
+      helperText: `Maximum length should be 100 characters. You have entered ${
+        watch()?.comment?.length || 0
+      } characters.`,
     },
   ];
   const groupedFields = formFields.reduce((groups, field) => {
@@ -492,30 +501,29 @@ const IODetails = ({ enableNextTab, index, data }) => {
   }, {});
 
   const onSubmit = async (data) => {
-
     delete data.table;
 
     setIsLoading(true);
-    const updatedMinAmount = values?.map(({id, value, _id})=>{
+    const updatedMinAmount = values?.map(({ id, value, _id }) => {
       return {
-        id:_id,
-        country_xid:id,
-        minInvestmentAmt: Number(value)
-      }
-    })
+        id: _id,
+        country_xid: id,
+        minInvestmentAmt: Number(value),
+      };
+    });
 
     // console.log(formatDateToYYYYMMDD(data.closingDate));
     const formData = {
       ...data,
       investmentType_xid: Number(data.investmentType),
       sponsor_xid: Number(data.sponserName),
-    minInvestmentAmt:updatedMinAmount,
-    closingDate: formatDateToYYYYMMDD(data.closingDate)
+      minInvestmentAmt: updatedMinAmount,
+      closingDate: formatDateToYYYYMMDD(data.closingDate),
     };
 
     // console.log(formData);
     if (id) {
-      console.log("========================",formData);
+      console.log("========================", formData);
       const res = await updateIO({ data: formData, id });
       console.log(res);
       if (res?.data?.statusCode === 200) {
@@ -525,20 +533,24 @@ const IODetails = ({ enableNextTab, index, data }) => {
         });
         navigate(`/view-io/${id}`);
         enableNextTab(index);
-      } else if(res?.error?.status === 400){
+      } else if (res?.error?.status === 400) {
         setIsLoading(false);
         toast({
-          render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
-        }); 
-      } else if(res?.error?.status === 500){
+          render: () => (
+            <ToastBox message={res?.error?.data?.message} status={"error"} />
+          ),
+        });
+      } else if (res?.error?.status === 500) {
         setIsLoading(false);
         toast({
-          render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
+          render: () => (
+            <ToastBox message={res?.error?.data?.message} status={"error"} />
+          ),
         });
       }
     } else {
       try {
-        console.log("========================",formData);
+        console.log("========================", formData);
         const res = await creatIO(formData);
         console.log(res?.error?.status);
         if (res?.data?.statusCode === 200) {
@@ -548,15 +560,19 @@ const IODetails = ({ enableNextTab, index, data }) => {
           });
           navigate(`/view-io/${res?.data?.data}`);
           enableNextTab(index);
-        } else if(res?.error?.status === 400){
+        } else if (res?.error?.status === 400) {
           setIsLoading(false);
           toast({
-            render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
+            render: () => (
+              <ToastBox message={res?.error?.data?.message} status={"error"} />
+            ),
           });
-        }else if(res?.error?.status === 500){
+        } else if (res?.error?.status === 500) {
           setIsLoading(false);
           toast({
-            render: () => <ToastBox message={res?.error?.data?.message } status={"error"} />,
+            render: () => (
+              <ToastBox message={res?.error?.data?.message} status={"error"} />
+            ),
           });
         }
       } catch (error) {
@@ -565,7 +581,6 @@ const IODetails = ({ enableNextTab, index, data }) => {
       }
     }
 
-
     // ==========================
     // if (params?.id) {
     //   return enableNextTab(index);
@@ -583,9 +598,8 @@ const IODetails = ({ enableNextTab, index, data }) => {
   };
 
   return IObyIDisLoading ? (
-    <FullscreenLoaders height={'70vh'} />
+    <FullscreenLoaders height={"70vh"} />
   ) : (
-    
     <FormInputMain
       p={0.1}
       w={250}

src/Pages/IO_Management/CreateIO/IONAVDetails/IONAVDetails.jsx

@@ -153,7 +153,8 @@ const IONAVDetails = () => {
             </Tab>
           </TabList>
           {IODetails?.isInvestedAmount
-            ? isMaker() && (
+            ? isMaker() && 
+            IODetails?.ioSatatus !== "Exited" && (
                 <Button
                   onClick={handleAdd}
                   leftIcon={<AddIcon />}

src/Pages/IO_Management/CreateIO/IONAVDetails/Pending.jsx

@@ -22,7 +22,7 @@ import ToastBox from "../../../../Components/ToastBox";
 import AddNavDetails from "./AddNavDetails";
 import RequestApproveModal from "./RequestApproveModal";
 import RequestRejectModal from "./RequestRejectModal";
-import { encryptString } from "../../../../Constants/Constants";
+import { encryptString, isMaker } from "../../../../Constants/Constants";
 
 const formatDate = (date) => new Date(date).toLocaleDateString();
 
@@ -91,7 +91,7 @@ const Pending = () => {
     "Investment Closed",
     "Comments",
     "Updated By",
-    ...(localStorage?.getItem("role") !== encryptString(import.meta.env.VITE_VITE_MAKER) ? ["Status"] : []),
+    ...(!isMaker() ? ["Status"] : []),
   ];
 
   const extractedArray = filteredData?.map((item, index) => ({
@@ -112,9 +112,9 @@ const Pending = () => {
           $
         </Badge>
         {parseFloat(item?.transactionAmount || 0).toLocaleString(undefined, {
-            minimumFractionDigits: 2,
-            maximumFractionDigits: 2,
-          })}
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })}
       </Text>
     ),
     "Last Nav Update": (
@@ -162,66 +162,80 @@ const Pending = () => {
         {item?.modifier?.firstName}
       </Text>
     ),
-    Status: (
+    Status: isMaker() ? (
+      <Button
+        colorScheme="green"
+        rounded={"sm"}
+        size={"xs"}
+        px={2}
+        py={1}
+        fontWeight={500}
+        onClick={() => {
+          setActionId(item.id);
+        }}
+      >
+        <ViewIcon me={"4px"} /> View
+      </Button>
+    ) : (
       <Box display={"flex"} justifyContent={"center"}>
-       <Box>
+        <Box>
           <Box display={"flex"} justifyContent={"center"} gap={2}>
-        <Tooltip
-          rounded={"sm"}
-          fontSize={"xs"}
-          label="Approve"
-          bg="#fff"
-          color={"green.500"}
-          placement="left-start"
-        >
-          <Button
-            // colorScheme="forestGreen"
-            // color="green.500"
-            rounded={"sm"}
-            size={"xs"}
-            textTransform={"inherit"}
-            fontWeight={500}
-            px={2}
-            py={1}
-            onClick={() => {
-              setActionId(item.id);
-              onConfirmOpen();
-            }}
-            colorScheme="green"
-            variant={"solid"}
-            cursor={"pointer"}
-          >
-            <CheckIcon fontSize={"12px"} />
-          </Button>
-        </Tooltip>
-        <Tooltip
-          rounded={"sm"}
-          fontSize={"xs"}
-          label="Reject"
-          bg="#fff"
-          color={"red.500"}
-          placement="left-start"
-        >
-          <Button
-            colorScheme="red"
-            // color="red.500"
-            rounded={"sm"}
-            size={"xs"}
-            textTransform={"inherit"}
-            fontWeight={500}
-            px={2}
-            onClick={() => {
-              setActionId(item.id);
-              onRejectOpen();
-            }}
-            py={1}
-            // variant={"solid"}
-          >
-            <CloseIcon fontSize={"10px"} />
-          </Button>
-        </Tooltip>
+            <Tooltip
+              rounded={"sm"}
+              fontSize={"xs"}
+              label="Approve"
+              bg="#fff"
+              color={"green.500"}
+              placement="left-start"
+            >
+              <Button
+                // colorScheme="forestGreen"
+                // color="green.500"
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={2}
+                py={1}
+                onClick={() => {
+                  setActionId(item.id);
+                  onConfirmOpen();
+                }}
+                colorScheme="green"
+                variant={"solid"}
+                cursor={"pointer"}
+              >
+                <CheckIcon fontSize={"12px"} />
+              </Button>
+            </Tooltip>
+            <Tooltip
+              rounded={"sm"}
+              fontSize={"xs"}
+              label="Reject"
+              bg="#fff"
+              color={"red.500"}
+              placement="left-start"
+            >
+              <Button
+                colorScheme="red"
+                // color="red.500"
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={2}
+                onClick={() => {
+                  setActionId(item.id);
+                  onRejectOpen();
+                }}
+                py={1}
+                // variant={"solid"}
+              >
+                <CloseIcon fontSize={"10px"} />
+              </Button>
+            </Tooltip>
+          </Box>
         </Box>
-        </Box> 
       </Box>
     ),
   }));

src/Pages/IO_Management/CreateIO/IOTransaction/Pending.jsx

@@ -1,33 +1,26 @@
+import { ViewIcon } from "@chakra-ui/icons";
 import {
-  Avatar,
   Badge,
   Box,
   Button,
   HStack,
   Input,
-  Table,
-  Tag,
-  Tbody,
   Text,
-  Th,
-  Tooltip,
-  Tr,
   useDisclosure,
   useToast,
 } from "@chakra-ui/react";
 import React, { useContext, useEffect, useRef, useState } from "react";
-import { OPACITY_ON_LOAD } from "../../../../Layout/animations";
-import NormalTable from "../../../../Components/DataTable/NormalTable";
-import GlobalStateContext from "../../../../Contexts/GlobalStateContext";
 import CustomAlertDialog from "../../../../Components/CustomAlertDialog";
-import { CheckIcon, CloseIcon, ViewIcon } from "@chakra-ui/icons";
+import NormalTable from "../../../../Components/DataTable/NormalTable";
+import { isMaker } from "../../../../Constants/Constants";
+import GlobalStateContext from "../../../../Contexts/GlobalStateContext";
+import { OPACITY_ON_LOAD } from "../../../../Layout/animations";
 import RequestApproveModal from "./RequestApproveModal";
 import RequestRejectModal from "./RequestRejectModal";
 import ViewAmountInvested from "./ViewAmountInvested";
+import ViewCancel from "./ViewCancel";
 import ViewDistributionInvestor from "./ViewDistributionInvestor";
 import ViewExit from "./ViewExit";
-import ViewCancel from "./ViewCancel";
-import { encryptString, isMaker } from "../../../../Constants/Constants";
 
 const formatDate = (date) => new Date(date).toLocaleDateString();
 
@@ -43,6 +36,7 @@ const Pending = () => {
   const [actionId, setActionId] = useState(false);
   const [mouseEntered, setMouseEntered] = useState(false);
   const [mouseEnteredId, setMouseEnteredId] = useState("");
+  const [distributedAmt, setDistributedAmt] = useState();
 
   const {
     isOpen: isConfirmOpen,
@@ -93,11 +87,6 @@ const Pending = () => {
     });
   };
 
-  console.log(
-    "==============panding",
-    IODetails?.ioTransactionRecords?.Pending
-  );
-
   // Table filter
   // const filteredData = IODetails?.ioTransactionRecords?.Pending?.filter((item) => {
   //   // Filter by name (case insensitive)
@@ -148,6 +137,11 @@ const Pending = () => {
           })}
         </Text>
       ),
+      // Amount:(
+      //   <div>
+      //     <ViewDistributionInvestor amount={item?.transactionAmount} />
+      //   </div>
+      // ),
       "Created By": (
         <Text
           textTransform={"capitalize"}
@@ -195,6 +189,7 @@ const Pending = () => {
                 onInvestmentOpen();
               } else if (item?.transactionType === "Distribution To Investor") {
                 onDistInvestorOpen();
+                setDistributedAmt(item?.transactionAmount);
               } else if (item?.transactionType === "Exit") {
                 onExitOpen();
               } else if (item?.transactionType === "Cancel") {
@@ -203,16 +198,15 @@ const Pending = () => {
             }}
           >
             {isMaker() ? <ViewIcon me={"4px"} /> : null}{" "}
-            {localStorage?.getItem("role") ===
-            encryptString(import.meta.env.VITE_VITE_MAKER)
-              ? "View"
-              : "Approve / Reject"}
+            {isMaker() ? "View" : "Approve / Reject"}
           </Button>
         </Box>
       ),
     })
   );
 
+  
+
   const handleDelete = () => {
     const updatedSponsors = sponser.filter(
       (sponsor) => sponsor.id !== actionId
@@ -276,6 +270,7 @@ const Pending = () => {
         isOpen={isDistInvestorOpen}
         onClose={onDistInvestorClose}
         id={actionId}
+        amount={distributedAmt}
       />
       <ViewExit isOpen={isExitOpen} onClose={onExitClose} id={actionId} />
       <ViewCancel isOpen={isCancelOpen} onClose={onCancelClose} id={actionId} />

src/Pages/IO_Management/CreateIO/IOTransaction/ViewAmountInvested.jsx

@@ -27,7 +27,7 @@ import CurrencyInput from "../../../../Components/CurrencyInput";
 import RequestRejectModal from "./RequestRejectModal";
 import ApproveInvestedModal from "./ApproveInvestedModal";
 import { formatDate } from "../../../Master/Sponser/Sponsers";
-import { encryptString } from "../../../../Constants/Constants";
+import { encryptString, isMaker } from "../../../../Constants/Constants";
 
 // Validation schema
 const validationSchema = yup.object().shape({
@@ -117,7 +117,6 @@ const ViewAmountInvested = ({ isOpen, onClose, id: investorId }) => {
   };
 
   // const formatDate = (date) => new Date(date).toLocaleDateString();
-  
 
   const handleAmountChange = (e) => {
     // e might be an object or just a value, handle both cases
@@ -237,41 +236,43 @@ const ViewAmountInvested = ({ isOpen, onClose, id: investorId }) => {
               />
             </FormControl>
 
-            {localStorage?.getItem("role") !== encryptString(import.meta.env.VITE_VITE_MAKER) && <ModalFooter>
-              <Box display={"flex"} justifyContent={"center"} gap={2}>
-                <Button
-                  rounded={"sm"}
-                  size={"xs"}
-                  textTransform={"inherit"}
-                  fontWeight={500}
-                  px={3}
-                  py={2}
-                  onClick={() => {
-                    setActionId(id); // Use the `id` variable from params
-                    onConfirmOpen();
-                  }}
-                  colorScheme="forestGreen"
-                  variant={"solid"}
-                  cursor={"pointer"}
-                >
-                  Approve
-                </Button>
-                <Button
-                  rounded={"sm"}
-                  size={"xs"}
-                  textTransform={"inherit"}
-                  fontWeight={500}
-                  px={3}
-                  py={2}
-                  onClick={() => {
-                    setActionId(id); // Use the `id` variable from params
-                    onRejectOpen();
-                  }}
-                >
-                  Reject
-                </Button>
-              </Box>
-            </ModalFooter>}
+            {!isMaker() && (
+              <ModalFooter>
+                <Box display={"flex"} justifyContent={"center"} gap={2}>
+                  <Button
+                    rounded={"sm"}
+                    size={"xs"}
+                    textTransform={"inherit"}
+                    fontWeight={500}
+                    px={3}
+                    py={2}
+                    onClick={() => {
+                      setActionId(id); // Use the `id` variable from params
+                      onConfirmOpen();
+                    }}
+                    colorScheme="forestGreen"
+                    variant={"solid"}
+                    cursor={"pointer"}
+                  >
+                    Approve
+                  </Button>
+                  <Button
+                    rounded={"sm"}
+                    size={"xs"}
+                    textTransform={"inherit"}
+                    fontWeight={500}
+                    px={3}
+                    py={2}
+                    onClick={() => {
+                      setActionId(id); // Use the `id` variable from params
+                      onRejectOpen();
+                    }}
+                  >
+                    Reject
+                  </Button>
+                </Box>
+              </ModalFooter>
+            )}
           </form>
         </ModalBody>
       </ModalContent>

src/Pages/IO_Management/CreateIO/IOTransaction/ViewCancel.jsx

@@ -1,128 +1,128 @@
 import {
-    Badge,
-    Box,
-    Button,
-    HStack,
-    Modal,
-    ModalBody,
-    ModalCloseButton,
-    ModalContent,
-    ModalFooter,
-    ModalHeader,
-    ModalOverlay,
-    Table,
-    Tbody,
-    Text,
-    Th,
-    Tr,
-    useDisclosure,
-    useToast,
-  } from "@chakra-ui/react";
-  import NormalData from "../../../../Components/DataTable/NormalTable";
-  import { useContext, useState } from "react";
-  import {
-    useExitIOTransactionMutation,
-    useGetDistributedToInvestorMutation,
-    useGetDistributionInvestorMutation,
-    useGetIOByIdQuery,
-  } from "../../../../Services/io.service";
-  import { useParams } from "react-router-dom";
-  import { useEffect } from "react";
-  import { useForm } from "react-hook-form";
-  import * as yup from "yup";
-  import { yupResolver } from "@hookform/resolvers/yup";
-  import ToastBox from "../../../../Components/ToastBox";
-  import GlobalStateContext from "../../../../Contexts/GlobalStateContext";
+  Badge,
+  Box,
+  Button,
+  HStack,
+  Modal,
+  ModalBody,
+  ModalCloseButton,
+  ModalContent,
+  ModalFooter,
+  ModalHeader,
+  ModalOverlay,
+  Table,
+  Tbody,
+  Text,
+  Th,
+  Tr,
+  useDisclosure,
+  useToast,
+} from "@chakra-ui/react";
+import NormalData from "../../../../Components/DataTable/NormalTable";
+import { useContext, useState } from "react";
+import {
+  useExitIOTransactionMutation,
+  useGetDistributedToInvestorMutation,
+  useGetDistributionInvestorMutation,
+  useGetIOByIdQuery,
+} from "../../../../Services/io.service";
+import { useParams } from "react-router-dom";
+import { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import ToastBox from "../../../../Components/ToastBox";
+import GlobalStateContext from "../../../../Contexts/GlobalStateContext";
 import ApprovedCancelTransaction from "./ApprovedCancelTransaction";
 import RequestRejectModal from "./RequestRejectModal";
-import { encryptString } from "../../../../Constants/Constants";
-  
-  const ViewCancel = ({ isOpen, onClose,id:cancleId }) => {
-    const params = useParams();
-    const toast = useToast();
-    const id = params?.id;
-    const [isCalculateLoading, setIsCalculateLoading] = useState(false);
-    const [isFinalCalculateLoading, setIsFinalCalculateLoading] = useState(false);
-    const [calcualtedData, setCalculatedDate] = useState(null);
-    const [isCalcualtedData, setIsCalcualtedData] = useState(false);
-    const { investors, setInvestors, slideFromRight, IODetails } =
+import { encryptString, isMaker } from "../../../../Constants/Constants";
+
+const ViewCancel = ({ isOpen, onClose, id: cancleId }) => {
+  const params = useParams();
+  const toast = useToast();
+  const id = params?.id;
+  const [isCalculateLoading, setIsCalculateLoading] = useState(false);
+  const [isFinalCalculateLoading, setIsFinalCalculateLoading] = useState(false);
+  const [calcualtedData, setCalculatedDate] = useState(null);
+  const [isCalcualtedData, setIsCalcualtedData] = useState(false);
+  const { investors, setInvestors, slideFromRight, IODetails } =
     useContext(GlobalStateContext);
 
-    const [actionId, setActionId] = useState(false);
+  const [actionId, setActionId] = useState(false);
 
-    const {
-      isOpen: isConfirmOpen,
-      onOpen: onConfirmOpen,
-      onClose: onConfirmClose,
-    } = useDisclosure();
-    const {
-      isOpen: isRejectOpen,
-      onOpen: onRejectOpen,
-      onClose: onRejectClose,
-    } = useDisclosure();
-  
-    const investorExit = yup.object().shape({
-      amount: yup
-        .string()
-        .required("Amount is required")
-        .test(
-          "max",
-          `Distribution amount should not be greater than IO cash amount ${IODetails?.ioCash}`,
-          function (value) {
-            const { ioCash } = IODetails || {}; // Safely get ioCash
-            if (value && ioCash) {
-              return parseFloat(value) <= parseFloat(ioCash); // Ensure both are compared as numbers
-            }
-            return true; // If ioCash is not available, skip validation
+  const {
+    isOpen: isConfirmOpen,
+    onOpen: onConfirmOpen,
+    onClose: onConfirmClose,
+  } = useDisclosure();
+  const {
+    isOpen: isRejectOpen,
+    onOpen: onRejectOpen,
+    onClose: onRejectClose,
+  } = useDisclosure();
+
+  const investorExit = yup.object().shape({
+    amount: yup
+      .string()
+      .required("Amount is required")
+      .test(
+        "max",
+        `Distribution amount should not be greater than IO cash amount ${IODetails?.ioCash}`,
+        function (value) {
+          const { ioCash } = IODetails || {}; // Safely get ioCash
+          if (value && ioCash) {
+            return parseFloat(value) <= parseFloat(ioCash); // Ensure both are compared as numbers
           }
-        ),
-    });
-  
-    const {
-      control,
-      handleSubmit,
-      formState: { errors },
-      reset,
-    } = useForm({
-      resolver: yupResolver(investorExit),
-    });
-  
-    useEffect(() => {
-      console.log("hiit     useEffectc");
-      if (id && IODetails) {
-        handleCalculate(id, {
-          amount: IODetails?.ioMVNAV,
-        });
-       }
-      reset({
+          return true; // If ioCash is not available, skip validation
+        }
+      ),
+  });
+
+  const {
+    control,
+    handleSubmit,
+    formState: { errors },
+    reset,
+  } = useForm({
+    resolver: yupResolver(investorExit),
+  });
+
+  useEffect(() => {
+    console.log("hiit     useEffectc");
+    if (id && IODetails) {
+      handleCalculate(id, {
         amount: IODetails?.ioMVNAV,
       });
-    }, [IODetails, id]);
-  
-    const handleCalculate = async (id, data) => {
-      try {
-        const res = await getDistributionInvestment({ id, data });
-        console.log(res?.data?.data);
-  
-        if (res?.error?.status === 401) { 
-          setIsCalculateLoading(false);
-          setIsCalcualtedData(false);
-        } else if (res?.data?.statusCode === 200) {
-          setCalculatedDate(res?.data?.data);
-          setIsCalculateLoading(false);
-          setIsCalcualtedData(true);
-        }
-      } catch (error) {}
-    };
-  
-    const [getDistributionInvestment] = useGetDistributionInvestorMutation();
-  
-    const investor = yup.object().shape({
-      amount: yup.string().required("Amount is required"),
+    }
+    reset({
+      amount: IODetails?.ioMVNAV,
     });
-  
-    // ====================================================[Table Setup]================================================================
-    const tableHeadRow = [
+  }, [IODetails, id]);
+
+  const handleCalculate = async (id, data) => {
+    try {
+      const res = await getDistributionInvestment({ id, data });
+      console.log(res?.data?.data);
+
+      if (res?.error?.status === 401) {
+        setIsCalculateLoading(false);
+        setIsCalcualtedData(false);
+      } else if (res?.data?.statusCode === 200) {
+        setCalculatedDate(res?.data?.data);
+        setIsCalculateLoading(false);
+        setIsCalcualtedData(true);
+      }
+    } catch (error) {}
+  };
+
+  const [getDistributionInvestment] = useGetDistributionInvestorMutation();
+
+  const investor = yup.object().shape({
+    amount: yup.string().required("Amount is required"),
+  });
+
+  // ====================================================[Table Setup]================================================================
+  const tableHeadRow = [
     "Client ID",
     "First name",
     "Last name",
@@ -134,221 +134,223 @@ import { encryptString } from "../../../../Constants/Constants";
     "Distribution Percent",
     "Total Return",
     "Total return on Investment",
-    ];
-  
-    const extractedArray = IODetails?.investors?.map((item, index) => ({
-        id: item?.id,
-        "Client ID": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "center"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            {item?.clientReference_id}
-          </Text>
-        ),
-        "First name": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "center"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            {item.firstName}
-          </Text>
-        ),
-        "Last name": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "center"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            {item.lastName}
-          </Text>
-        ),
-        "Investment amount": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "left"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            <Badge ms={1} colorScheme="green" me={1}>
-              $
-            </Badge>
-            {/* {`$${formatCurrency(item.InvestedAmount_USD)}`} */}
-            {`${parseFloat(item.InvestedAmount_USD || 0).toLocaleString(undefined, {
-              minimumFractionDigits: 2,
-              maximumFractionDigits: 2,
-            })}`}
-          </Text>
-        ),
-        Percentage: (
-          <Text
-            justifyContent={slideFromRight ? "right" : "center"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            {item.Investor_Holidings} %
-          </Text>
-        ),
-        "Market Value": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "left"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            <Badge ms={1} colorScheme="green" me={1}>
-              $
-            </Badge>
-            {`${parseFloat(item.Market_Value || 0).toLocaleString(undefined, {
-              minimumFractionDigits: 2,
-              maximumFractionDigits: 2,
-            })}`}
-          </Text>
-        ),
-        "Return on Investment": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "center"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            h={6}
-            className="d-flex align-items-center web-text-small"
-          >
-            {item.Return_On_Investment || 0} %
-          </Text>
-        ),
-        Distribution: (
-          <Text
-            justifyContent={slideFromRight ? "right" : "left"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            <Badge ms={1} colorScheme="green" me={1}>
-              $
-            </Badge>
-            {/* {`$${item.Distribution_Amt}`} */}
-            {`${parseFloat(item.Distribution_Amt || 0).toLocaleString(undefined, {
-              minimumFractionDigits: 2,
-              maximumFractionDigits: 2,
-            })}`}
-          </Text>
-        ),
-        "Distribution Percent": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "center"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            {/* {`$${item.Distribution_Amt}`} */}
-            {`${parseFloat(item.Distribution_Per || 0).toLocaleString(undefined, {
-              minimumFractionDigits: 2,
-              maximumFractionDigits: 2,
-            })} %`}
-          </Text>
-        ),
-        "Total Return": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "left"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            <Badge ms={1} colorScheme="green" me={1}>
-              $
-            </Badge>
-            {/* {`$${formatCurrency(item.Total_Return) || 0}`} */}
-            {`${parseFloat(item.Total_Return || 0).toLocaleString(undefined, {
-              minimumFractionDigits: 2,
-              maximumFractionDigits: 2,
-            })}`}
-          </Text>
-        ),
-        "Total return on Investment": (
-          <Text
-            justifyContent={slideFromRight ? "right" : "center"}
-            as={"span"}
-            color={"teal.900"}
-            fontWeight={"500"}
-            className="d-flex align-items-center web-text-small"
-          >
-            {item.Total_Return_On_Investment || 0} %
-          </Text>
-        ),
-      }));
-  
-    const handleClose = () => {
-      onClose();
-      setIsFinalCalculateLoading(false);
-      setIsCalcualtedData(false);
-    };
-  
-    return (
-      <Modal size={"xl"} isOpen={isOpen} onClose={handleClose} >
-        <ModalOverlay />
-        <ModalContent maxW={1000}>
-          <ModalHeader fontSize={"md"}>Cancel Transaction</ModalHeader>
-          <ModalCloseButton />
-          <ModalBody>
-            <NormalData
-              emptyMessage={`We don't have any Sponers `}
-              tableHeadRow={tableHeadRow}
-              data={extractedArray}
-            />
-          </ModalBody>
-          {localStorage?.getItem("role") !== encryptString(import.meta.env.VITE_VITE_MAKER) && <ModalFooter pt={0}>
+  ];
+
+  const extractedArray = IODetails?.investors?.map((item, index) => ({
+    id: item?.id,
+    "Client ID": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "center"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        {item?.clientReference_id}
+      </Text>
+    ),
+    "First name": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "center"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        {item.firstName}
+      </Text>
+    ),
+    "Last name": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "center"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        {item.lastName}
+      </Text>
+    ),
+    "Investment amount": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "left"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        <Badge ms={1} colorScheme="green" me={1}>
+          $
+        </Badge>
+        {/* {`$${formatCurrency(item.InvestedAmount_USD)}`} */}
+        {`${parseFloat(item.InvestedAmount_USD || 0).toLocaleString(undefined, {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })}`}
+      </Text>
+    ),
+    Percentage: (
+      <Text
+        justifyContent={slideFromRight ? "right" : "center"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        {item.Investor_Holidings} %
+      </Text>
+    ),
+    "Market Value": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "left"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        <Badge ms={1} colorScheme="green" me={1}>
+          $
+        </Badge>
+        {`${parseFloat(item.Market_Value || 0).toLocaleString(undefined, {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })}`}
+      </Text>
+    ),
+    "Return on Investment": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "center"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        h={6}
+        className="d-flex align-items-center web-text-small"
+      >
+        {item.Return_On_Investment || 0} %
+      </Text>
+    ),
+    Distribution: (
+      <Text
+        justifyContent={slideFromRight ? "right" : "left"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        <Badge ms={1} colorScheme="green" me={1}>
+          $
+        </Badge>
+        {/* {`$${item.Distribution_Amt}`} */}
+        {`${parseFloat(item.Distribution_Amt || 0).toLocaleString(undefined, {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })}`}
+      </Text>
+    ),
+    "Distribution Percent": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "center"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        {/* {`$${item.Distribution_Amt}`} */}
+        {`${parseFloat(item.Distribution_Per || 0).toLocaleString(undefined, {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })} %`}
+      </Text>
+    ),
+    "Total Return": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "left"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        <Badge ms={1} colorScheme="green" me={1}>
+          $
+        </Badge>
+        {/* {`$${formatCurrency(item.Total_Return) || 0}`} */}
+        {`${parseFloat(item.Total_Return || 0).toLocaleString(undefined, {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        })}`}
+      </Text>
+    ),
+    "Total return on Investment": (
+      <Text
+        justifyContent={slideFromRight ? "right" : "center"}
+        as={"span"}
+        color={"teal.900"}
+        fontWeight={"500"}
+        className="d-flex align-items-center web-text-small"
+      >
+        {item.Total_Return_On_Investment || 0} %
+      </Text>
+    ),
+  }));
+
+  const handleClose = () => {
+    onClose();
+    setIsFinalCalculateLoading(false);
+    setIsCalcualtedData(false);
+  };
+
+  return (
+    <Modal size={"xl"} isOpen={isOpen} onClose={handleClose}>
+      <ModalOverlay />
+      <ModalContent maxW={1000}>
+        <ModalHeader fontSize={"md"}>Cancel Transaction</ModalHeader>
+        <ModalCloseButton />
+        <ModalBody>
+          <NormalData
+            emptyMessage={`We don't have any Sponers `}
+            tableHeadRow={tableHeadRow}
+            data={extractedArray}
+          />
+        </ModalBody>
+        {!isMaker() && (
+          <ModalFooter pt={0}>
             <Box display={"flex"} justifyContent={"center"} gap={2}>
-                <Button
-                  rounded={"sm"}
-                  size={"xs"}
-                  textTransform={"inherit"}
-                  fontWeight={500}
-                  px={3}
-                  py={2}
-                  onClick={() => {
-                    setActionId(id); // Use the `id` variable from params
-                    onConfirmOpen();
-                  }}
-                  colorScheme="forestGreen"
-                  variant={"solid"}
-                  cursor={"pointer"}
-                >
-                  Approve
-                </Button>
-                <Button
-                  rounded={"sm"}
-                  size={"xs"}
-                  textTransform={"inherit"}
-                  fontWeight={500}
-                  px={3}
-                  py={2}
-                  onClick={() => {
-                    setActionId(id); // Use the `id` variable from params
-                    onRejectOpen();
-                  }}
-                >
-                  Reject
-                </Button>
+              <Button
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={3}
+                py={2}
+                onClick={() => {
+                  setActionId(id); // Use the `id` variable from params
+                  onConfirmOpen();
+                }}
+                colorScheme="forestGreen"
+                variant={"solid"}
+                cursor={"pointer"}
+              >
+                Approve
+              </Button>
+              <Button
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={3}
+                py={2}
+                onClick={() => {
+                  setActionId(id); // Use the `id` variable from params
+                  onRejectOpen();
+                }}
+              >
+                Reject
+              </Button>
             </Box>
-          </ModalFooter>}
-        </ModalContent>
-        <ApprovedCancelTransaction
+          </ModalFooter>
+        )}
+      </ModalContent>
+      <ApprovedCancelTransaction
         isOpen={isConfirmOpen}
         onClose={onConfirmClose}
         onBigModalClose={onClose}
@@ -360,9 +362,8 @@ import { encryptString } from "../../../../Constants/Constants";
         onBigModalClose={onClose}
         id={cancleId}
       />
-      </Modal>
-    );
-  };
-  
-  export default ViewCancel;
-  
+    </Modal>
+  );
+};
+
+export default ViewCancel;

src/Pages/IO_Management/CreateIO/IOTransaction/ViewDistributionInvestor.jsx

@@ -23,9 +23,9 @@ import { yupResolver } from "@hookform/resolvers/yup";
 import GlobalStateContext from "../../../../Contexts/GlobalStateContext";
 import ApproveDistrubationModal from "./ApproveDistrubationModal";
 import RequestRejectModal from "./RequestRejectModal";
-import { encryptString } from "../../../../Constants/Constants";
+import { encryptString, isMaker } from "../../../../Constants/Constants";
 
-const ViewDistributionInvestor = ({ isOpen, onClose,id:exitId }) => {
+const ViewDistributionInvestor = ({ isOpen, onClose, id: exitId, amount }) => {
   const params = useParams();
   const toast = useToast();
   const id = params?.id;
@@ -72,19 +72,15 @@ const ViewDistributionInvestor = ({ isOpen, onClose,id:exitId }) => {
   });
 
   useEffect(() => {
-    console.log("hiit     useEffectc");
-    // handleCalculate(id, {
-    //   amount: IODetails?.ioMVNAV,
-    // });
     if (id && IODetails) {
       handleCalculate(id, {
-        amount: IODetails?.ioMVNAV,
+        amount: Math.abs(amount),
       });
-     }
+    }
     reset({
-      amount: IODetails?.ioMVNAV,
+      amount: amount,
     });
-  }, [IODetails, id]);
+  }, [IODetails, id, amount]);
 
   const handleCalculate = async (id, data) => {
     try {
@@ -176,7 +172,7 @@ const ViewDistributionInvestor = ({ isOpen, onClose,id:exitId }) => {
     "Distriution Amt($)": (
       <Box minW={24} isTruncated={true}>
         <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-          {item?.distribution_amt?.toLocaleString(undefined, {
+          {IODetails?.ioTransactionRecords?.Pending[index]?.transactionAmount?.toLocaleString(undefined, {
             minimumFractionDigits: 2,
             maximumFractionDigits: 2,
           })}
@@ -201,7 +197,6 @@ const ViewDistributionInvestor = ({ isOpen, onClose,id:exitId }) => {
     setIsFinalCalculateLoading(false);
     setIsCalcualtedData(false);
   };
-  
 
   return (
     <Modal size={"xl"} isOpen={isOpen} onClose={handleClose}>
@@ -219,41 +214,43 @@ const ViewDistributionInvestor = ({ isOpen, onClose,id:exitId }) => {
           />
         </ModalBody>
         {/* ...(localStorage?.getItem("role") !== "Maker" ? ["Status"] : []), */}
-        {localStorage?.getItem("role") !== encryptString(import.meta.env.VITE_VITE_MAKER) &&<ModalFooter pt={0}>
-          <Box display={"flex"} justifyContent={"center"} gap={2}>
-            <Button
-              rounded={"sm"}
-              size={"xs"}
-              textTransform={"inherit"}
-              fontWeight={500}
-              px={3}
-              py={2}
-              onClick={() => {
-                setActionId(id); // Use the `id` variable from params
-                onConfirmOpen();
-              }}
-              colorScheme="forestGreen"
-              variant={"solid"}
-              cursor={"pointer"}
-            >
-              Approve
-            </Button>
-            <Button
-              rounded={"sm"}
-              size={"xs"}
-              textTransform={"inherit"}
-              fontWeight={500}
-              px={3}
-              py={2}
-              onClick={() => {
-                setActionId(id); // Use the `id` variable from params
-                onRejectOpen();
-              }}
-            >
-              Reject
-            </Button>
-          </Box>
-        </ModalFooter>}
+        {!isMaker() && (
+          <ModalFooter pt={0}>
+            <Box display={"flex"} justifyContent={"center"} gap={2}>
+              <Button
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={3}
+                py={2}
+                onClick={() => {
+                  setActionId(id); // Use the `id` variable from params
+                  onConfirmOpen();
+                }}
+                colorScheme="forestGreen"
+                variant={"solid"}
+                cursor={"pointer"}
+              >
+                Approve
+              </Button>
+              <Button
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={3}
+                py={2}
+                onClick={() => {
+                  setActionId(id); // Use the `id` variable from params
+                  onRejectOpen();
+                }}
+              >
+                Reject
+              </Button>
+            </Box>
+          </ModalFooter>
+        )}
       </ModalContent>
       <ApproveDistrubationModal
         isOpen={isConfirmOpen}

src/Pages/IO_Management/CreateIO/IOTransaction/ViewExit.jsx

@@ -1,330 +1,332 @@
 import {
-    Alert,
-    AlertIcon,
-    Box,
-    Button,
-    FormControl,
-    FormErrorMessage,
-    FormLabel,
-    HStack,
-    Input,
-    Modal,
-    ModalBody,
-    ModalCloseButton,
-    ModalContent,
-    ModalFooter,
-    ModalHeader,
-    ModalOverlay,
-    Switch,
-    Table,
-    Tbody,
-    Text,
-    Textarea,
-    Th,
-    Tr,
-    useDisclosure,
-    useToast,
-  } from "@chakra-ui/react";
-  import NormalData from "../../../../Components/DataTable/NormalTable";
-  import { useContext, useState } from "react";
-  import { AddIcon } from "@chakra-ui/icons";
-  import {
-    useExitIOTransactionMutation,
-    useGetDistributedToInvestorMutation,
-    useGetDistributionInvestorMutation,
-    useUpdateExitToInvestorMutation,
-  } from "../../../../Services/io.service";
-  import { useParams } from "react-router-dom";
-  import { useEffect } from "react";
-  import { Controller, useForm } from "react-hook-form";
-  import * as yup from "yup";
-  import { yupResolver } from "@hookform/resolvers/yup";
-  import ToastBox from "../../../../Components/ToastBox";
-  import GlobalStateContext from "../../../../Contexts/GlobalStateContext";
+  Alert,
+  AlertIcon,
+  Box,
+  Button,
+  FormControl,
+  FormErrorMessage,
+  FormLabel,
+  HStack,
+  Input,
+  Modal,
+  ModalBody,
+  ModalCloseButton,
+  ModalContent,
+  ModalFooter,
+  ModalHeader,
+  ModalOverlay,
+  Switch,
+  Table,
+  Tbody,
+  Text,
+  Textarea,
+  Th,
+  Tr,
+  useDisclosure,
+  useToast,
+} from "@chakra-ui/react";
+import NormalData from "../../../../Components/DataTable/NormalTable";
+import { useContext, useState } from "react";
+import { AddIcon } from "@chakra-ui/icons";
+import {
+  useExitIOTransactionMutation,
+  useGetDistributedToInvestorMutation,
+  useGetDistributionInvestorMutation,
+  useUpdateExitToInvestorMutation,
+} from "../../../../Services/io.service";
+import { useParams } from "react-router-dom";
+import { useEffect } from "react";
+import { Controller, useForm } from "react-hook-form";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import ToastBox from "../../../../Components/ToastBox";
+import GlobalStateContext from "../../../../Contexts/GlobalStateContext";
 import ApprovedExit from "./ApprovedExit";
 import RequestRejectModal from "./RequestRejectModal";
-import { encryptString } from "../../../../Constants/Constants";
-  
-  const ViewExit = ({ isOpen, onClose ,id:investerId}) => {
-    const params = useParams();
-    const toast = useToast();
-    const id = params?.id;
-    const [isCalculateLoading, setIsCalculateLoading] = useState(false);
-    const [isFinalCalculateLoading, setIsFinalCalculateLoading] = useState(false);
-    const [calcualtedData, setCalculatedDate] = useState(null);
-    const [isCalcualtedData, setIsCalcualtedData] = useState(false);
-    const { IODetails } = useContext(GlobalStateContext);
-    const [actionId, setActionId] = useState(false);
+import { encryptString, isMaker } from "../../../../Constants/Constants";
 
-    const {
-      isOpen: isConfirmOpen,
-      onOpen: onConfirmOpen,
-      onClose: onConfirmClose,
-    } = useDisclosure();
-    const {
-      isOpen: isRejectOpen,
-      onOpen: onRejectOpen,
-      onClose: onRejectClose,
-    } = useDisclosure();
-  
-  
-    const {
-      control,
-      handleSubmit,
-      formState: { errors },
-      reset,
-    } = useForm({
-      resolver: yupResolver(),
-    });
-  
-    useEffect(() => {
-      console.log("hiit     useEffectc");
-     if (id && IODetails) {
+const ViewExit = ({ isOpen, onClose, id: investerId }) => {
+  const params = useParams();
+  const toast = useToast();
+  const id = params?.id;
+  const [isCalculateLoading, setIsCalculateLoading] = useState(false);
+  const [isFinalCalculateLoading, setIsFinalCalculateLoading] = useState(false);
+  const [calcualtedData, setCalculatedDate] = useState(null);
+  const [isCalcualtedData, setIsCalcualtedData] = useState(false);
+  const { IODetails } = useContext(GlobalStateContext);
+  const [actionId, setActionId] = useState(false);
+
+  const {
+    isOpen: isConfirmOpen,
+    onOpen: onConfirmOpen,
+    onClose: onConfirmClose,
+  } = useDisclosure();
+  const {
+    isOpen: isRejectOpen,
+    onOpen: onRejectOpen,
+    onClose: onRejectClose,
+  } = useDisclosure();
+
+  const {
+    control,
+    handleSubmit,
+    formState: { errors },
+    reset,
+  } = useForm({
+    resolver: yupResolver(),
+  });
+
+  useEffect(() => {
+    console.log("hiit     useEffectc");
+    if (id && IODetails) {
       handleCalculate(id, {
         amount: IODetails?.ioMVNAV,
       });
-     }
-      reset({
-        amount: IODetails?.ioMVNAV,
-      });
-    }, [IODetails, id]);
-  
-    const handleCalculate = async (id, data) => {
-      try {
-        
-        const res = await getDistributionInvestment({ id, data });
-        console.log(res?.data?.data);
-  
-        if (res?.error?.status === 401) { 
-          setIsCalculateLoading(false);
-          setIsCalcualtedData(false);
-        } else if (res?.data?.statusCode === 200) {
-          setCalculatedDate(res?.data?.data);
-          setIsCalculateLoading(false);
-          setIsCalcualtedData(true);
-        }
-      } catch (error) {}
-    };
-  
-    const [getDistributionInvestment] = useGetDistributionInvestorMutation();
-  
-    const investor = yup.object().shape({
-      amount: yup.string().required("Amount is required"),
+    }
+    reset({
+      amount: IODetails?.ioMVNAV,
     });
-  
-    // ====================================================[Table Setup]================================================================
-    const tableHeadRow = [
-      "Sr No.",
-      "Client Id",
-      "First name",
-      "Last Name",
-      "Amount",
-      "Holding (%)",
-      "Exit Amt($)",
-    ];
+  }, [IODetails, id]);
 
-    
-  
-    const extractedArray = calcualtedData?.data?.map((item, index) => ({
-      id: item?.id,
-      "Sr No.": (
-        <Box
-          w={9}
-          display={"flex"}
-          alignItems={"center"}
-          isTruncated={true}
-          h={25}
-        >
-          <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-            {index + 1}
-          </Text>
-        </Box>
-      ),
-      "Client Id": (
-        <Box w={100} isTruncated={true}>
-          <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-            {item?.clientId}
-          </Text>
-        </Box>
-      ),
-      "First name": (
-        <Box minW={24} isTruncated={true}>
-          <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-            {item?.firstName}
-          </Text>
-        </Box>
-      ),
-      "Last Name": (
-        <Box minW={24} isTruncated={true}>
-          <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-            {item?.lastName}
-          </Text>
-        </Box>
-      ),
-      Amount: (
-        <Box minW={24} isTruncated={true}>
-          <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-            {item?.amount?.toLocaleString(undefined, {
-              minimumFractionDigits: 2,
-              maximumFractionDigits: 2,
-            })}
-          </Text>
-        </Box>
-      ),
-      "Holding (%)": (
-  <Box minW={24} isTruncated={true}>
-  <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-    {item?.investor_holidings?.toLocaleString(undefined, {
-      minimumFractionDigits: 2,
-      maximumFractionDigits: 2,
-    })}%
-  </Text>
-  </Box>
-      ),
-      "Exit Amt($)": (
-        <Box minW={24} isTruncated={true}>
-          <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-            {item?.distribution_amt?.toLocaleString(undefined, {
-              minimumFractionDigits: 2,
-              maximumFractionDigits: 2,
-            })}
-          </Text>
-        </Box>
-      ),
-    }));
-  
-    const onSubmit = async (data) => {
-      setIsCalculateLoading(true);
-  
-      try {
-        const res = await getDistributionInvestment({ id, data });
-        console.log(res?.data?.data);
-  
-        if (res?.error?.status === 401) {
-          toast({
-            render: () => (
-              <ToastBox message={res?.error?.data?.message} status={"error"} />
-            ),
-          });
-          setIsCalculateLoading(false);
-          setIsCalcualtedData(false);
-        } else if (res?.data?.statusCode === 200) {
-          setCalculatedDate(res?.data?.data);
-          toast({
-            render: () => <ToastBox message={res?.data?.message} />,
-          });
-          setIsCalculateLoading(false);
-          setIsCalcualtedData(true);
-        }
-      } catch (error) {}
-    };
-  
-    const handleClose = () => {
-      onClose();
-      setIsFinalCalculateLoading(false);
-      setIsCalcualtedData(false);
-    };
-    
-    console.log(id);
-    
+  const handleCalculate = async (id, data) => {
+    try {
+      const res = await getDistributionInvestment({ id, data });
+      console.log(res?.data?.data);
 
-    return (
-      <Modal size={"xl"} isOpen={isOpen} onClose={handleClose} >
-        <ModalOverlay />
-        <ModalContent maxW={1000}>
-          <ModalHeader fontSize={"md"}>Exit Transaction</ModalHeader>
-          <ModalCloseButton />
-          <ModalBody>
-            {/* <Text as="label" mb="5px" fontSize="sm" fontWeight={500}>
+      if (res?.error?.status === 401) {
+        setIsCalculateLoading(false);
+        setIsCalcualtedData(false);
+      } else if (res?.data?.statusCode === 200) {
+        setCalculatedDate(res?.data?.data);
+        setIsCalculateLoading(false);
+        setIsCalcualtedData(true);
+      }
+    } catch (error) {}
+  };
+
+  const [getDistributionInvestment] = useGetDistributionInvestorMutation();
+
+  const investor = yup.object().shape({
+    amount: yup.string().required("Amount is required"),
+  });
+
+  // ====================================================[Table Setup]================================================================
+  const tableHeadRow = [
+    "Sr No.",
+    "Client Id",
+    "First name",
+    "Last Name",
+    "Amount",
+    "Holding (%)",
+    "Exit Amt($)",
+  ];
+
+  const extractedArray = calcualtedData?.data?.map((item, index) => ({
+    id: item?.id,
+    "Sr No.": (
+      <Box
+        w={9}
+        display={"flex"}
+        alignItems={"center"}
+        isTruncated={true}
+        h={25}
+      >
+        <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
+          {index + 1}
+        </Text>
+      </Box>
+    ),
+    "Client Id": (
+      <Box w={100} isTruncated={true}>
+        <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
+          {item?.clientId}
+        </Text>
+      </Box>
+    ),
+    "First name": (
+      <Box minW={24} isTruncated={true}>
+        <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
+          {item?.firstName}
+        </Text>
+      </Box>
+    ),
+    "Last Name": (
+      <Box minW={24} isTruncated={true}>
+        <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
+          {item?.lastName}
+        </Text>
+      </Box>
+    ),
+    Amount: (
+      <Box minW={24} isTruncated={true}>
+        <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
+          {item?.amount?.toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          })}
+        </Text>
+      </Box>
+    ),
+    "Holding (%)": (
+      <Box minW={24} isTruncated={true}>
+        <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
+          {item?.investor_holidings?.toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          })}
+          %
+        </Text>
+      </Box>
+    ),
+    "Exit Amt($)": (
+      <Box minW={24} isTruncated={true}>
+        <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
+          {item?.distribution_amt?.toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          })}
+        </Text>
+      </Box>
+    ),
+  }));
+
+  const onSubmit = async (data) => {
+    setIsCalculateLoading(true);
+
+    try {
+      const res = await getDistributionInvestment({ id, data });
+      console.log(res?.data?.data);
+
+      if (res?.error?.status === 401) {
+        toast({
+          render: () => (
+            <ToastBox message={res?.error?.data?.message} status={"error"} />
+          ),
+        });
+        setIsCalculateLoading(false);
+        setIsCalcualtedData(false);
+      } else if (res?.data?.statusCode === 200) {
+        setCalculatedDate(res?.data?.data);
+        toast({
+          render: () => <ToastBox message={res?.data?.message} />,
+        });
+        setIsCalculateLoading(false);
+        setIsCalcualtedData(true);
+      }
+    } catch (error) {}
+  };
+
+  const handleClose = () => {
+    onClose();
+    setIsFinalCalculateLoading(false);
+    setIsCalcualtedData(false);
+  };
+
+  console.log(id);
+
+  return (
+    <Modal size={"xl"} isOpen={isOpen} onClose={handleClose}>
+      <ModalOverlay />
+      <ModalContent maxW={1000}>
+        <ModalHeader fontSize={"md"}>Exit Transaction</ModalHeader>
+        <ModalCloseButton />
+        <ModalBody>
+          {/* <Text as="label" mb="5px" fontSize="sm" fontWeight={500}>
               Amount to Distribute
             </Text> */}
-            <HStack onSubmit={handleSubmit(onSubmit)} as={"form"} mb={4} alignItems={'center'}>
-              {/* <Input placeholder="$00.00" size={"sm"} className="col" /> */}
-              {/* <FormControl isInvalid={errors.amount} isRequired>*/}
-                <Text textAlign={"right"} fontSize={"sm"}>
-                  Exit Amount :
-                </Text> 
-              <Text
-                textAlign={"start"}
-                bg={"green.100"}
-                p={2}
-                rounded={"md"}
-                fontSize={"sm"}
-                pt={1}
-                pb={1}
-                fontWeight={600}
-              >
-                ${" "}
-                {parseFloat(IODetails?.ioMVNAV || 0).toLocaleString(undefined, {
-                  minimumFractionDigits: 2,
-                  maximumFractionDigits: 2,
-                })}
-              </Text>
-  
-              {/* </FormControl> */}
-            </HStack>
-  
-            {/* {calcualtedData && ( */}
-            <NormalData
-              emptyMessage={`We don't have any Sponers `}
-              tableHeadRow={tableHeadRow}
-              data={extractedArray}
-              // total={<Total />}
-              // isLoading={isLoading}
-            />
-            {/* ) } */}
-          </ModalBody>
-          {localStorage?.getItem("role") !== encryptString(import.meta.env.VITE_VITE_MAKER) && <ModalFooter pt={0}>
+          <HStack
+            onSubmit={handleSubmit(onSubmit)}
+            as={"form"}
+            mb={4}
+            alignItems={"center"}
+          >
+            {/* <Input placeholder="$00.00" size={"sm"} className="col" /> */}
+            {/* <FormControl isInvalid={errors.amount} isRequired>*/}
+            <Text textAlign={"right"} fontSize={"sm"}>
+              Exit Amount :
+            </Text>
+            <Text
+              textAlign={"start"}
+              bg={"green.100"}
+              p={2}
+              rounded={"md"}
+              fontSize={"sm"}
+              pt={1}
+              pb={1}
+              fontWeight={600}
+            >
+              ${" "}
+              {parseFloat(IODetails?.ioMVNAV || 0).toLocaleString(undefined, {
+                minimumFractionDigits: 2,
+                maximumFractionDigits: 2,
+              })}
+            </Text>
+
+            {/* </FormControl> */}
+          </HStack>
+
+          {/* {calcualtedData && ( */}
+          <NormalData
+            emptyMessage={`We don't have any Sponers `}
+            tableHeadRow={tableHeadRow}
+            data={extractedArray}
+            // total={<Total />}
+            // isLoading={isLoading}
+          />
+          {/* ) } */}
+        </ModalBody>
+        {!isMaker() && (
+          <ModalFooter pt={0}>
             <Box display={"flex"} justifyContent={"center"} gap={2}>
-                <Button
-                  rounded={"sm"}
-                  size={"xs"}
-                  textTransform={"inherit"}
-                  fontWeight={500}
-                  px={3}
-                  py={2}
-                  onClick={() => {
-                    setActionId(id); // Use the `id` variable from params
-                    onConfirmOpen();
-                  }}
-                  colorScheme="forestGreen"
-                  variant={"solid"}
-                  cursor={"pointer"}
-                >
-                  Approve
-                </Button>
-                <Button
-                  rounded={"sm"}
-                  size={"xs"}
-                  textTransform={"inherit"}
-                  fontWeight={500}
-                  px={3}
-                  py={2}
-                  onClick={() => {
-                    setActionId(id); // Use the `id` variable from params
-                    onRejectOpen();
-                  }}
-                >
-                  Reject
-                </Button>
+              <Button
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={3}
+                py={2}
+                onClick={() => {
+                  setActionId(id); // Use the `id` variable from params
+                  onConfirmOpen();
+                }}
+                colorScheme="forestGreen"
+                variant={"solid"}
+                cursor={"pointer"}
+              >
+                Approve
+              </Button>
+              <Button
+                rounded={"sm"}
+                size={"xs"}
+                textTransform={"inherit"}
+                fontWeight={500}
+                px={3}
+                py={2}
+                onClick={() => {
+                  setActionId(id); // Use the `id` variable from params
+                  onRejectOpen();
+                }}
+              >
+                Reject
+              </Button>
             </Box>
-          </ModalFooter>}
-        </ModalContent>
-        <ApprovedExit
-            isOpen={isConfirmOpen}
-            onClose={onConfirmClose}
-            onBigModalClose={onClose}
-            id={investerId}
-        />
-        <RequestRejectModal
-            isOpen={isRejectOpen}
-            onClose={onRejectClose}
-            onBigModalClose={onClose}
-            id={investerId}
-        />
-      </Modal>
-    ); 
-  };
-  
-  export default ViewExit;
-  
+          </ModalFooter>
+        )}
+      </ModalContent>
+      <ApprovedExit
+        isOpen={isConfirmOpen}
+        onClose={onConfirmClose}
+        onBigModalClose={onClose}
+        id={investerId}
+      />
+      <RequestRejectModal
+        isOpen={isRejectOpen}
+        onClose={onRejectClose}
+        onBigModalClose={onClose}
+        id={investerId}
+      />
+    </Modal>
+  );
+};
+
+export default ViewExit;

src/Pages/IO_Management/IOArtifactsAdd.jsx

@@ -360,7 +360,7 @@ const IOArtifactsAdd = ({
         isOpen={alert}
         onClose={handleAlertClose}
         alertHandler={handleSave}
-        message={"Are you sure you want to update this artifact?"}
+        message={"Are you sure you want to add this artifact?"}
         isLoading={loading}
       />
     </>

src/Pages/IO_Management/ViewIO/HeaderModal/AmountInvested.jsx

@@ -112,8 +112,18 @@ const AmountInvested = ({ isOpen, onClose }) => {
     });
   };
 
+  const handleModalClose = () => {
+    reset({
+      transactionDate: "",
+      Total_Amount: IODetails?.totalAmtInvestmentInUSD || 0,
+      amountInvested: 0,
+      IoCash: IODetails?.totalAmtInvestmentInUSD || 0,
+    });
+    onClose();
+  };
+
   return (
-    <Modal isOpen={isOpen} onClose={onClose}>
+    <Modal isOpen={isOpen} onClose={handleModalClose}>
       <ModalOverlay /> 
       <ModalContent>
         <ModalHeader fontSize={"md"}>Amount Invested</ModalHeader>
@@ -246,7 +256,7 @@ const AmountInvested = ({ isOpen, onClose }) => {
               >
                 Save
               </Button>
-              <Button size={"sm"} rounded={"sm"} mr={3} onClick={onClose}>
+              <Button size={"sm"} rounded={"sm"} mr={3}  onClick={handleModalClose}>
                 Close
               </Button>
             </ModalFooter>

src/Pages/IO_Management/ViewIO/HeaderModal/DistributionInvestor.jsx

@@ -495,7 +495,7 @@ const DistributionInvestor = ({ isOpen, onClose }) => {
               >
                 Save
               </Button>
-              <Button size={"sm"} rounded={"sm"} mr={3} onClick={onClose}>
+              <Button size={"sm"} rounded={"sm"} mr={3} onClick={handleClose}>
                 Close
               </Button>
             </>

src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx

@@ -1,5 +1,5 @@
+import { ViewIcon } from "@chakra-ui/icons";
 import {
-  Avatar,
   Badge,
   Box,
   Button,
@@ -11,23 +11,21 @@ import {
   useDisclosure,
   useToast,
 } from "@chakra-ui/react";
-import React, { useContext, useEffect, useState, useRef } from "react";
-import { OPACITY_ON_LOAD } from "../../../Layout/animations";
-import NormalTable from "../../../Components/DataTable/NormalTable";
-import { Link, Link as RouterLink, useNavigate } from "react-router-dom";
-import {
-  ViewIcon,
-} from "@chakra-ui/icons";
-import Pagination from "../../../Components/Pagination";
-import GlobalStateContext from "../../../Contexts/GlobalStateContext";
-import CustomAlertDialog from "../../../Components/CustomAlertDialog";
-import ToastBox from "../../../Components/ToastBox";
-import { debounce } from "../../Master/Sponser/AddSponser";
-import InvestmentDetailsEdit from "./InvestmentDetailsEdit";
-import { useGetInvestorsQuery } from "../../../Services/investor.details.service";
-import { TABLE_PAGINATION } from "../../../Constants/Paginations";
-import { exportToExcel, exportToExcelNew, generateSerialNumber } from "../../../Constants/Constants";
+import React, { useContext, useEffect, useRef, useState } from "react";
 import { LuFileSpreadsheet } from "react-icons/lu";
+import { useNavigate } from "react-router-dom";
+import CustomAlertDialog from "../../../Components/CustomAlertDialog";
+import NormalTable from "../../../Components/DataTable/NormalTable";
+import Pagination from "../../../Components/Pagination";
+import {
+  exportToExcelNew,
+  generateSerialNumber,
+} from "../../../Constants/Constants";
+import { INVESTOR_TABLE_PAGINATION } from "../../../Constants/Paginations";
+import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+import { OPACITY_ON_LOAD } from "../../../Layout/animations";
+import { useGetInvestorsQuery } from "../../../Services/investor.details.service";
+import InvestmentDetailsEdit from "./InvestmentDetailsEdit";
 
 const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter
 
@@ -49,10 +47,11 @@ const InvestorDetails = () => {
   } = useDisclosure();
   const btnRef = React.useRef();
 
-
-  // =========================== [Use State] ============================= 
-  const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size);
-  const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page);
+  // =========================== [Use State] =============================
+  const [pageSize, setPageSize] = useState(INVESTOR_TABLE_PAGINATION?.size);
+  const [currentPage, setCurrentPage] = useState(
+    INVESTOR_TABLE_PAGINATION?.page
+  );
   const [searchTerm, setSearchTerm] = useState("");
   const [debouncedSearchTerm, setDebouncedSearchTerm] = useState("");
 
@@ -73,20 +72,19 @@ const InvestorDetails = () => {
     data: investorDetails,
     isLoading: investorDetailsLoading,
     error,
-  } = useGetInvestorsQuery({
-    page: debouncedSearchTerm ? undefined : currentPage,  // Omit pagination for search
-    size: debouncedSearchTerm ? undefined : pageSize,     // Omit pagination for search userStatus KYCStatus investorType_xid 
-    search: debouncedSearchTerm,
-    userStatus: status,
-    KYCStatus: kyc,
-    country_xid: country
-
-  },
-  {
-    skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
-  }
-);
-
+  } = useGetInvestorsQuery(
+    {
+      page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
+      size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search userStatus KYCStatus investorType_xid
+      search: debouncedSearchTerm,
+      userStatus: status,
+      KYCStatus: kyc,
+      country_xid: country,
+    },
+    {
+      skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
+    }
+  );
 
   useEffect(() => {
     // Simulate loading
@@ -104,43 +102,41 @@ const InvestorDetails = () => {
     "Client ID",
     "First Name",
     "Last Name",
-    "Country", 
+    "Country",
     "Phone Number",
     "E-mail ID",
-    "Type", 
+    "Type",
     "KYC Status",
     "Status",
     "Action",
   ];
 
-
   // ====================================================[Table Filter]================================================================
   const exportInvestor = investorDetails?.data?.rows?.map((item, idx) => ({
-    "Id": parseInt(item?.id, 10) || item?.id, // Convert to integer, fallback to string if conversion fails
+    Id: parseInt(item?.id, 10) || item?.id, // Convert to integer, fallback to string if conversion fails
     "Client ID": item?.clientReference_id, // This is likely a string
     "First Name": item?.principal?.firstName,
     "Last Name": item?.principal?.lastName,
-    "Country": item?.country?.countryName,
+    Country: item?.country?.countryName,
     "Phone Number": item?.principal?.mobileNumber, // Skipping integer conversion, as this is likely a string
     "E-mail ID": item?.principal?.emailAddress,
-    "Type": item?.investor_type?.investorTypeName,
-    "Status": item.ioStatus ? "Ban" : "Unban",
-    "KYC Status": item.KYCStatus ? "Completed" : "Not complete"
+    Type: item?.investor_type?.investorTypeName,
+    Status: item.ioStatus ? "Ban" : "Unban",
+    "KYC Status": item.KYCStatus ? "Completed" : "Not complete",
   }));
 
   const extractedArray = investorDetails?.data?.rows?.map((item, idx) => ({
     id: item?.id,
     "Sr No": (
       <Text
-      w={'24px'}
+        w={"24px"}
         justifyContent={slideFromRight ? "right" : "left"}
         as={"span"}
         color={"gray.600"}
         className="d-flex align-items-center fw-bold web-text-small"
       >
         {/* {item.id} */}
-        {generateSerialNumber(idx,currentPage, pageSize )}
-        
+        {generateSerialNumber(idx, currentPage, pageSize)}
       </Text>
     ),
     "Client ID": (
@@ -148,7 +144,7 @@ const InvestorDetails = () => {
         <Text as={"span"} color={"teal.900"}>
           {item.clientReference_id}
         </Text>
-      </Box> 
+      </Box>
     ),
     "First Name": (
       <Box w={"auto"} isTruncated={true}>
@@ -185,39 +181,44 @@ const InvestorDetails = () => {
         </Text>
       </Box>
     ),
-    "Type": (
+    Type: (
       <Box w={"auto"} isTruncated={true}>
-        <Text as={"span"} >
-          <Badge color={"forestGreen.500"}    variant={'ghost'} fontWeight={"700"} px={2} py={0.5}>
+        <Text as={"span"}>
+          <Badge
+            color={"forestGreen.500"}
+            variant={"ghost"}
+            fontWeight={"700"}
+            px={2}
+            py={0.5}
+          >
             {item?.investor_type?.investorTypeName}
           </Badge>
         </Text>
       </Box>
     ),
     Status: (
-    <Box w={"auto"} isTruncated={true}>
-      <Badge
-        fontWeight={"700"}
-        textTransform={"none"}
-        colorScheme={item.ioStatus ? "red" : "green"}
-        px={2}
-        py={0.5}
-      >
-        {item.ioStatus ? "Ban" : "Unban"}
-      </Badge>
-    </Box>
+      <Box w={"auto"} isTruncated={true}>
+        <Badge
+          fontWeight={"700"}
+          textTransform={"none"}
+          colorScheme={item.ioStatus ? "red" : "green"}
+          px={2}
+          py={0.5}
+        >
+          {item.ioStatus ? "Ban" : "Unban"}
+        </Badge>
+      </Box>
     ),
     "KYC Status": (
-      <Box w={"auto"} display={'flex'} alignItems={'center'} isTruncated={true}>
+      <Box w={"auto"} display={"flex"} alignItems={"center"} isTruncated={true}>
         <Text
-        as={'span'}
+          as={"span"}
           fontWeight={"700"}
           textTransform={"none"}
           color={item?.KYCStatus === true ? "green" : "yellow.500"}
           px={2}
           py={0.5}
-          variant={'solid'}
-
+          variant={"solid"}
         >
           {/* {item.KYCStatus ? "Completed" : "Not complete"} */}
           {item?.KYCStatus === true ? "Completed" : "NotCompleted"}
@@ -235,7 +236,7 @@ const InvestorDetails = () => {
           placement="top"
         >
           <Button
-          isDisabled={item.ioStatus}
+            isDisabled={item.ioStatus}
             onClick={() => {
               navigate(`/investor-details/profile-view/${item.id}`);
             }}
@@ -266,7 +267,6 @@ const InvestorDetails = () => {
     setIsLoading(true);
   };
 
-
   return (
     <Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={38}>
       <Box bg="white.500">
@@ -346,35 +346,29 @@ const InvestorDetails = () => {
             </Select>
 
             <Pagination
-              isLoading={investorDetailsLoading} 
+              isLoading={investorDetailsLoading}
               pageSize={pageSize}
               setPageSize={setPageSize}
               currentPage={currentPage}
               setCurrentPage={setCurrentPage}
               totalItems={investorDetails?.data?.totalItems}
-              
             />
-
           </HStack>
 
-
           <Button
-              onClick={() =>
-                exportToExcelNew(exportInvestor, "Investor Details")
-              }
-              leftIcon={<LuFileSpreadsheet />}
-              colorScheme="forestGreen"
-              size={"sm"}
-              variant={"outline"}
-              rounded={"sm"}
-              fontSize={"xs"}
-              w={100}
-              me={2}
-
-              isDisabled={exportInvestor?.length === 0}
-            >
-              Export xls
-            </Button>
+            onClick={() => exportToExcelNew(exportInvestor, "Investor Details")}
+            leftIcon={<LuFileSpreadsheet />}
+            colorScheme="forestGreen"
+            size={"sm"}
+            variant={"outline"}
+            rounded={"sm"}
+            fontSize={"xs"}
+            w={100}
+            me={2}
+            isDisabled={exportInvestor?.length === 0}
+          >
+            Export xls
+          </Button>
         </HStack>
         <InvestmentDetailsEdit
           id={actionId}