From cbfeff4710ef15c95356575db0ab7c7ee32f9d54 Mon Sep 17 00:00:00 2001
From: YasinShaikh123 <123150391+YasinShaikh123@users.noreply.github.com>
Date: Fri, 17 Jan 2025 16:02:01 +0530
Subject: [PATCH] [ Update table fawateer deposite ]

---
 .../Popups/RejectReversalPopups.jsx           | 124 ++++++++++++++++++
 .../Investor/UnbanInvestor/ReasonBanModal.jsx |   2 +-
 .../BankDepositRequest/BankDepositRequest.jsx |  55 +++++++-
 src/Pages/BankDepositRequest/RejectModal.jsx  | 107 ++++++++++-----
 .../DepositRequest/DepositRequestReject.jsx   |   2 +-
 .../ReversalFawateerDeposit.jsx               |  28 ++--
 .../reversal.fawateer.deposit.service.js      |   8 +-
 7 files changed, 267 insertions(+), 59 deletions(-)
 create mode 100644 src/Components/Popups/RejectReversalPopups.jsx

diff --git a/src/Components/Popups/RejectReversalPopups.jsx b/src/Components/Popups/RejectReversalPopups.jsx
new file mode 100644
index 0000000..8fc8bf8
--- /dev/null
+++ b/src/Components/Popups/RejectReversalPopups.jsx
@@ -0,0 +1,124 @@
+import {
+  Box,
+  Button,
+  FormControl,
+  FormLabel,
+  Modal,
+  ModalBody,
+  ModalCloseButton,
+  ModalContent,
+  ModalFooter,
+  ModalHeader,
+  ModalOverlay,
+  Text,
+  Textarea,
+} from "@chakra-ui/react";
+import React from "react";
+import PropTypes from "prop-types";
+
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+
+export const conformModalSchema = yup.object().shape({
+  comments: yup
+    .string()
+    .min(2, "Minimum length should be 150 characters.")
+    .max(150, "Maximum length should be 150 characters.")
+    .matches(/^[^\d]+$/, "Sponsor Name cannot contain numbers")
+    .required("Comment is required"),
+});
+
+const RejectReversalPopups = ({
+  isOpen,
+  onClose,
+  handelApproved,
+  isLoading,
+}) => {
+  const {
+    watch,
+    register,
+    reset,
+    handleSubmit,
+    formState: { errors },
+  } = useForm({
+    resolver: yupResolver(conformModalSchema),
+    mode: "all",
+  });
+
+  return (
+    <Modal isOpen={isOpen} onClose={onClose}>
+      <ModalOverlay />
+      <ModalContent pb={4}>
+        <ModalHeader fontSize={"md"}>Reject</ModalHeader>
+        <ModalCloseButton />
+        <Box
+          as="form"
+          onSubmit={handleSubmit((data) => {
+            handelApproved(data);
+            reset();
+            onClose();
+          })}
+        >
+          <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>
+              ) : (
+                <Text fontSize="xs" color="gray.500">
+                  Maximum length should be 150 characters. You have entered{" "}
+                  {watch()?.comments?.length || 0} characters.
+                </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"}
+              type="submit"
+              fontWeight={400}
+            >
+              Send
+            </Button>
+          </ModalFooter>
+        </Box>
+      </ModalContent>
+    </Modal>
+  );
+};
+
+RejectReversalPopups.propTypes = {
+  isOpen: PropTypes.bool.isRequired,
+  onClose: PropTypes.func.isRequired,
+  handelApproved: PropTypes.func.isRequired,
+  isLoading: PropTypes.func.isRequired,
+};
+
+export default RejectReversalPopups;
diff --git a/src/Pages/Admin/Investor/UnbanInvestor/ReasonBanModal.jsx b/src/Pages/Admin/Investor/UnbanInvestor/ReasonBanModal.jsx
index 3e7d9d2..6acb4a1 100644
--- a/src/Pages/Admin/Investor/UnbanInvestor/ReasonBanModal.jsx
+++ b/src/Pages/Admin/Investor/UnbanInvestor/ReasonBanModal.jsx
@@ -34,7 +34,7 @@ import { useUpdateBanMutation, useUpdateUnbanMutation } from "../../../../Servic
     const toast = useToast()
   
     const {
-      register,
+      register, 
       reset,
       handleSubmit,
       formState: { errors },
diff --git a/src/Pages/BankDepositRequest/BankDepositRequest.jsx b/src/Pages/BankDepositRequest/BankDepositRequest.jsx
index 00524f4..8cd0986 100644
--- a/src/Pages/BankDepositRequest/BankDepositRequest.jsx
+++ b/src/Pages/BankDepositRequest/BankDepositRequest.jsx
@@ -10,6 +10,7 @@ import {
   useToast,
   useDisclosure,
   Link,
+  useBoolean,
 } from "@chakra-ui/react";
 import React, { useContext, useEffect, useState } from "react";
 import { useNavigate } from "react-router-dom";
@@ -27,7 +28,11 @@ import { useGetDepositHistoryQuery } from "../../Services/deposit.request.servic
 import Pagination from "../../Components/Pagination";
 import ConfirmModal from "./ConfirmModal";
 import RejectModal from "./RejectModal";
-import { useGetBankDepositMasterQuery } from "../../Services/bankdeposit.request.service";
+import {
+  useGetBankDepositMasterQuery,
+  useRejectbankDepositRequestMutation,
+} from "../../Services/bankdeposit.request.service";
+import RejectReversalPopups from "../../Components/Popups/RejectReversalPopups";
 
 const formatDate = (date) => {
   return new Date(date).toLocaleDateString("en-GB", {
@@ -64,6 +69,9 @@ const BankDepositRequest = () => {
   const [searchTerm, setSearchTerm] = useState("");
   const [debouncedSearchTerm, setDebouncedSearchTerm] = useState("");
 
+  const [rejectbankDepositRequest] = useRejectbankDepositRequestMutation();
+  const [isReversalLoading, setIsReversalLoading] = useBoolean();
+
   // Debounce the search term to avoid making a request on every keystroke
   useEffect(() => {
     const handler = setTimeout(() => {
@@ -283,10 +291,53 @@ const BankDepositRequest = () => {
     setIsLoading(true);
   };
 
+  const handleApproved = async (data) => {
+    setIsReversalLoading.on(); // Start loading
+    try {
+      const { error, data: responseData } = await rejectbankDepositRequest({
+        id: actionId,
+        data,
+      });
+
+      if (error) {
+        throw error; // Explicitly handle the error
+      }
+
+      // Success: Perform necessary actions
+      refetch();
+      toast({
+        render: () => (
+          <ToastBox message={responseData?.message || "Action successful!"} />
+        ),
+      });
+      onRejectClose();
+    } catch (error) {
+      // Handle errors
+      toast({
+        render: () => (
+          <ToastBox
+            message={
+              error?.data?.message || "Something went wrong. Please try again."
+            }
+            status="error"
+          />
+        ),
+      });
+      console.error("Error:", error);
+    } finally {
+      setIsReversalLoading.off(); // Ensure loading is toggled off
+    }
+  };
+
   return (
     <Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={38}>
       <ConfirmModal isOpen={isConfirmOpen} onClose={onConfirmClose} />
-      <RejectModal isOpen={isRejectOpen} onClose={onRejectClose} />
+      <RejectReversalPopups
+        isOpen={isRejectOpen}
+        onClose={onRejectClose}
+        handelApproved={handleApproved}
+        isLoading={isReversalLoading}
+      />
       <Box bg="white.500">
         <HStack
           display={"flex"}
diff --git a/src/Pages/BankDepositRequest/RejectModal.jsx b/src/Pages/BankDepositRequest/RejectModal.jsx
index df2b79f..6a905b1 100644
--- a/src/Pages/BankDepositRequest/RejectModal.jsx
+++ b/src/Pages/BankDepositRequest/RejectModal.jsx
@@ -3,7 +3,6 @@ import {
   Button,
   FormControl,
   FormLabel,
-  Input,
   Modal,
   ModalBody,
   ModalCloseButton,
@@ -13,48 +12,75 @@ import {
   ModalOverlay,
   Text,
   Textarea,
-  useDisclosure,
+  useToast,
 } from "@chakra-ui/react";
-import React from "react";
+import React, { useState } from "react";
 import * as yup from "yup";
 import { yupResolver } from "@hookform/resolvers/yup";
 import { useForm } from "react-hook-form";
+import { useRejectbankDepositRequestMutation } from "../../Services/bankdeposit.request.service";
+import ToastBox from "../../Components/ToastBox";
 
 export const conformModalSchema = yup.object().shape({
-    comment: yup.string().required("Comment is required"),
+  comments: yup.string().required("Comment is required"),
 });
 
-const RejectModal = ({ isOpen, onClose, firstField }) => {
+const RejectModal = ({ isOpen, onClose, firstField ,id}) => {
+  const [isBtnLoading , setIsBtnLoading] = useState(false)
+
+  const toast = useToast()
+
   const {
-    register,
+    register, 
+    reset,
     handleSubmit,
     formState: { errors },
   } = useForm({
     resolver: yupResolver(conformModalSchema),
   });
 
-  const onSubmit = (data) => {
-    setFile(data.document[0]);
+  const [ rejectbankDepositRequest ] = useRejectbankDepositRequestMutation()  
 
-    const newDocument = {
-      ...data,
-      document: data.document[0].name, // Store the document name
-      comment: true,
-      id: uuidv4(),
-      Type: getFileIcon(file.type),
-    };
+  const onSubmit = async(data) => {
+    console.log(id);
+    setIsBtnLoading(true)
+    try {
+      const res = await rejectbankDepositRequest({ id ,data})
+      console.log(res);
+  
+      if (res?.error) {
+        toast({
+          render: () => (
+            <ToastBox message={res?.error?.data?.message} status={"error"} />
+          ),
+        });
+        heandleOnClose()
+        
+      }else if(res?.data) {
+        toast({
+          render: () => (
+            <ToastBox message={res?.data?.success} />
+          ),
+        });
+        heandleOnClose()
+      } 
+      
+    } catch (error) {
+      console.log(error);
+      
+    }
 
-    setCreate((prevCreate) => [...prevCreate, newDocument]);
-    onClose();
-  }; 
-
-  const handleFileChange = (event) => {
-    const selectedFile = event.target.files[0];
-    setFile(selectedFile);
   };
 
+
+  const heandleOnClose = () =>{
+    reset()
+    onClose()
+    setIsBtnLoading(false)
+  }
+
   return (
-    <Modal isOpen={isOpen} onClose={onClose} initialFocusRef={firstField}>
+    <Modal isOpen={isOpen} onClose={heandleOnClose} initialFocusRef={firstField}>
       <ModalOverlay />
       <ModalContent pb={4}>
         <ModalHeader fontSize={"md"}>Reject</ModalHeader>
@@ -63,29 +89,44 @@ const RejectModal = ({ isOpen, onClose, firstField }) => {
           <ModalBody>
             <FormControl mb={4} isRequired>
               <FormLabel fontSize="sm">Comment</FormLabel>
-              <Textarea rows={6} 
-               focusBorderColor='green.400'
-                name="fileName"
-                {...register("fileName")}
+              <Textarea
+                rows={6}
+                focusBorderColor="green.400"
+                name="comments"
+                {...register("comments")}
                 fontSize="sm"
                 type="textarea"
                 size="md"
                 placeholder={"Enter your comments...."}
-                rounded={'md'}
-                resize={'none'}
+                rounded={"md"}
+                resize={"none"}
               />
-              {errors.comment && (
+              {errors.comments && (
                 <Text fontSize="xs" color="red">
-                  {errors.comment.message}
+                  {errors.comments.message}
                 </Text>
               )}
             </FormControl>
           </ModalBody>
           <ModalFooter>
-            <Button colorScheme="gray" mr={3} onClick={onClose} size={'sm'} rounded={'sm'}>
+            <Button
+              colorScheme="gray"
+              mr={3}
+              onClick={onClose}
+              size={"sm"}
+              rounded={"sm"}
+            >
               Cancel
             </Button>
-            <Button colorScheme="forestGreen" variant="solid" size={'sm'} rounded={'sm'}>
+            <Button
+              colorScheme="forestGreen"
+              variant="solid"
+              size={"sm"}
+              rounded={"sm"}
+              isLoading={isBtnLoading}
+              type="submit"
+              fontWeight={400}
+            >
               Send
             </Button>
           </ModalFooter>
diff --git a/src/Pages/Deposit/DepositRequest/DepositRequestReject.jsx b/src/Pages/Deposit/DepositRequest/DepositRequestReject.jsx
index 8aead10..8a8ea29 100644
--- a/src/Pages/Deposit/DepositRequest/DepositRequestReject.jsx
+++ b/src/Pages/Deposit/DepositRequest/DepositRequestReject.jsx
@@ -110,7 +110,7 @@ const DepositRequestReject = ({ isOpen, onClose, firstField ,id}) => {
         <ModalHeader fontSize={"md"}>Investor Comment</ModalHeader>
         <ModalCloseButton />
         {isLoading ? (
-          <FullscreenLoaders height={"50vh"} /> 
+          <FullscreenLoaders height={"50vh"} />
         ) : (
         <Box as="form" onSubmit={handleSubmit(onSubmit)}>
           <ModalBody>
diff --git a/src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx b/src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx
index bf1376e..43bfc99 100644
--- a/src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx
+++ b/src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx
@@ -61,7 +61,7 @@ import { useGetFawateerDepositMasterQuery } from "../../Services/reversal.fawate
       onClose: onRejectClose,
     } = useDisclosure();
 
-    const {
+    const { 
         data,
         isLoading: drawalRequestLoading,
         error,
@@ -77,7 +77,7 @@ import { useGetFawateerDepositMasterQuery } from "../../Services/reversal.fawate
         }
       );
   
-    console.log(data);
+    console.log("ffffffffffffffffffffff",data?.data?.rows);
 
     useEffect(() => {
         const handler = setTimeout(() => {
@@ -104,9 +104,9 @@ import { useGetFawateerDepositMasterQuery } from "../../Services/reversal.fawate
     }, []);
   
     // ====================================================[Table Filter]================================================================
-    const filteredData = data?.data?.rows?.filter((item) => {
+    const filteredData =data?.data?.rows?.filter((item) => {
       // Filter by name (case insensitive)
-      const name = item.firstName;
+      const name = item.principal?.firstName;
       const searchLower = searchTerm.toLowerCase();
       const nameMatches = name.toLowerCase().includes(searchLower);
   
@@ -130,7 +130,6 @@ import { useGetFawateerDepositMasterQuery } from "../../Services/reversal.fawate
       "First Name",
       "Last Name",
       "Phone Number",
-      "Country",
       "Action",
     ];
   
@@ -158,7 +157,7 @@ import { useGetFawateerDepositMasterQuery } from "../../Services/reversal.fawate
           fontWeight={"500"}
           className="d-flex align-items-center web-text-small"
         >
-          {formatDate(item?.createdAt)}
+          {formatDate(item?.transaction_details?.isReversalDate)}
         </Text>
       ),
       "Client ID": (
@@ -170,34 +169,27 @@ import { useGetFawateerDepositMasterQuery } from "../../Services/reversal.fawate
           fontWeight={"500"}
           className="d-flex align-items-center web-text-small"
         >
-          {item.clientReference_id}
+          {item?.principal?.investor_details?.clientReference_id}
         </Text>
       ),
       "First Name": (
         <Box isTruncated={true} w={"80px"}>
           <Text as={"span"} color={"teal.900"} fontWeight={"500"}>
-            {item.firstName}
+            {item?.principal?.firstName}
           </Text>
         </Box>
       ),
       "Last Name": (
-        <Box w={"50px"} isTruncated={true}>
+        <Box isTruncated={true}>
           <Text as={"span"} color={"teal.900"}>
-            {item.lastName}
-          </Text>
-        </Box>
-      ),
-      "Country": (
-        <Box w={"50px"} isTruncated={true}>
-          <Text as={"span"} color={"teal.900"}>
-            {item.lastName}
+            {item?.principal?.lastName}
           </Text>
         </Box>
       ),
       "Phone Number": (
         <Box w={"100px"} isTruncated={true}>
           <Text as={"span"} color={"teal.900"}>
-            {item.mobileNumber}
+            {item?.principal?.mobileNumber}
           </Text>
         </Box>
       ),
diff --git a/src/Services/reversal.fawateer.deposit.service.js b/src/Services/reversal.fawateer.deposit.service.js
index 252ba66..0d74222 100644
--- a/src/Services/reversal.fawateer.deposit.service.js
+++ b/src/Services/reversal.fawateer.deposit.service.js
@@ -6,12 +6,12 @@ import { baseQuery } from "./token.serivce";
 export const reversalFawateerDepositMaster = createApi({
   reducerPath: "FawateerDeposit",
   baseQuery: baseQuery,
-  tagTypes: ["getFawateerDeposit", 'getDepositHistory'],
+  tagTypes: ["getFawateerDeposit", "getDepositHistory"],
   endpoints: (builder) => ({
     // ======[Get All]=====
 
     getFawateerDepositMaster: builder.query({
-      query: () => `/reversal-transactions/bank-transfer/getAll`,
+      query: () => `/reversal-transactions/fawateer/getAll`,
       providesTags: ["getFawateerDeposit"],
     }),
 
@@ -35,13 +35,13 @@ export const reversalFawateerDepositMaster = createApi({
 
     rejectFawateerRequest: builder.mutation({
       query: ({ id, data }) => ({
-        url: `/reversal-transactions/bank-transfer/reject/${id}`,
+        url: `/reversal-transactions/fawateer/reject/${id}`,
         method: "PATCH",
         body: data,
       }),
       invalidatesTags: ["getFawateerDeposit", "getDepositHistory"],
     }),
-  })
+  }),
 });
 
 export const {