Merge remote-tracking branch 'origin/main' into Sprint-10

Reviewed-on: #31

src/Components/Popups/ConfirmReversalPopups.jsx

@@ -29,6 +29,7 @@ export const conformModalSchema = yup.object().shape({
     .string()
     .min(2, "Minimum length should be 2 characters.")
     .max(150, "Maximum length should be 150 characters.")
+    // .matches(/^[^\d]+$/, "Sponsor Name cannot contain numbers")
     .required("Comment is required"),
   subject: yup.string().notRequired(),
   emailTemplate: yup.string().notRequired(),
@@ -58,6 +59,13 @@ const ConfirmReversalPopups = ({
     setValue("emailTemplate", richTextValue);
   }, [richTextValue]);
 
+   // Reset the form when the modal closes
+   useEffect(() => {
+    if (!isOpen) {
+      reset(); // Clear the form state
+    }
+  }, [isOpen, reset]);
+
   const [emailApproval, setEmailApproval] = useBoolean(false);
 
   const modules = {

src/Components/Popups/InitiateReversalPopups.jsx

@@ -13,7 +13,7 @@ import {
   Text,
   Textarea,
 } from "@chakra-ui/react";
-import React from "react";
+import React, { useEffect } from "react";
 import PropTypes from "prop-types";
 
 import * as yup from "yup";
@@ -25,6 +25,7 @@ export const conformModalSchema = yup.object().shape({
     .string()
     .min(2, "Minimum length should be 2 characters.")
     .max(150, "Maximum length should be 150 characters.")
+    // .matches(/^[^\d]+$/, "Sponsor Name cannot contain numbers")
     .required("Comment is required"),
 });
 
@@ -45,6 +46,13 @@ const InitiateReversalPopup = ({
     mode: "all",
   });
 
+    // Reset the form when the modal closes
+    useEffect(() => {
+      if (!isOpen) {
+        reset(); // Clear the form state
+      }
+    }, [isOpen, reset]);
+
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
       <ModalOverlay />

src/Components/Popups/RejectReversalPopups.jsx

@@ -13,7 +13,7 @@ import {
   Text,
   Textarea,
 } from "@chakra-ui/react";
-import React from "react";
+import React, { useEffect } from "react";
 import PropTypes from "prop-types";
 
 import * as yup from "yup";
@@ -25,8 +25,9 @@ export const conformModalSchema = yup.object().shape({
     .string()
     .min(2, "Minimum length should be 2 characters.")
     .max(150, "Maximum length should be 150 characters.")
+    // .matches(/^[^\d]+$/, "Sponsor Name cannot contain numbers")
     .required("Comment is required"),
-});
+}); 
 
 const RejectReversalPopups = ({
   isOpen,
@@ -45,6 +46,13 @@ const RejectReversalPopups = ({
     mode: "all",
   });
 
+   // Reset the form when the modal closes
+   useEffect(() => {
+    if (!isOpen) {
+      reset(); // Clear the form state
+    }
+  }, [isOpen, reset]);
+
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
       <ModalOverlay />

src/Layout/DefaultLayout.jsx

@@ -259,21 +259,21 @@ const DashboardLayout = ({ isOnline }) => {
         return (
           <span className="d-flex align-items-end gap-2">
             <RiMoneyDollarBoxLine className="h4 m-0 fw-normal" />
-            Withdrawal pending request
+            Withdrawal Pending Request
           </span>
         );
       case path.startsWith("/withdraw-history"):
         return (
           <span className="d-flex align-items-end gap-2">
             <RiExchangeBoxLine className="h4 m-0 fw-normal" />
-            Withdrawal request
+            Withdrawal Request
           </span>
         );
       case path.startsWith("/investor-request"):
         return (
           <span className="d-flex align-items-end gap-2">
             <RiMoneyDollarBoxLine className="h4 m-0 fw-normal" />
-            Investor pending request
+            Investor Pending Request
           </span>
         );
       case path.startsWith("/investor-history"):
@@ -287,14 +287,14 @@ const DashboardLayout = ({ isOnline }) => {
         return (
           <span className="d-flex align-items-end gap-2">
             <RiMoneyDollarBoxLine className="h4 m-0 fw-normal" />
-            Deletion pending request
+            Deletion Pending Request
           </span>
         );
       case path.startsWith("/deletion-history"):
         return (
           <span className="d-flex align-items-end gap-2">
             <RiExchangeBoxLine className="h4 m-0 fw-normal" />
-            Deletion request
+            Deletion Request
           </span>
         );
 
@@ -302,21 +302,21 @@ const DashboardLayout = ({ isOnline }) => {
         return (
           <span className="d-flex align-items-end gap-2">
             <RiBankLine className="h4 m-0 fw-normal" />
-            Bank Deposit Request
+            Reversal Transaction / Deposit Request
           </span>
         );
       case path.startsWith("/reversal-fawateer-deposit"):
         return (
           <span className="d-flex align-items-end gap-2">
             <HiOutlineBanknotes className="h4 m-0 fw-normal" />
-            Fawateer Deposit
+            Reversal Transaction / Fawateer Deposit 
           </span>
         );
       case path.startsWith("/account-deletion-request"):
         return (
           <span className="d-flex align-items-end gap-2">
             <RiAccountBoxLine className="h4 m-0 fw-normal" />
-            Account Deletion Request
+            Reversal Transaction / Account Deletion Request
           </span>
         );
 
@@ -366,7 +366,7 @@ const DashboardLayout = ({ isOnline }) => {
         return (
           <span className="d-flex align-items-end gap-2">
             <RiMoneyDollarBoxLine className="h4 m-0 fw-normal" />
-            Deletion pending request
+            Deletion Pending Request
           </span>
         );
       case path.startsWith("/deletion-history"):
@@ -380,7 +380,7 @@ const DashboardLayout = ({ isOnline }) => {
         return (
           <span className="d-flex align-items-end gap-2">
             <RiMoneyDollarBoxLine className="h4 m-0 fw-normal" />
-            Deletion pending request
+            Deletion Pending Request
           </span>
         );
       case path.startsWith("/deletion-history"):
@@ -733,6 +733,7 @@ const DashboardLayout = ({ isOnline }) => {
                   } else if (type === "single") {
                     return (
                       <Tooltip
+                        isDisabled={isDrawerOpen || openDrawerClick}
                         hasArrow
                         bg={"#fff"}
                         fontSize={"xs"}

src/Pages/AccountDeletion/DeletionRequest.jsx

@@ -91,17 +91,17 @@ const DeletionRequest = () => {
   // ====================================================[Table Setup]================================================================
   const tableHeadRow = [
     "Sr No.",
-    "Requested on",
+    "Requested On",
     "Client ID",
-    "First name",
-    "Last name",
+    "First Name",
+    "Last Name",
     "Country",
-    "Phone number",
+    "Phone Number",
     "Status",
     "Action"
   ];
 
-  const extractedArray = filteredData?.map((item, index) => ({
+  const extractedArray = data?.data?.rows?.map((item, index) => ({
     id: item?.id,
     "Sr No.": (
       <Text
@@ -114,7 +114,7 @@ const DeletionRequest = () => {
         {index + 1}.
       </Text>
     ),
-    "Requested on": (
+    "Requested On": (
       <Text
         justifyContent={"left"}
         as={"span"}
@@ -136,7 +136,7 @@ const DeletionRequest = () => {
         {item?.clientId}
       </Text>
     ),
-    "First name": (
+    "First Name": (
       <Text
         justifyContent={"left"}
         as={"span"}
@@ -148,7 +148,7 @@ const DeletionRequest = () => {
         {/* {formatDate(item.charge)} */}
       </Text>
     ),
-    "Last name": (
+    "Last Name": (
       <Text
         justifyContent={"left"}
         as={"span"}
@@ -171,7 +171,7 @@ const DeletionRequest = () => {
       </Text>
     ),
 
-    "Phone number": (
+    "Phone Number": (
       <Text
         justifyContent={"left"}
         as={"span"}

src/Pages/AccountDeletion/DeletionRequestApprove.jsx

@@ -3,6 +3,7 @@ import {
   Box,
   Button,
   FormControl,
+  FormHelperText,
   FormLabel,
   Input,
   Modal,
@@ -21,88 +22,99 @@ 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 {
+  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";
+import {
+  useApproveDepositRequestMutation,
+  useGetDeleteRequestByIdQuery,
+  useGetDeleteRequestQuery,
+} from "../../Services/delete.request.service";
 
 const FILE_TYPES = ["image/jpeg", "image/png", "image/gif"];
 
+// export const conformModalSchema = yup.object().shape({
+//   adminComment: yup.string().notRequired(),
+// });
+
 export const conformModalSchema = yup.object().shape({
   adminComment: yup.string().notRequired(),
 });
 
-const DeletionRequestApprove = ({ isOpen, onClose, firstField, id, data:requestData }) => {
-  const toast = useToast()
+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 [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, {
+  const fileredData = requestData?.find((item) => item?.id === id);
+  const [updateApproveRequest] = useApproveDepositRequestMutation();
+  const { data, isLoading } = useGetDeleteRequestByIdQuery(id, {
     skip: !id,
   });
 
-
   const {
     register,
     reset,
+    watch,
     handleSubmit,
     formState: { errors },
   } = useForm({
     resolver: yupResolver(conformModalSchema),
+    mode: "all",
   });
 
+  const { refetch } = useGetDeleteRequestQuery();
+
   useEffect(() => {
     reset({
-      comment:fileredData?.comment
-    })
-  
-   
-  }, [requestData, id])
-  
-  const onSubmit = async(data) => {
-    setIsBtnLoading(isReject?false:true)
-    setIsBtnLoadingReject(isReject)
+      comment: fileredData?.comment,
+    });
+  }, [requestData, id]);
+
+  const onSubmit = async (data) => {
+    setIsBtnLoading(isReject ? false : true);
+    setIsBtnLoadingReject(isReject);
     const approveReq = {
-      adminComment:data?.adminComment,
-      deletionStatus: isReject?"Reject": "Approved"
+      adminComment: data?.adminComment,
+      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} />,
+        });
+        refetch();
+        heandleOnClose();
+      }
+    } catch (error) {
+      console.log(error);
     }
-
-  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 = () => {
-
-  }
-
-
+  const onReject = () => {};
 
   useEffect(() => {
     if (data) {
@@ -112,16 +124,20 @@ const DeletionRequestApprove = ({ isOpen, onClose, firstField, id, data:requestD
     }
   }, [data, reset]);
 
-  const heandleOnClose = () =>{
-    reset()
-    onClose()
-    setIsBtnLoading(false)
-    setIsReject(false)
-    setIsBtnLoadingReject(false)
-  }
+  const heandleOnClose = () => {
+    reset();
+    onClose();
+    setIsBtnLoading(false);
+    setIsReject(false);
+    setIsBtnLoadingReject(false);
+  };
 
   return (
-    <Modal isOpen={isOpen} onClose={heandleOnClose} initialFocusRef={firstField}>
+    <Modal
+      isOpen={isOpen}
+      onClose={heandleOnClose}
+      initialFocusRef={firstField}
+    >
       <ModalOverlay />
 
       <ModalContent pb={4}>
@@ -133,7 +149,10 @@ const DeletionRequestApprove = ({ isOpen, onClose, firstField, id, data:requestD
           <Box as="form" onSubmit={handleSubmit(onSubmit)}>
             <ModalBody>
               <FormControl mt={6} mb={4}>
-                <FormLabel fontSize="sm">Investor Comment <Badge colorScheme="green">{fileredData?.currencyCode}</Badge></FormLabel>
+                <FormLabel fontSize="sm">
+                  Investor Comment{" "}
+                  <Badge colorScheme="green">{fileredData?.currencyCode}</Badge>
+                </FormLabel>
                 {/* <Textarea
                   focusBorderColor="green.400"
                   name="comment"
@@ -150,8 +169,9 @@ const DeletionRequestApprove = ({ isOpen, onClose, firstField, id, data:requestD
                   </Text>
                 )} */}
 
-
-                <Text fontSize="sm" fontWeight={500} color={'gray.600'}>{data?.data?.comment}</Text>
+                <Text fontSize="sm" fontWeight={500} color={"gray.600"}>
+                  {data?.data?.comment}
+                </Text>
               </FormControl>
               <FormControl mb={4} isRequired>
                 <FormLabel fontSize="sm">Admin Comment</FormLabel>
@@ -163,14 +183,22 @@ const DeletionRequestApprove = ({ isOpen, onClose, firstField, id, data:requestD
                   fontSize="sm"
                   type="textarea"
                   size="sm"
-                  placeholder={"Enter your comments...."}
+                  placeholder={"Enter your comment...."}
                   resize={"none"}
+                  mb={2}
                 />
                 {errors.adminComment && (
                   <Text fontSize="xs" color="red">
                     {errors.adminComment.message}
                   </Text>
                 )}
+                <FormHelperText fontSize="xs" color="gray.500">
+                  <Text as={"span"} me={2}>
+                    {" "}
+                    Maximum length should be 200 characters. You have entered
+                  </Text>
+                  {watch("adminComment")?.length || 0} characters.
+                </FormHelperText>
               </FormControl>
             </ModalBody>
             <ModalFooter>
@@ -180,9 +208,10 @@ const DeletionRequestApprove = ({ isOpen, onClose, firstField, id, data:requestD
                 type="submit"
                 size={"sm"}
                 rounded={"sm"}
-                variant={'ghost'}
-                onClick={()=> setIsReject(true)}
+                variant={"ghost"}
+                onClick={() => setIsReject(true)}
                 isLoading={isBtnLoadingReject}
+                fontWeight={500}
               >
                 Reject
               </Button>

src/Pages/BankDepositRequest/BankDepositRequest.jsx

@@ -117,6 +117,7 @@ const BankDepositRequest = () => {
     "Last Name",
     "Country",
     "Phone Number",
+    "Deposit Amount",
     "Action",
   ];
 
@@ -212,16 +213,30 @@ const BankDepositRequest = () => {
       </Box>
     ),
     Country: (
-      <Box w={"80px"} isTruncated={true}>
+      <Box  isTruncated={true}>
         <Text as={"span"} color={"teal.900"}>
           {item?.countryName}
         </Text>
       </Box>
     ),
     "Phone Number": (
-      <Box w={"80px"} isTruncated={true}>
+      <Box  isTruncated={true}>
         <Text as={"span"} color={"teal.900"}>
-          {item?.mobileNumber}
+          {item?.ISDCode} {item?.mobileNumber}
+          {/* {item?.ISDcode + " " + item?.mobileNumber} */}
+        </Text>
+      </Box>
+    ),
+    "Deposit Amount": (
+      <Box isTruncated={true} display={"flex"} justifyContent={"end"}>
+        <Text as={"span"} color={"teal.900"} textAlign={"right"}>
+          {parseFloat(item?.investorAmount || 0).toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          })}
+          <Badge ms={1} colorScheme="green">
+            {item?.currencyCode}
+          </Badge>
         </Text>
       </Box>
     ),

src/Pages/FawateerChecker/ApproveHistory/ApproveHistoryChecker.jsx

@@ -37,6 +37,7 @@ const ApproveHistory = () => {
   const [actionId, setActionId] = useState(false);
   const [mouseEntered, setMouseEntered] = useState(false);
   const [mouseEnteredId, setMouseEnteredId] = useState("");
+  const [debouncedSearchTerm, setDebouncedSearchTerm] = useState("");
 
   const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size);
   const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page);
@@ -60,12 +61,31 @@ const ApproveHistory = () => {
     onClose: onRejectClose,
   } = useDisclosure();
 
+  // Debounce the search term to avoid making a request on every keystroke
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedSearchTerm(searchTerm);
+    }, 500); // Adjust delay as needed
+    return () => {
+      clearTimeout(handler);
+    };
+  }, [searchTerm]);
+
   const {
     data,
     isLoading: drawalRequestLoading,
     error,
     refetch,
-  } = useGetApproveHistoryQuery();
+  } = useGetApproveHistoryQuery(
+    {
+      page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
+      size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search
+      searchTerm: debouncedSearchTerm,
+    },
+    {
+      skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
+    }
+  );
 
   console.log(data?.data?.rows);
 
@@ -84,6 +104,15 @@ const ApproveHistory = () => {
     return () => clearTimeout(timer);
   }, []);
 
+
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedSearchTerm(searchTerm);
+    }, 500); // Adjust delay as needed
+    return () => {
+      clearTimeout(handler);
+    };
+  }, [searchTerm]);
   // ====================================================[Table Filter]================================================================
   const filteredData = data?.data?.rows?.filter((item) => {
     // Filter by name (case insensitive)
@@ -117,7 +146,7 @@ const ApproveHistory = () => {
     "Status",
   ];
 
-  const extractedArray = filteredData?.map((item, idx) => ({
+  const extractedArray = data?.data?.rows?.map((item, idx) => ({
     // id: item?.id,
     "Sr.no": (
       <Text
@@ -172,11 +201,7 @@ const ApproveHistory = () => {
       </Box>
     ),
     "Deposit Date": (
-      <Box
-        w={"100px"}
-        isTruncated={true}
-        display={"flex"}
-      >
+      <Box w={"100px"} isTruncated={true} display={"flex"}>
         <Text as={"span"} color={"teal.900"}>
           {formatDate(item?.transaction_date)}
         </Text>
@@ -202,28 +227,27 @@ const ApproveHistory = () => {
         fontWeight={"500"}
         className="d-flex align-items-center web-text-small"
       >
-        {item?.spportFile_path&&<Badge
-          px={2}
-          py={0.5}
-          textTransform={"inherit"}
-          fontWeight={500}
-          colorScheme={"forestGreen"}
-        >
-          <Link
-            href={import.meta.env.VITE_IMAGE_URL + item?.spportFile_path}
-            isExternal
-            display={"flex"}
-            alignItems={"center"}
+        {item?.spportFile_path && (
+          <Badge
+            px={2}
+            py={0.5}
+            textTransform={"inherit"}
+            fontWeight={500}
+            colorScheme={"forestGreen"}
           >
-            <Box me={"1px"}
-              as="span"
-              cursor={"pointer"}
+            <Link
+              href={import.meta.env.VITE_IMAGE_URL + item?.spportFile_path}
+              isExternal
+              display={"flex"}
+              alignItems={"center"}
             >
-              View
-            </Box>
-            <ExternalLinkIcon />
-          </Link>
-        </Badge>}
+              <Box me={"1px"} as="span" cursor={"pointer"}>
+                View
+              </Box>
+              <ExternalLinkIcon />
+            </Link>
+          </Badge>
+        )}
       </Text>
     ),
     Status: (
@@ -236,12 +260,12 @@ const ApproveHistory = () => {
           rounded={4}
           colorScheme={
             item?.transactionStatus === "Approved"
-            ? "green"
-            : item?.transactionStatus === "Pending"
-            ? "yellow"
-            : item?.transactionStatus === "Reject"
-            ? "red"
-            : "gray" // default border color if status doesn't match any condition
+              ? "green"
+              : item?.transactionStatus === "Pending"
+              ? "yellow"
+              : item?.transactionStatus === "Reject"
+              ? "red"
+              : "gray" // default border color if status doesn't match any condition
           }
         >
           {item.transactionStatus}

src/Pages/FawateerChecker/ApproveRequest/RequestApproveModal.jsx

@@ -104,6 +104,12 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
     }
   }, [data, reset]);
 
+  useEffect(() => {
+    if (!isOpen) {
+      reset(); 
+    }
+  }, [isOpen, reset]);
+
   const heandleOnClose = () =>{
     reset()
     onClose() 
@@ -130,11 +136,11 @@ const RequestApproveModal = ({ isOpen, onClose, firstField ,id}) => {
                 fontSize="sm"
                 type="textarea"
                 size="md"
-                placeholder={"Enter your checkerComment...."}
+                placeholder={"Enter your checker Comment...."}
                 rounded={"md"}
                 resize={"none"}
                 maxLength={200}
-              />
+              /> 
               {errors.checkerComment && (
                 <Text fontSize="xs" color="red">
                   {errors.checkerComment.message}

src/Pages/FawateerChecker/ApproveRequest/RequestRejectModal.jsx

@@ -2,6 +2,7 @@ import {
   Box,
   Button,
   FormControl,
+  FormHelperText,
   FormLabel,
   Input,
   Modal,
@@ -24,8 +25,18 @@ import { useDepositRejectMutation } from "../../../Services/deposit.request.serv
 import ToastBox from "../../../Components/ToastBox";
 import { useRejectCommentMutation } from "../../../Services/fawateer.request.service";
 
+// export const conformModalSchema = yup.object().shape({
+//   comments: yup.string().required("Comment is required")
+//   .max(200, "Approve Comment cannot be more than 200 characters"),
+// });
+
 export const conformModalSchema = yup.object().shape({
-  comments: yup.string().required("Comment is required"),
+  // checkerComment: yup.string().required("Comment is required")
+  // .max(50, "Investment name cannot be more than 50 characters"),
+  comments: yup
+  .string()
+  .required("Comment is required")
+  .max(200, "Approve Comment cannot be more than 200 characters"),
 });
 
 const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
@@ -36,12 +47,20 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
   const {
     register,
     reset,
+    watch,
     handleSubmit,
     formState: { errors },
   } = useForm({
     resolver: yupResolver(conformModalSchema),
   });
 
+  useEffect(() => {
+    if (!isOpen) {
+      reset(); // Clear the form state
+    }
+  }, [isOpen, reset]);
+
+
   const [ rejectFawateer ] = useRejectCommentMutation()
   
 
@@ -101,7 +120,7 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
     reset()
     onClose()
   }
-
+ 
   return (
     <Modal isCentered isOpen={isOpen} onClose={heandleOnClose} initialFocusRef={firstField}>
       <ModalOverlay />
@@ -126,12 +145,17 @@ const RequestRejectModal = ({ isOpen, onClose, firstField ,id}) => {
                 placeholder={"Enter your comments...."}
                 rounded={"md"}
                 resize={"none"}
+                maxLength={200}
               />
               {errors.comments && (
                 <Text fontSize="xs" color="red">
                   {errors.comments.message}
                 </Text>
               )}
+              <FormHelperText fontSize="xs" color="gray.500">
+                Maximum length should be 200 characters. You have entered
+                <Text as={'span'} ml={2}>{watch("comments")?.length || 0} </Text>characters.
+              </FormHelperText>
             </FormControl>
           </ModalBody>
           <ModalFooter>

src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx

@@ -130,6 +130,7 @@ const ReversalFawateerDeposit = () => {
     "First Name",
     "Last Name",
     "Phone Number",
+    "Deposit Amount (BHD)",
     "Action",
   ];
 
@@ -188,7 +189,21 @@ const ReversalFawateerDeposit = () => {
     "Phone Number": (
       <Box w={"100px"} isTruncated={true}>
         <Text as={"span"} color={"teal.900"}>
-          {item?.principal?.mobileNumber}
+          {/* {item?.principal?.ISDcode} {item?.principal?.mobileNumber} */}
+          {item?.principal?.ISDcode + " " + item?.principal?.mobileNumber}
+        </Text>
+      </Box>
+    ),
+    "Deposit Amount (BHD)": (
+      <Box isTruncated={true}>
+        <Text as={"span"} color={"teal.900"} textAlign={"right"}>
+          {parseFloat(item?.transaction_details?.investorAmount || 0).toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          })}
+          <Badge ms={1} colorScheme="green">
+            {item?.currencyCode}
+          </Badge>
         </Text>
       </Box>
     ),

src/Pages/WithDrawal/DrawalView/ViewHistory.jsx

@@ -133,7 +133,7 @@ const ViewHistory = () => {
     "Status",
   ];
 
-  const extractedArray = filteredData?.map((item, index) => ({
+  const extractedArray = data?.data?.rows?.map((item, index) => ({
     // id: item?.id,
     "Sr.no": (
       <Text

src/Routes/Nav.js

@@ -109,7 +109,7 @@ export const nav = [
     title: "Fawateer Deposit",
     submenu: [
       {
-        title: "Aprover Request",
+        title: "Approver Request",
         path: "/fawateer",
         icon: RiMoneyDollarBoxLine,
       },

src/Services/fawateer.request.service.js

@@ -9,7 +9,7 @@ import { baseQuery } from "./token.serivce";
 export const fawateerRequest = createApi({
   reducerPath: "fawateerRequest",
   baseQuery: baseQuery,
-  tagTypes: ["getFawateerRequest" ,"getApproveHistory","getApproveComment","getRejectComment","getFawateerMakerRequest"],
+  tagTypes: ["getFawateerRequest", "getApproveHistory", "getApproveComment", "getRejectComment", "getFawateerMakerRequest"],
   endpoints: (builder) => ({
 
 
@@ -37,7 +37,7 @@ export const fawateerRequest = createApi({
     }),
 
 
-    
+
 
     getFawateerForMakerRequest: builder.query({
       query: ({ page, size, searchTerm }) => {
@@ -50,8 +50,19 @@ export const fawateerRequest = createApi({
       providesTags: ["getFawateerMakerRequest"],
     }),
 
+    // getApproveHistory: builder.query({
+    //   query: () => `/fawateer/admin/getAll`,
+    //   providesTags: ["getApproveHistory"],
+    // }),
+
     getApproveHistory: builder.query({
-      query: () => `/fawateer/admin/getAll`,
+      query: ({ page, size, searchTerm }) => {
+        let baseURL = `/fawateer/admin/getAll?search=${searchTerm || ""}`;
+        if (page !== undefined && size !== undefined) {
+          baseURL += `&page=${page}&size=${size}`; // Only add pagination if both are defined
+        }
+        return baseURL;
+      },
       providesTags: ["getApproveHistory"],
     }),
 
@@ -72,16 +83,16 @@ export const fawateerRequest = createApi({
       }),
       invalidatesTags: ["getFawateerRequest"],
     }),
-
+ 
   }),
 });
 
 // Export hooks for usage in functional components
 export const {
-    useGetFawateerRequestQuery,
-    useGetApproveHistoryQuery,
-    useApproveCommentMutation,
-    useRejectCommentMutation,
-    useGetFawateerForMakerRequestQuery,
-    useGetFawateerInvestorsQuery
+  useGetFawateerRequestQuery,
+  useGetApproveHistoryQuery,
+  useApproveCommentMutation,
+  useRejectCommentMutation,
+  useGetFawateerForMakerRequestQuery,
+  useGetFawateerInvestorsQuery
 } = fawateerRequest;