From 7c3a6112d20b4944ff0813dbb97dd0e4c9bc51ad Mon Sep 17 00:00:00 2001
From: "Siddhesh.More" <siddhesh.more@wdimails.com>
Date: Fri, 23 Aug 2024 12:24:34 +0530
Subject: [PATCH] update delewtion

---
 src/Contexts/GlobalStateProvider.jsx          | 124 ++---------
 src/Pages/AccountDeletion/DeletionRequest.jsx | 130 ++++++++---
 .../DeletionRequestApprove.jsx                | 204 ++++++++++++++++++
 .../AccountDeletion/DeletionRequestReject.jsx | 158 ++++++++++++++
 .../DepositRequest/DepositRequestApprove.jsx  |  17 +-
 src/Pages/IO_Management/CreateIO/CreateIO.jsx |  18 +-
 .../IO_Management/CreateIO/IODetails.jsx      |  10 +-
 .../ViewIO/HeaderModal/AmountInvested.jsx     |   8 +-
 .../DrawalRequest/DrawalRequestApprove.jsx    |  43 ++--
 .../DrawalRequest/DrawalRequestReject.jsx     |  34 +--
 .../DrawalRequest/PendingRequest.jsx          |   8 +-
 src/Routes/Routes.js                          |   8 +-
 src/Services/delete.request.service.js        |  56 +++++
 src/Services/drawal.request.service.js        |  32 +--
 src/Store/Store.js                            |   3 +
 15 files changed, 614 insertions(+), 239 deletions(-)
 create mode 100644 src/Pages/AccountDeletion/DeletionRequestApprove.jsx
 create mode 100644 src/Pages/AccountDeletion/DeletionRequestReject.jsx
 create mode 100644 src/Services/delete.request.service.js

diff --git a/src/Contexts/GlobalStateProvider.jsx b/src/Contexts/GlobalStateProvider.jsx
index 11a7dfa..9d02a4c 100644
--- a/src/Contexts/GlobalStateProvider.jsx
+++ b/src/Contexts/GlobalStateProvider.jsx
@@ -1182,114 +1182,26 @@ const GlobalStateProvider = ({ children }) => {
   ]);
   const [deleteRequest, setDeleteRequest] = useState([
     {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
+        "id": 2,
+        "firstName": "satyam",
+        "lastName": "Bendal",
+        "clientId": "QA00000003",
+        "RequestedOn": "2024-08-21T09:44:21.000Z",
+        "phoneNumber": "6387524874",
+        "country": "Qatar",
+        "status": "Pending"
     },
     {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-    {
-      id: uuidv4(),
-      date: getRandomDate(startDate, endDate),
-      Distribution: "lorem ipsum dummy text",
-      charge: "500",
-      year: "2024",
-      quater: "Q 1",
-      amount: 1000,
-    },
-  ]);
+        "id": 3,
+        "firstName": "satyam",
+        "lastName": "Bendal",
+        "clientId": "QA00000003",
+        "RequestedOn": "2024-08-21T09:53:03.000Z",
+        "phoneNumber": "6387524874",
+        "country": "Qatar",
+        "status": "Pending"
+    }
+]);
   const [viewIO, setViewIO] = useState([
     {
       id: 1,
diff --git a/src/Pages/AccountDeletion/DeletionRequest.jsx b/src/Pages/AccountDeletion/DeletionRequest.jsx
index a094386..041660b 100644
--- a/src/Pages/AccountDeletion/DeletionRequest.jsx
+++ b/src/Pages/AccountDeletion/DeletionRequest.jsx
@@ -6,15 +6,19 @@ import {
   HStack,
   Input,
   Text,
+  Tooltip,
+  useDisclosure,
   useToast,
 } from "@chakra-ui/react";
 import React, { useContext, useEffect, useState } from "react";
 import { OPACITY_ON_LOAD } from "../../Layout/animations";
-import DataTable from "../../Components/DataTable/DataTable";
+import NormalTable from "../../Components/DataTable/NormalTable";
 import Pagination from "../../Components/Pagination";
 import GlobalStateContext from "../../Contexts/GlobalStateContext";
 import CustomAlertDialog from "../../Components/CustomAlertDialog";
 import { formatDate } from "../../Components/Functions/UTCConvertor";
+import { CheckIcon, CloseIcon } from "@chakra-ui/icons";
+import DeletionRequestApprove from "./DeletionRequestApprove";
 // import { formatDate } from "../../Components/Functions/UTCConvertor";
 
 const DeletionRequest = () => {
@@ -28,6 +32,18 @@ const DeletionRequest = () => {
   const [mouseEntered, setMouseEntered] = useState(false);
   const [mouseEnteredId, setMouseEnteredId] = useState("");
 
+ const {
+    isOpen: isConfirmOpen,
+    onOpen: onConfirmOpen,
+    onClose: onConfirmClose,
+  } = useDisclosure();
+
+  const {
+    isOpen: isRejectOpen,
+    onOpen: onRejectOpen,
+    onClose: onRejectClose,
+  } = useDisclosure();
+
   useEffect(() => {
     // Simulate loading
     const timer = setTimeout(() => {
@@ -39,9 +55,9 @@ const DeletionRequest = () => {
   }, []);
 
   // ====================================================[Table Filter]================================================================
-  const filteredData = deleteRequest.filter((item) => {
+  const filteredData = deleteRequest?.filter((item) => {
     // Filter by name (case insensitive)
-    const name = item.Distribution;
+    const name = item?.firstName;
     const searchLower = searchTerm.toLowerCase();
     const nameMatches = name.toLowerCase().includes(searchLower);
 
@@ -60,19 +76,21 @@ const DeletionRequest = () => {
   // ====================================================[Table Setup]================================================================
   const tableHeadRow = [
     "Sr No.",
-    "Date",
-    "Distribution Amount",
-    "Charges (USD)",
-    "Year",
-    "Quater",
-    "Amount",
+    "Requested on",
+    "Client ID",
+    "First name",
+    "Last name",
+    "Country",
+    "Phone number",
+    "Status",
+    "Action"
   ];
 
   const extractedArray = filteredData?.map((item, index) => ({
     id: item?.id,
     "Sr No.": (
       <Text
-        justifyContent={slideFromRight ? "right" : "left"}
+        justifyContent={"left"}
         as={"span"}
         color={"gray.800"}
         className="d-flex align-items-center web-text-small"
@@ -81,74 +99,112 @@ const DeletionRequest = () => {
         {index + 1}.
       </Text>
     ),
-    "Date": (
+    "Requested on": (
       <Text
-        justifyContent={slideFromRight ? "right" : "left"}
+        justifyContent={"left"}
         as={"span"}
         color={"gray.600"}
         className="d-flex align-items-center web-text-small"
         fontWeight={'500'}
       >
-        {formatDate(item.date)}
+        {formatDate(item?.RequestedOn)}
       </Text>
     ),
-    "Distribution Amount": (
+    "Client ID": (
       <Text
-        justifyContent={slideFromRight ? "right" : "left"}
+        justifyContent={"left"}
         as={"span"}
         color={"gray.600"}
         className="d-flex align-items-center web-text-small"
         fontWeight={'500'}
       >
-        {item.Distribution}
+        {item?.clientId}
       </Text>
     ),
-    "Charges (USD)": (
+    "First name": (
       <Text
-        justifyContent={slideFromRight ? "right" : "left"}
+        justifyContent={"left"}
         as={"span"}
         color={"gray.800"}
         className="d-flex align-items-center web-text-small"
         fontWeight={'500'}
       >
-        {item.charge}
+        {item?.firstName}
         {/* {formatDate(item.charge)} */}
       </Text>
     ),
-    Year: (
+    "Last name": (
       <Text
-        justifyContent={slideFromRight ? "right" : "left"}
+        justifyContent={"left"}
         as={"span"}
         color={"gray.800"}
         className="d-flex align-items-center web-text-small"
         fontWeight={'500'}
       >
-        {item.year}
+        {item?.lastName}
       </Text>
     ),
-    Quater: (
+    Country: (
       <Text
-        justifyContent={slideFromRight ? "right" : "left"}
+        justifyContent={"left"}
         as={"span"}
         color={"gray.600"}
         className="d-flex align-items-center web-text-small"
         fontWeight={'500'}
       >
-        {item.quater}
+        {item?.country}
       </Text>
     ),
 
-    Amount: (
+    "Phone number": (
       <Text
-        justifyContent={slideFromRight ? "right" : "left"}
+        justifyContent={"left"}
         as={"span"}
         color={"gray.600"}
         className="d-flex align-items-center web-text-small"
         fontWeight={'500'}
       >
-        {item.amount}
+        {item?.phoneNumber}
       </Text>
     ),
+    Status:(<Box w={"auto"} display={'flex'} alignItems={'center'} isTruncated={true}>
+        <Text
+        as={'span'}
+          fontWeight={"700"}
+          textTransform={"none"}
+          color={item.kycStatus ? "blue.500" : "red.500"}
+          // px={2}
+          py={0.5}
+          variant={'solid'}
+
+        >
+          {item.KYCStatus ? "Completed" : "Not complete"}
+        </Text>
+      </Box>),
+
+    Action: (
+      <Box display={"flex"} justifyContent={"center"} gap={2}>
+          <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={"outline"}
+            cursor={"pointer"}
+          >
+            Review
+          </Button>
+      </Box>
+    ),
   }));
 
   const handleDelete = () => {
@@ -193,7 +249,7 @@ const DeletionRequest = () => {
         </HStack>
       </Box>
 
-      <DataTable
+      <NormalTable
         emptyMessage={`We don't have any Sponers `}
         tableHeadRow={tableHeadRow}
         data={extractedArray}
@@ -213,6 +269,22 @@ const DeletionRequest = () => {
         alertHandler={handleDelete}
         isLoading={isLoading}
       />
+
+
+<DeletionRequestApprove
+        data={deleteRequest}
+        isOpen={isConfirmOpen}
+        onClose={onConfirmClose}
+        id={actionId}
+      // firstField={firstField}
+      />
+
+
+{/* <DepositRequestReject
+        isOpen={isRejectOpen}
+        onClose={onRejectClose}
+        id={actionId} 
+      /> */}
     </Box>
   );
 };
diff --git a/src/Pages/AccountDeletion/DeletionRequestApprove.jsx b/src/Pages/AccountDeletion/DeletionRequestApprove.jsx
new file mode 100644
index 0000000..29741eb
--- /dev/null
+++ b/src/Pages/AccountDeletion/DeletionRequestApprove.jsx
@@ -0,0 +1,204 @@
+import {
+  Badge,
+  Box,
+  Button,
+  FormControl,
+  FormLabel,
+  Input,
+  Modal,
+  ModalBody,
+  ModalCloseButton,
+  ModalContent,
+  ModalFooter,
+  ModalHeader,
+  ModalOverlay,
+  Text,
+  Textarea,
+  useDisclosure,
+  useToast,
+} from "@chakra-ui/react";
+import React, { useEffect, useState } from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+import { useGetDepositRequestByIdQuery, useGetDepositRequestQuery, useUpdateDepositRequestMutation } from "../../Services/deposit.request.service";
+import FullscreenLoaders from "../../Components/Loaders/FullscreenLoaders";
+import ToastBox from "../../Components/ToastBox";
+import { useGetDrawalRequestQuery } from "../../Services/drawal.request.service";
+import { useApproveDepositRequestMutation, useGetDeleteRequestByIdQuery } from "../../Services/delete.request.service";
+
+const FILE_TYPES = ["image/jpeg", "image/png", "image/gif"];
+
+export const conformModalSchema = yup.object().shape({
+  comment: yup.string().notRequired(),
+});
+
+const DeletionRequestApprove = ({ isOpen, onClose, firstField, id, data:requestData }) => {
+  const toast = useToast()
+  const [file, setFile] = useState();
+  const [isBtnLoading , setIsBtnLoading] = useState(false)
+  const [isBtnLoadingReject , setIsBtnLoadingReject] = useState(false)
+  const [isReject , setIsReject] = useState(false)
+
+  const fileredData = requestData?.find((item)=> item?.id === id)
+  const [ updateApproveRequest ] = useApproveDepositRequestMutation()
+    const { data, isLoading } = useGetDeleteRequestByIdQuery(id, {
+    skip: !id,
+  });
+
+
+  const {
+    register,
+    reset,
+    handleSubmit,
+    formState: { errors },
+  } = useForm({
+    resolver: yupResolver(conformModalSchema),
+  });
+
+  useEffect(() => {
+    reset({
+      comment:fileredData?.comment
+    })
+  
+   
+  }, [requestData, id])
+  
+  const onSubmit = async(data) => {
+    setIsBtnLoading(isReject?false:true)
+    setIsBtnLoadingReject(isReject)
+    const approveReq = {
+      adminComment:data?.comment,
+      deletionStatus: isReject?"Reject": "Approved"
+    }
+
+  try {
+    const res = await updateApproveRequest({ id ,data:approveReq })
+
+
+    if (res?.error) {
+      toast({
+        render: () => (
+          <ToastBox message={res?.error?.data?.message} status={"error"} />
+        ),
+      });
+      heandleOnClose()
+    }else if(res?.data?.statusCode === 200) {
+      toast({
+        render: () => (
+          <ToastBox message={res?.data?.message} />
+        ),
+      });
+      heandleOnClose()
+    } 
+    
+  } catch (error) {
+ 
+  }
+
+  };
+
+  const onReject = () => {
+
+  }
+
+
+
+  useEffect(() => {
+    if (data) {
+      reset({
+        comment: data?.data?.comment,
+      });
+    }
+  }, [data, reset]);
+
+  const heandleOnClose = () =>{
+    reset()
+    onClose()
+    setIsBtnLoading(false)
+    setIsReject(false)
+    setIsBtnLoadingReject(false)
+  }
+
+  return (
+    <Modal isOpen={isOpen} onClose={heandleOnClose} initialFocusRef={firstField}>
+      <ModalOverlay />
+
+      <ModalContent pb={4}>
+        {/* <ModalHeader fontSize={"md"}>Confirm</ModalHeader> */}
+        <ModalCloseButton />
+        {isLoading ? (
+          <FullscreenLoaders height={"50vh"} />
+        ) : (
+          <Box as="form" onSubmit={handleSubmit(onSubmit)}>
+            <ModalBody>
+              <FormControl mt={6} mb={4}>
+                <FormLabel fontSize="sm">Investor Comment <Badge colorScheme="green">{fileredData?.currencyCode}</Badge></FormLabel>
+                <Textarea
+                  focusBorderColor="green.400"
+                  name="comment"
+                  {...register("comment")}
+                  fontSize="sm"
+                  type="text"
+                  size="sm"
+                  readOnly
+                  rows={5}
+                />
+                {errors.comment && (
+                  <Text fontSize="xs" color="red">
+                    {errors.comment.message}
+                  </Text>
+                )}
+              </FormControl>
+              <FormControl mb={4}>
+                <FormLabel fontSize="sm">Admin Comment</FormLabel>
+                <Textarea
+                  rows={5}
+                  focusBorderColor="green.400"
+                  name="comment"
+                  {...register("comment")}
+                  fontSize="sm"
+                  type="textarea"
+                  size="sm"
+                  placeholder={"Enter your comments...."}
+                  resize={"none"}
+                />
+                {errors.comment && (
+                  <Text fontSize="xs" color="red">
+                    {errors.comment.message}
+                  </Text>
+                )}
+              </FormControl>
+            </ModalBody>
+            <ModalFooter>
+              <Button
+                colorScheme="red"
+                mr={3}
+                type="submit"
+                size={"sm"}
+                rounded={"sm"}
+                variant={'ghost'}
+                onClick={()=> setIsReject(true)}
+                isLoading={isBtnLoadingReject}
+              >
+                Reject
+              </Button>
+              <Button
+                colorScheme="forestGreen"
+                variant="solid"
+                size={"sm"}
+                rounded={"sm"}
+                isLoading={isBtnLoading}
+                type="submit"
+              >
+                Approve
+              </Button>
+            </ModalFooter>
+          </Box>
+        )}
+      </ModalContent>
+    </Modal>
+  );
+};
+
+export default DeletionRequestApprove;
diff --git a/src/Pages/AccountDeletion/DeletionRequestReject.jsx b/src/Pages/AccountDeletion/DeletionRequestReject.jsx
new file mode 100644
index 0000000..c27bdec
--- /dev/null
+++ b/src/Pages/AccountDeletion/DeletionRequestReject.jsx
@@ -0,0 +1,158 @@
+import {
+  Box,
+  Button,
+  FormControl,
+  FormLabel,
+  Input,
+  Modal,
+  ModalBody,
+  ModalCloseButton,
+  ModalContent,
+  ModalFooter,
+  ModalHeader,
+  ModalOverlay,
+  Text,
+  Textarea,
+  useDisclosure,
+  useToast,
+} from "@chakra-ui/react";
+import React, { useEffect, useState } from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+import { useDepositRejectMutation } from "../../../Services/deposit.request.service";
+import ToastBox from "../../../Components/ToastBox";
+
+export const conformModalSchema = yup.object().shape({
+  comments: yup.string().required("Comment is required"),
+});
+
+const DeletionRequestReject = ({ isOpen, onClose, firstField ,id}) => {
+  const [isBtnLoading , setIsBtnLoading] = useState(false)
+  const toast = useToast()
+  const {
+    register,
+    reset,
+    handleSubmit,
+    formState: { errors },
+  } = useForm({
+    resolver: yupResolver(conformModalSchema),
+  });
+  const [ depositReject ] = useDepositRejectMutation()
+  const onSubmit = async(data) => {
+    setIsBtnLoading(true)
+    try {
+      const res = await depositReject({ id ,data})
+  
+      if (res?.error) {
+        toast({
+          render: () => (
+            <ToastBox message={res?.error?.data?.message} status={"error"} />
+          ),
+        });
+        setIsBtnLoading(false)
+        onClose();
+        
+      }else if(res?.data?.statusCode === 200) {
+        toast({
+          render: () => (
+            <ToastBox message={res?.data?.message} />
+          ),
+        });
+        setIsBtnLoading(false)
+        onClose();
+        
+      } 
+      
+    } catch (error) {
+      console.log(error);
+      
+    }
+
+  };
+
+  const handleFileChange = (event) => {
+    const selectedFile = event.target.files[0];
+    setFile(selectedFile);
+  };
+
+
+  const { data, isLoading } = 
+  (id, {
+    skip: !id,
+  });
+
+  useEffect(() => {
+    if (data) {
+      reset({
+        investorAmount: data?.data?.investorAmount,
+      });
+    }
+  }, [data, reset]);
+
+  const heandleOnClose = () =>{
+    reset()
+    onClose()
+  }
+
+  return (
+    <Modal isOpen={isOpen} onClose={heandleOnClose} initialFocusRef={firstField}>
+      <ModalOverlay />
+      <ModalContent pb={4}>
+        <ModalHeader fontSize={"md"}>Reject</ModalHeader>
+        <ModalCloseButton />
+        {isLoading ? (
+          <FullscreenLoaders height={"50vh"} />
+        ) : (
+        <Box as="form" onSubmit={handleSubmit(onSubmit)}>
+          <ModalBody>
+            <FormControl mb={4} isRequired>
+              <FormLabel fontSize="sm">Comment</FormLabel>
+              <Textarea
+                rows={6}
+                focusBorderColor="green.400"
+                name="comments"
+                {...register("comments")}
+                fontSize="sm"
+                type="textarea"
+                size="md"
+                placeholder={"Enter your comments...."}
+                rounded={"md"}
+                resize={"none"}
+              />
+              {errors.comments && (
+                <Text fontSize="xs" color="red">
+                  {errors.comments.message}
+                </Text>
+              )}
+            </FormControl>
+          </ModalBody>
+          <ModalFooter>
+            <Button
+              colorScheme="gray"
+              mr={3}
+              onClick={onClose}
+              size={"sm"}
+              rounded={"sm"}
+            >
+              Cancel
+            </Button>
+            <Button
+              colorScheme="forestGreen"
+              variant="solid"
+              size={"sm"}
+              rounded={"sm"}
+              isLoading={isBtnLoading}
+              type="submit"
+            >
+              Send
+            </Button>
+          </ModalFooter>
+        </Box>
+        )}
+      </ModalContent>
+    </Modal>
+  );
+};
+
+export default DeletionRequestReject;
diff --git a/src/Pages/Deposit/DepositRequest/DepositRequestApprove.jsx b/src/Pages/Deposit/DepositRequest/DepositRequestApprove.jsx
index c51491d..7b2fa47 100644
--- a/src/Pages/Deposit/DepositRequest/DepositRequestApprove.jsx
+++ b/src/Pages/Deposit/DepositRequest/DepositRequestApprove.jsx
@@ -21,7 +21,7 @@ import React, { useEffect, useState } from "react";
 import * as yup from "yup";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { useForm } from "react-hook-form";
-import { useGetDepositRequestByIdQuery, useUpdateDepositRequestMutation } from "../../../Services/deposit.request.service";
+import { useGetDepositRequestByIdQuery, useGetDepositRequestQuery, useUpdateDepositRequestMutation } from "../../../Services/deposit.request.service";
 import FullscreenLoaders from "../../../Components/Loaders/FullscreenLoaders";
 import ToastBox from "../../../Components/ToastBox";
 import { useGetDrawalRequestQuery } from "../../../Services/drawal.request.service";
@@ -45,15 +45,14 @@ const DepositRequestApprove = ({ isOpen, onClose, firstField, id, data:requestDa
   const fileredData = requestData?.find((item)=> item?.id === id)
   console.log(fileredData);
 
-  const {
-    data,
-    isLoading: drawalRequestLoading,
-    error,
-  } = useGetDrawalRequestQuery();
 
-  console.log(data?.data?.rows);
+
 
   const [ updateDepositRequest ] = useUpdateDepositRequestMutation()
+    const { data, isLoading } = useGetDepositRequestByIdQuery(id, {
+    skip: !id,
+  });
+
 
   const {
     register,
@@ -114,10 +113,6 @@ const DepositRequestApprove = ({ isOpen, onClose, firstField, id, data:requestDa
     setFile(selectedFile);
   };
 
-  // const { data, isLoading } = 
-  // (id, {
-  //   skip: !id,
-  // });
 
   useEffect(() => {
     if (data) {
diff --git a/src/Pages/IO_Management/CreateIO/CreateIO.jsx b/src/Pages/IO_Management/CreateIO/CreateIO.jsx
index 25247c0..617234a 100644
--- a/src/Pages/IO_Management/CreateIO/CreateIO.jsx
+++ b/src/Pages/IO_Management/CreateIO/CreateIO.jsx
@@ -45,38 +45,38 @@ const CreateIO = () => {
     {
       label: "Investment documents",
       Content: InvestmentDocument,
-      isDisabled: id ? false : true,
+      isDisabled: id ? true : true,
     },
     {
       label: "Key merits",
       Content: KeyMerits,
-      isDisabled: id ? false : true,
+      isDisabled: id ? true : true,
     },
     {
       label: "IO artifacts",
       Content: IOArtifacts,
-      isDisabled: id ? false : true,
+      isDisabled: id ? true : true,
     },
     {
       label: "Investors",
-      // Content: Investors,
-      Content: UnderConstruction,
-      isDisabled: id ? false : true,
+      Content: Investors,
+      // Content: UnderConstruction,
+      isDisabled: id ? true : true,
     },
     {
       label: "IO Cash Detail",
       Content: IOCashDetails,
-      isDisabled: id ? false : true,
+      isDisabled: id ? true : true,
     },
     {
       label: "IO NAV Details",
       Content: IONAVDetails,
-      isDisabled: id ? false : true,
+      isDisabled: id ? true : true,
     },
     {
       label: "Distribution to Investors",
       Content: Destribution,
-      isDisabled: id ? false : true,
+      isDisabled: id ? true : true,
     },
   ];
 
diff --git a/src/Pages/IO_Management/CreateIO/IODetails.jsx b/src/Pages/IO_Management/CreateIO/IODetails.jsx
index 548671d..76d32b3 100644
--- a/src/Pages/IO_Management/CreateIO/IODetails.jsx
+++ b/src/Pages/IO_Management/CreateIO/IODetails.jsx
@@ -113,6 +113,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
     const updatedValues = [...values];
     updatedValues[index].value = newValue;
     setValues(updatedValues);
+    console.log(values);
   };
 
   // ======================[ States ]
@@ -167,8 +168,9 @@ const IODetails = ({ enableNextTab, index, data }) => {
 
 
 
-  const minInvestmentById = IObyID?.data?.minInvestmentAmt?.map(({minInvestmentAmt, country, country_xid, })=>{
+  const minInvestmentById = IObyID?.data?.minInvestmentAmt?.map(({minInvestmentAmt, country, country_xid,id })=>{
     return{
+      _id:id,
       id:country_xid,
       country: country?.countryName,
       value: removeTrailingZeros(minInvestmentAmt),
@@ -179,6 +181,7 @@ const IODetails = ({ enableNextTab, index, data }) => {
 
   
   const [values, setValues] = useState(id?minInvestmentById:miniValue);
+  
   const formatNumber = (num) => {
     // Remove non-numeric characters and format with commas
     return num.replace(/\D/g, '')
@@ -576,8 +579,11 @@ const IODetails = ({ enableNextTab, index, data }) => {
     setIsLoading(true);
     // console.log(data);
 
-    const updatedMinAmount = values?.map(({id, value})=>{
+    // console.log();
+
+    const updatedMinAmount = values?.map(({id, value, _id})=>{
       return {
+        id:_id,
         country_xid:id,
         minInvestmentAmt: Number(value)
       }
diff --git a/src/Pages/IO_Management/ViewIO/HeaderModal/AmountInvested.jsx b/src/Pages/IO_Management/ViewIO/HeaderModal/AmountInvested.jsx
index 01e6cbc..def8b00 100644
--- a/src/Pages/IO_Management/ViewIO/HeaderModal/AmountInvested.jsx
+++ b/src/Pages/IO_Management/ViewIO/HeaderModal/AmountInvested.jsx
@@ -121,7 +121,7 @@ const AmountInvested = ({ isOpen, onClose }) => {
                 fontSize={"sm"}
                 focusBorderColor="forestGreen.300"
               />
-              {errors.transactionDate && <Text color="red.500">{errors.transactionDate.message}</Text>}
+              {errors.transactionDate && <Text fontSize={'xs'} fontWeight={600} color="red.500">{errors.transactionDate.message}</Text>}
             </FormControl>
 
             <FormControl mb={"15px"} isInvalid={!!errors.Total_Amount} isReadOnly>
@@ -136,7 +136,7 @@ const AmountInvested = ({ isOpen, onClose }) => {
                 fontSize={"sm"}
                 readOnly
               />
-              {errors.Total_Amount && <Text color="red.500">{errors.Total_Amount.message}</Text>}
+              {errors.Total_Amount && <Text fontSize={'xs'} fontWeight={600} color="red.500">{errors.Total_Amount.message}</Text>}
             </FormControl>
 
             <FormControl mb={"15px"} isInvalid={!!errors.amountInvested} isRequired>
@@ -151,7 +151,7 @@ const AmountInvested = ({ isOpen, onClose }) => {
                 fontSize={"sm"}
                 onChange={handleAmountChange}
               />
-              {errors.amountInvested && <Text color="red.500">{errors.amountInvested.message}</Text>}
+              {errors.amountInvested && <Text fontSize={'xs'} fontWeight={600} color="red.500">{errors.amountInvested.message}</Text>}
             </FormControl>
 
             <FormControl mb={"15px"} isInvalid={!!errors.IoCash}>
@@ -168,7 +168,7 @@ const AmountInvested = ({ isOpen, onClose }) => {
                 textAlign={'right'}
                 readOnly
               />
-              {errors.IoCash && <Text color="red.500">{errors.IoCash.message}</Text>}
+              {errors.IoCash && <Text fontSize={'xs'} fontWeight={600} color="red.500">{errors.IoCash.message}</Text>}
             </FormControl>
 
             <ModalFooter>
diff --git a/src/Pages/WithDrawal/DrawalRequest/DrawalRequestApprove.jsx b/src/Pages/WithDrawal/DrawalRequest/DrawalRequestApprove.jsx
index 3374ad7..b462462 100644
--- a/src/Pages/WithDrawal/DrawalRequest/DrawalRequestApprove.jsx
+++ b/src/Pages/WithDrawal/DrawalRequest/DrawalRequestApprove.jsx
@@ -25,7 +25,7 @@ import {
   import { useGetDepositRequestByIdQuery, useUpdateDepositRequestMutation } from "../../../Services/deposit.request.service";
   import FullscreenLoaders from "../../../Components/Loaders/FullscreenLoaders";
   import ToastBox from "../../../Components/ToastBox";
-import {  useUpdateDrawalRequestMutation } from "../../../Services/drawal.request.service";
+import {  useGetDrawalRequestByIdQuery, useUpdateDrawalRequestMutation } from "../../../Services/drawal.request.service";
   
   const FILE_TYPES = ["image/jpeg", "image/png", "image/gif"];
   
@@ -38,17 +38,18 @@ import {  useUpdateDrawalRequestMutation } from "../../../Services/drawal.reques
     const toast = useToast()
     const [file, setFile] = useState();
     const [isBtnLoading , setIsBtnLoading] = useState(false)
-  
-    const fileredData = requestData?.find((item)=> item?.id === id)
-    console.log(fileredData);
-  
-  
-  
-    const [ updateDrawalRequest ] = useUpdateDrawalRequestMutation()
+ 
+
+
 
-    console.log(updateDrawalRequest);
-    
   
+  
+    const [ updateDrawalRequest ] = useUpdateDrawalRequestMutation() 
+    const { data, isLoading } = useGetDrawalRequestByIdQuery(id, {
+      skip: !id,
+    });
+
+    const filteredData =data?.dat;
     const {
       register,
       reset,
@@ -60,7 +61,7 @@ import {  useUpdateDrawalRequestMutation } from "../../../Services/drawal.reques
   
     useEffect(() => {
       reset({
-        investorAmount:fileredData?.investorAmount
+        investorAmount:filteredData?.investorAmount
       })
     
      
@@ -68,16 +69,10 @@ import {  useUpdateDrawalRequestMutation } from "../../../Services/drawal.reques
     
     const onSubmit = async(data) => {
       setIsBtnLoading(true)
-      const formData = new FormData();
-  
-      formData.append("investorAmount", data.investorAmount);
-      formData.append("comment", data.comment);
-      const file = data.supporting_FileName["0"];
-      formData.append("supporting_FileName", file);
   
   
     try {
-      const res = await updateDrawalRequest({ id ,data: formData})
+      const res = await updateDrawalRequest({ id ,data})
   
   
       if (res?.error) {
@@ -107,11 +102,7 @@ import {  useUpdateDrawalRequestMutation } from "../../../Services/drawal.reques
       const selectedFile = event.target.files[0];
       setFile(selectedFile);
     };
-  
-    const { data, isLoading } = 
-    (id, {
-      skip: !id,
-    });
+ 
   
     useEffect(() => {
       if (data) {
@@ -123,7 +114,9 @@ import {  useUpdateDrawalRequestMutation } from "../../../Services/drawal.reques
     
   
     const heandleOnClose = () =>{
-      reset()
+      reset({
+        investorAmount:""
+      })
       onClose()
     }
   
@@ -140,7 +133,7 @@ import {  useUpdateDrawalRequestMutation } from "../../../Services/drawal.reques
             <Box as="form" onSubmit={handleSubmit(onSubmit)}>
               <ModalBody>
                 <FormControl mb={5} isRequired>
-                  <FormLabel fontSize="sm">Withdrawal Amount (SAR)<Badge colorScheme="green">{fileredData?.currencyCode}</Badge></FormLabel>
+                  <FormLabel fontSize="sm">Withdrawal Amount <Badge colorScheme="green">{filteredData?.currencyCode}</Badge></FormLabel>
                   <Input
                     focusBorderColor="green.400"
                     name="investorAmount"
diff --git a/src/Pages/WithDrawal/DrawalRequest/DrawalRequestReject.jsx b/src/Pages/WithDrawal/DrawalRequest/DrawalRequestReject.jsx
index 5e83932..3766c66 100644
--- a/src/Pages/WithDrawal/DrawalRequest/DrawalRequestReject.jsx
+++ b/src/Pages/WithDrawal/DrawalRequest/DrawalRequestReject.jsx
@@ -20,8 +20,8 @@ import {
   import * as yup from "yup";
   import { yupResolver } from "@hookform/resolvers/yup";
   import { useForm } from "react-hook-form";
-  import { useDepositRejectMutation } from "../../../Services/deposit.request.service";
   import ToastBox from "../../../Components/ToastBox";
+import { useDepositRejectMutation } from "../../../Services/drawal.request.service";
   
   export const conformModalSchema = yup.object().shape({
     comments: yup.string().required("Comment is required"),
@@ -55,8 +55,7 @@ import {
               <ToastBox message={res?.error?.data?.message} status={"error"} />
             ),
           });
-          setIsBtnLoading(false)
-          onClose();
+          heandleOnClose()
           
         }else if(res?.data?.statusCode === 200) {
           toast({
@@ -64,9 +63,7 @@ import {
               <ToastBox message={res?.data?.message} />
             ),
           });
-          setIsBtnLoading(false)
-          onClose();
-          
+          heandleOnClose()
         } 
         
       } catch (error) {
@@ -75,29 +72,12 @@ import {
       }
   
     };
-  
-    const handleFileChange = (event) => {
-      const selectedFile = event.target.files[0];
-      setFile(selectedFile);
-    };
-  
-  
-    const { data, isLoading } = 
-    (id, {
-      skip: !id,
-    });
-  
-    useEffect(() => {
-      if (data) {
-        reset({
-          investorAmount: data?.data?.investorAmount,
-        });
-      }
-    }, [data, reset]);
+
   
     const heandleOnClose = () =>{
       reset()
       onClose()
+      setIsBtnLoading(false)
     }
   
     return (
@@ -106,9 +86,6 @@ import {
         <ModalContent pb={4}>
           <ModalHeader fontSize={"md"}>Reject</ModalHeader>
           <ModalCloseButton />
-          {isLoading ? (
-            <FullscreenLoaders height={"50vh"} />
-          ) : (
           <Box as="form" onSubmit={handleSubmit(onSubmit)}>
             <ModalBody>
               <FormControl mb={4} isRequired>
@@ -154,7 +131,6 @@ import {
               </Button>
             </ModalFooter>
           </Box>
-          )}
         </ModalContent>
       </Modal>
     );
diff --git a/src/Pages/WithDrawal/DrawalRequest/PendingRequest.jsx b/src/Pages/WithDrawal/DrawalRequest/PendingRequest.jsx
index e2f616e..0b2f02a 100644
--- a/src/Pages/WithDrawal/DrawalRequest/PendingRequest.jsx
+++ b/src/Pages/WithDrawal/DrawalRequest/PendingRequest.jsx
@@ -56,7 +56,6 @@ const PendingRequest = () => {
     error,
   } = useGetDrawalRequestQuery({ page: currentPage, size: pageSize });
 
-  console.log(data?.data?.rows);
   
 
 
@@ -293,15 +292,14 @@ const PendingRequest = () => {
             onChange={(e) => setSearchTerm(e.target.value)}
           />
 
-          <HStack display={"flex"} alignItems={"center"}>
             <Pagination
               isLoading={drawalRequestLoading}
               pageSize={pageSize}
-              currentPage={currentPage}
               setPageSize={setPageSize}
+              currentPage={currentPage}
               setCurrentPage={setCurrentPage}
-             />
-          </HStack>
+              totalItems={data?.data?.totalItems}
+            />
         </HStack>
       </Box>
 
diff --git a/src/Routes/Routes.js b/src/Routes/Routes.js
index 44b2b69..f51543e 100644
--- a/src/Routes/Routes.js
+++ b/src/Routes/Routes.js
@@ -75,9 +75,9 @@ export const RouteLink = [
 
   // ===============[ Withdrawal]===============
   { path: "/withdraw-request", Component: PendingRequest },
-  { path: "/withdraw-request", Component: UnderConstruction },
+  // { path: "/withdraw-request", Component: UnderConstruction },
   { path: "/withdraw-history", Component: ViewHistory },
-  { path: "/withdraw-history", Component: UnderConstruction },
+  // { path: "/withdraw-history", Component: UnderConstruction },
 
   // ===============[ Withdrawal]===============
   // { path: "/investor-history", Component: UpgradeHistory },
@@ -86,8 +86,8 @@ export const RouteLink = [
   { path: "/investor-request", Component: UnderConstruction },
 
   // ===============[ Deletion]===============
-  // { path: "/deletion-request", Component: DeletionRequest },
-  { path: "/deletion-request", Component: UnderConstruction },
+  { path: "/deletion-request", Component: DeletionRequest },
+  // { path: "/deletion-request", Component: UnderConstruction },
   // { path: "/deletion-history", Component: DeletionHistory },
   { path: "/deletion-history", Component: UnderConstruction },
 
diff --git a/src/Services/delete.request.service.js b/src/Services/delete.request.service.js
new file mode 100644
index 0000000..4a088d1
--- /dev/null
+++ b/src/Services/delete.request.service.js
@@ -0,0 +1,56 @@
+// investorDetails.service.js
+import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";
+// import { api } from "./api.service";
+import { baseQuery } from "./token.serivce";
+
+// const baseUrl = api?.defaults.baseURL;
+
+// Define a service using a base URL and expected endpoints
+export const deleteRequest = createApi({
+  reducerPath: "deleteRequest",
+  baseQuery: baseQuery,
+  tagTypes: ["getDeleteRequest", "getDeleteHistory"],
+  endpoints: (builder) => ({
+
+
+    getDeleteRequest: builder.query({
+      query: () => `/account/admin/pending-requests`,
+      providesTags: ["getDepositRequest"],
+    }),
+
+    getDeleteRequestById: builder.query({
+      query: (id) => `/account/admin/detail/${id}`,
+    }),
+
+    approveDepositRequest: builder.mutation({
+      query: ({ id, data }) => ({
+        url: `/account/admin/approved-account/${id}`,
+        method: "PATCH",
+        body: data,
+      }),
+      invalidatesTags: ["getDeleteRequest", "getDeleteHistory"],
+    }),
+
+    depositReject: builder.mutation({
+      query: ({ id, data }) => ({
+        url: `/deposit/admin/rejected/${id}`,
+        method: "PATCH",
+        body: data,
+      }),
+      invalidatesTags: ["getDeleteRequest", "getDeleteHistory"],
+    }),
+
+    // getDepositHistory: builder.query({
+    //   query: () => `/deposit/admin/history`,
+    //   providesTags: ["getDepositHistory"],
+    // }),
+  }),
+});
+
+// Export hooks for usage in functional components
+export const {
+  useGetDeleteRequestQuery,
+  useGetDeleteRequestByIdQuery,
+  useApproveDepositRequestMutation
+
+} = deleteRequest;
diff --git a/src/Services/drawal.request.service.js b/src/Services/drawal.request.service.js
index 9264f52..1635712 100644
--- a/src/Services/drawal.request.service.js
+++ b/src/Services/drawal.request.service.js
@@ -17,9 +17,9 @@ export const drawalRequest = createApi({
       providesTags: ["getDrawalRequest"],
     }),
 
-    // getDepositRequestById: builder.query({
-    //   query: (id) => `/deposit/admin/getById/${id}`,
-    // }),
+    getDrawalRequestById: builder.query({
+      query: (id) => `/withdrawal/admin/getById/${id}`,
+    }),
 
     updateDrawalRequest: builder.mutation({
       query: ({ id, data }) => ({
@@ -30,19 +30,19 @@ export const drawalRequest = createApi({
       invalidatesTags: ["getDrawalRequest", "getDepositHistory"],
     }),
 
-    // depositReject: builder.mutation({
-    //   query: ({ id, data }) => ({
-    //     url: `/deposit/admin/rejected/${id}`,
-    //     method: "PATCH",
-    //     body: data,
-    //   }),
-    //   invalidatesTags: ["getDepositRequest", "getDepositHistory"],
-    // }),
+    depositReject: builder.mutation({
+      query: ({ id, data }) => ({
+        url: `/deposit/admin/rejected/${id}`,
+        method: "PATCH",
+        body: data,
+      }),
+      invalidatesTags: ["getDepositRequest", "getDepositHistory"],
+    }),
 
-    // getDepositHistory: builder.query({
-    //   query: () => `/deposit/admin/history`,
-    //   providesTags: ["getDepositHistory"],
-    // }),
+    getDepositHistory: builder.query({
+      query: () => `/deposit/admin/history`,
+      providesTags: ["getDepositHistory"],
+    }),
   }),
 });
 
@@ -50,4 +50,6 @@ export const drawalRequest = createApi({
 export const {
   useGetDrawalRequestQuery,
   useUpdateDrawalRequestMutation,
+  useGetDrawalRequestByIdQuery,
+  useDepositRejectMutation
 } = drawalRequest;
diff --git a/src/Store/Store.js b/src/Store/Store.js
index c0a64a8..2693968 100644
--- a/src/Store/Store.js
+++ b/src/Store/Store.js
@@ -13,6 +13,7 @@ import { contact } from "../Services/contact.service";
 import { depositRequest } from "../Services/deposit.request.service";
 import { apiSlice, baseQuery } from "../Services/token.serivce";
 import { drawalRequest } from "../Services/drawal.request.service";
+import { deleteRequest } from "../Services/delete.request.service";
 
 export const store = configureStore({
   reducer: {
@@ -27,6 +28,7 @@ export const store = configureStore({
     [contact.reducerPath]: contact.reducer,
     [depositRequest.reducerPath]: depositRequest.reducer,
     [drawalRequest.reducerPath]: drawalRequest.reducer,
+    [deleteRequest.reducerPath]: deleteRequest.reducer,
     // Add other reducers as needed
   },
   middleware: (getDefaultMiddleware) =>
@@ -46,6 +48,7 @@ export const store = configureStore({
       contact.middleware,
       depositRequest.middleware,
       drawalRequest.middleware,
+      deleteRequest.middleware,
     ),
 });