From f9b1f820c22ec5a842605a0b48b8ff915e017707 Mon Sep 17 00:00:00 2001
From: YasinShaikh123 <123150391+YasinShaikh123@users.noreply.github.com>
Date: Thu, 16 Jan 2025 15:55:42 +0530
Subject: [PATCH] [working Reversal]
---
.../BankDepositRequest/BankDepositRequest.jsx | 413 ++++++++++++++++++
src/Pages/BankDepositRequest/ConfirmModal.jsx | 137 ++++++
src/Pages/BankDepositRequest/RejectModal.jsx | 98 +++++
.../Dashboard/InvestmentOpportunities.jsx | 2 +-
.../ReversalAccountDeletion/ConfirmModal.jsx | 137 ++++++
.../ReversalAccountDeletion/RejectModal.jsx | 98 +++++
.../ReversalAccountDeletion.jsx | 322 ++++++++++++++
.../ReversalFawateerDeposit/ConfirmModal.jsx | 137 ++++++
.../ReversalFawateerDeposit/RejectModal.jsx | 98 +++++
.../ReversalFawateerDeposit.jsx | 390 +++++++++++++++++
src/Routes/Nav.js | 28 ++
src/Routes/Routes.js | 8 +
12 files changed, 1867 insertions(+), 1 deletion(-)
create mode 100644 src/Pages/BankDepositRequest/BankDepositRequest.jsx
create mode 100644 src/Pages/BankDepositRequest/ConfirmModal.jsx
create mode 100644 src/Pages/BankDepositRequest/RejectModal.jsx
create mode 100644 src/Pages/ReversalAccountDeletion/ConfirmModal.jsx
create mode 100644 src/Pages/ReversalAccountDeletion/RejectModal.jsx
create mode 100644 src/Pages/ReversalAccountDeletion/ReversalAccountDeletion.jsx
create mode 100644 src/Pages/ReversalFawateerDeposit/ConfirmModal.jsx
create mode 100644 src/Pages/ReversalFawateerDeposit/RejectModal.jsx
create mode 100644 src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx
diff --git a/src/Pages/BankDepositRequest/BankDepositRequest.jsx b/src/Pages/BankDepositRequest/BankDepositRequest.jsx
new file mode 100644
index 0000000..f6b3c21
--- /dev/null
+++ b/src/Pages/BankDepositRequest/BankDepositRequest.jsx
@@ -0,0 +1,413 @@
+import {
+ Badge,
+ Box,
+ Button,
+ HStack,
+ Input,
+ Switch,
+ Text,
+ Tooltip,
+ useToast,
+ useDisclosure,
+ Link,
+} from "@chakra-ui/react";
+import React, { useContext, useEffect, useState } from "react";
+import { useNavigate } from "react-router-dom";
+
+import { CheckIcon, CloseIcon, ExternalLinkIcon } from "@chakra-ui/icons";
+import { debounce } from "../Admin/Contact";
+import { OPACITY_ON_LOAD } from "../../Layout/animations";
+import GlobalStateContext from "../../Contexts/GlobalStateContext";
+import CustomAlertDialog from "../../Components/CustomAlertDialog";
+import ToastBox from "../../Components/ToastBox";
+import NormalTable from "../../Components/DataTable/NormalTable";
+import { TABLE_PAGINATION } from "../../Constants/Paginations";
+import { generateSerialNumber } from "../../Constants/Constants";
+import { useGetDepositHistoryQuery } from "../../Services/deposit.request.service";
+import Pagination from "../../Components/Pagination";
+import ConfirmModal from "./ConfirmModal";
+import RejectModal from "./RejectModal";
+
+const formatDate = (date) => {
+ return new Date(date).toLocaleDateString("en-GB", {
+ day: "2-digit",
+ month: "2-digit",
+ year: "numeric",
+ });
+}; // Simple date formatter
+
+const BankDepositRequest = () => {
+ const navigate = useNavigate();
+ const toast = useToast();
+ const { depositHistory, setDepositHistory, slideFromRight } =
+ useContext(GlobalStateContext);
+ const [isLoading, setIsLoading] = useState(true);
+ const [deleteAlert, setDeleteAlert] = useState(false);
+ const [actionId, setActionId] = useState(false);
+ 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();
+
+ // =========================== [Use State] =============================
+ const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size);
+ const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page);
+ const [searchTerm, setSearchTerm] = useState("");
+ const [debouncedSearchTerm, setDebouncedSearchTerm] = useState("");
+
+ // 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,
+ error,
+ refetch,
+ isLoading: depositHistoryLoading,
+ } = useGetDepositHistoryQuery(
+ {
+ page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
+ size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search
+ search: debouncedSearchTerm,
+ },
+ {
+ skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
+ }
+ );
+
+ // Use useEffect to refetch data when the component mounts
+ useEffect(() => {
+ refetch();
+ }, [refetch]);
+
+ // ====================================================[Table Setup]================================================================
+ const tableHeadRow = [
+ "Sr.no",
+ "Request Date",
+ "Client ID",
+ "First Name",
+ "Last Name",
+ "Country",
+ "Phone Number",
+ "Deposit Amount",
+ "Deposit Date",
+ "Status",
+ "Supporting's",
+ "Action",
+ ];
+
+ const handleUpdateStatus = debounce((id) => {
+ setDepositHistory((prevDepositHistory) =>
+ prevDepositHistory.map((depositHistory) =>
+ depositHistory.id === id
+ ? { ...depositHistory, status: !depositHistory.status }
+ : depositHistory
+ )
+ );
+ toast({
+ render: () => ,
+ });
+ }, 300);
+
+ const filteredData = data?.data?.rows
+ .filter((item) => {
+ // Filter by name (case insensitive)
+ const name = [item.firstName, item.lastName, item.countryName]
+ .filter(Boolean)
+ .join(" ");
+ const searchLower = searchTerm.toLowerCase();
+ const nameMatches = name.toLowerCase().includes(searchLower);
+
+ // Filter by status (Uncomment and use if needed)
+ // const status = item.status;
+ // const statusLower = status ? "active" : "inactive";
+
+ // const statusMatches =
+ // statusFilter === "all" ||
+ // (statusFilter === "active" && status === true) ||
+ // (statusFilter === "inactive" && status === false);
+
+ return nameMatches;
+ })
+ .sort((b, a) => new Date(a.createdAt) - new Date(b.createdAt));
+
+ // const handleView = (id) => {
+ // setActionId(id);
+ // onViewOpen();
+ // };
+
+ const extractedArray = data?.data?.rows?.map((item, idx) => ({
+ "Sr.no": (
+
+ {generateSerialNumber(idx, currentPage, pageSize)}
+
+ ),
+ "Client ID": (
+
+ {item?.clientReference_id}
+
+ ),
+ "First Name": (
+
+
+ {item?.firstName}
+
+
+ ),
+ "Last Name": (
+
+
+ {item?.lastName}
+
+
+ ),
+ Country: (
+
+
+ {item?.countryName}
+
+
+ ),
+ "Phone Number": (
+
+
+ {item?.mobileNumber}
+
+
+ ),
+ "Deposit Amount": (
+
+
+ {parseFloat(item?.investorAmount || 0).toLocaleString(undefined, {
+ minimumFractionDigits: 2,
+ maximumFractionDigits: 2,
+ })}
+
+ {item?.currencyCode}
+
+
+
+ ),
+ "Deposit Date": (
+
+ {formatDate(item?.createdAt)}
+
+ ),
+ Status: (
+
+
+ {item.transactionStatus}
+
+
+ ),
+ "Supporting's":
+ item.transactionStatus === "Approved" ? (
+
+ {/* {item?.supporting_FileName} */}
+
+
+
+ View
+
+
+
+ {/*
+ View
+ */}
+
+
+ ) : (
+ ""
+ ),
+ Action: (
+
+
+
+
+
+
+
+
+ ),
+ }));
+
+ const handleDelete = () => {
+ const IOtype = investmentType.filter(
+ (investmentType) => investmentType.id !== actionId
+ );
+
+ setTimeout(() => {
+ setInvestmentType(IOtype);
+ setDeleteAlert(false);
+ setIsLoading(false);
+ }, 100);
+ setIsLoading(true);
+ };
+
+ return (
+
+
+
+
+
+ setSearchTerm(e.target.value)}
+ />
+
+
+
+
+
+
+
+
+
+ setDeleteAlert(false)}
+ isOpen={deleteAlert}
+ message={"Are you sure you want to delete sponers?"}
+ alertHandler={handleDelete}
+ isLoading={isLoading}
+ />
+
+ );
+};
+
+export default BankDepositRequest;
diff --git a/src/Pages/BankDepositRequest/ConfirmModal.jsx b/src/Pages/BankDepositRequest/ConfirmModal.jsx
new file mode 100644
index 0000000..40bcbdd
--- /dev/null
+++ b/src/Pages/BankDepositRequest/ConfirmModal.jsx
@@ -0,0 +1,137 @@
+import {
+ Box,
+ Button,
+ Checkbox,
+ FormControl,
+ FormLabel,
+ Input,
+ Modal,
+ ModalBody,
+ ModalCloseButton,
+ ModalContent,
+ ModalFooter,
+ ModalHeader,
+ ModalOverlay,
+ Text,
+ Textarea,
+ useDisclosure,
+} from "@chakra-ui/react";
+import React, { useState } from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+
+export const conformModalSchema = yup.object().shape({
+ fees: yup.string().required("File name is required"),
+ totalAmount: yup.string().required("File name is required"),
+});
+
+const ConfirmModal = ({ isOpen, onClose, firstField }) => {
+
+ const [emailApproval,setEmailApproval] = useState(false)
+
+ const {
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+ resolver: yupResolver(conformModalSchema),
+ });
+
+ const onSubmit = (data) => {
+ setFile(data.document[0]);
+
+ const newDocument = {
+ ...data,
+ document: data.document[0].name, // Store the document name
+ status: true,
+ id: uuidv4(),
+ createdAt: new Date().toISOString(),
+ Type: getFileIcon(file.type),
+ };
+
+ setCreate((prevCreate) => [...prevCreate, newDocument]);
+ onClose();
+ };
+
+ const handleFileChange = (event) => {
+ const selectedFile = event.target.files[0];
+ setFile(selectedFile);
+ };
+
+ return (
+
+
+
+ Confirm
+
+
+
+
+ Comment
+
+ {errors.comment && (
+
+ {errors.comment.message}
+
+ )}
+
+
+ setEmailApproval(e.target.checked)}
+ >
+ Send an email to the user upon approval
+
+ {emailApproval &&
+
+ Subject
+
+
+
+ Message
+
+
+ }
+
+
+
+
+
+
+
+
+ );
+};
+
+export default ConfirmModal;
diff --git a/src/Pages/BankDepositRequest/RejectModal.jsx b/src/Pages/BankDepositRequest/RejectModal.jsx
new file mode 100644
index 0000000..df2b79f
--- /dev/null
+++ b/src/Pages/BankDepositRequest/RejectModal.jsx
@@ -0,0 +1,98 @@
+import {
+ Box,
+ Button,
+ FormControl,
+ FormLabel,
+ Input,
+ Modal,
+ ModalBody,
+ ModalCloseButton,
+ ModalContent,
+ ModalFooter,
+ ModalHeader,
+ ModalOverlay,
+ Text,
+ Textarea,
+ useDisclosure,
+} from "@chakra-ui/react";
+import React from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+
+export const conformModalSchema = yup.object().shape({
+ comment: yup.string().required("Comment is required"),
+});
+
+const RejectModal = ({ isOpen, onClose, firstField }) => {
+ const {
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+ resolver: yupResolver(conformModalSchema),
+ });
+
+ const onSubmit = (data) => {
+ setFile(data.document[0]);
+
+ const newDocument = {
+ ...data,
+ document: data.document[0].name, // Store the document name
+ comment: true,
+ id: uuidv4(),
+ Type: getFileIcon(file.type),
+ };
+
+ setCreate((prevCreate) => [...prevCreate, newDocument]);
+ onClose();
+ };
+
+ const handleFileChange = (event) => {
+ const selectedFile = event.target.files[0];
+ setFile(selectedFile);
+ };
+
+ return (
+
+
+
+ Reject
+
+
+
+
+ Comment
+
+ {errors.comment && (
+
+ {errors.comment.message}
+
+ )}
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default RejectModal;
diff --git a/src/Pages/Dashboard/InvestmentOpportunities.jsx b/src/Pages/Dashboard/InvestmentOpportunities.jsx
index f06e633..f2e823c 100644
--- a/src/Pages/Dashboard/InvestmentOpportunities.jsx
+++ b/src/Pages/Dashboard/InvestmentOpportunities.jsx
@@ -60,7 +60,7 @@ const InvestmentOpportunities = ({ showSearch = true, selectStyle = {} }) => {
),
"Amount Remaining %": (
-
+
{parseFloat(item?.Amount_remaining_per || 0).toLocaleString(
undefined,
diff --git a/src/Pages/ReversalAccountDeletion/ConfirmModal.jsx b/src/Pages/ReversalAccountDeletion/ConfirmModal.jsx
new file mode 100644
index 0000000..40bcbdd
--- /dev/null
+++ b/src/Pages/ReversalAccountDeletion/ConfirmModal.jsx
@@ -0,0 +1,137 @@
+import {
+ Box,
+ Button,
+ Checkbox,
+ FormControl,
+ FormLabel,
+ Input,
+ Modal,
+ ModalBody,
+ ModalCloseButton,
+ ModalContent,
+ ModalFooter,
+ ModalHeader,
+ ModalOverlay,
+ Text,
+ Textarea,
+ useDisclosure,
+} from "@chakra-ui/react";
+import React, { useState } from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+
+export const conformModalSchema = yup.object().shape({
+ fees: yup.string().required("File name is required"),
+ totalAmount: yup.string().required("File name is required"),
+});
+
+const ConfirmModal = ({ isOpen, onClose, firstField }) => {
+
+ const [emailApproval,setEmailApproval] = useState(false)
+
+ const {
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+ resolver: yupResolver(conformModalSchema),
+ });
+
+ const onSubmit = (data) => {
+ setFile(data.document[0]);
+
+ const newDocument = {
+ ...data,
+ document: data.document[0].name, // Store the document name
+ status: true,
+ id: uuidv4(),
+ createdAt: new Date().toISOString(),
+ Type: getFileIcon(file.type),
+ };
+
+ setCreate((prevCreate) => [...prevCreate, newDocument]);
+ onClose();
+ };
+
+ const handleFileChange = (event) => {
+ const selectedFile = event.target.files[0];
+ setFile(selectedFile);
+ };
+
+ return (
+
+
+
+ Confirm
+
+
+
+
+ Comment
+
+ {errors.comment && (
+
+ {errors.comment.message}
+
+ )}
+
+
+ setEmailApproval(e.target.checked)}
+ >
+ Send an email to the user upon approval
+
+ {emailApproval &&
+
+ Subject
+
+
+
+ Message
+
+
+ }
+
+
+
+
+
+
+
+
+ );
+};
+
+export default ConfirmModal;
diff --git a/src/Pages/ReversalAccountDeletion/RejectModal.jsx b/src/Pages/ReversalAccountDeletion/RejectModal.jsx
new file mode 100644
index 0000000..df2b79f
--- /dev/null
+++ b/src/Pages/ReversalAccountDeletion/RejectModal.jsx
@@ -0,0 +1,98 @@
+import {
+ Box,
+ Button,
+ FormControl,
+ FormLabel,
+ Input,
+ Modal,
+ ModalBody,
+ ModalCloseButton,
+ ModalContent,
+ ModalFooter,
+ ModalHeader,
+ ModalOverlay,
+ Text,
+ Textarea,
+ useDisclosure,
+} from "@chakra-ui/react";
+import React from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+
+export const conformModalSchema = yup.object().shape({
+ comment: yup.string().required("Comment is required"),
+});
+
+const RejectModal = ({ isOpen, onClose, firstField }) => {
+ const {
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+ resolver: yupResolver(conformModalSchema),
+ });
+
+ const onSubmit = (data) => {
+ setFile(data.document[0]);
+
+ const newDocument = {
+ ...data,
+ document: data.document[0].name, // Store the document name
+ comment: true,
+ id: uuidv4(),
+ Type: getFileIcon(file.type),
+ };
+
+ setCreate((prevCreate) => [...prevCreate, newDocument]);
+ onClose();
+ };
+
+ const handleFileChange = (event) => {
+ const selectedFile = event.target.files[0];
+ setFile(selectedFile);
+ };
+
+ return (
+
+
+
+ Reject
+
+
+
+
+ Comment
+
+ {errors.comment && (
+
+ {errors.comment.message}
+
+ )}
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default RejectModal;
diff --git a/src/Pages/ReversalAccountDeletion/ReversalAccountDeletion.jsx b/src/Pages/ReversalAccountDeletion/ReversalAccountDeletion.jsx
new file mode 100644
index 0000000..1feef60
--- /dev/null
+++ b/src/Pages/ReversalAccountDeletion/ReversalAccountDeletion.jsx
@@ -0,0 +1,322 @@
+import {
+ Avatar,
+ Badge,
+ Box,
+ Button,
+ 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 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 { useGetDeleteHistoryQuery } from "../../Services/delete.request.service";
+ import { TABLE_PAGINATION } from "../../Constants/Paginations";
+import ConfirmModal from "./ConfirmModal";
+import RejectModal from "./RejectModal";
+ // import { formatDate } from "../../Components/Functions/UTCConvertor";
+
+ const ReversalAccountDeletion = () => {
+ const toast = useToast();
+ const { slideFromRight, setDeleteHistory } =
+ useContext(GlobalStateContext);
+ const [deleteAlert, setDeleteAlert] = useState(false);
+ const [actionId, setActionId] = useState(false);
+ const [mouseEntered, setMouseEntered] = useState(false);
+ const [mouseEnteredId, setMouseEnteredId] = useState("");
+
+
+
+ // =========================== [Use State] =============================
+ const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size);
+ const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page);
+ const [searchTerm, setSearchTerm] = useState("");
+ const [debouncedSearchTerm, setDebouncedSearchTerm] = useState("");
+
+ const {
+ isOpen: isConfirmOpen,
+ onOpen: onConfirmOpen,
+ onClose: onConfirmClose,
+ } = useDisclosure();
+ const {
+ isOpen: isRejectOpen,
+ onOpen: onRejectOpen,
+ 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: deleteHistory,
+ isLoading,
+ refetch
+ } = useGetDeleteHistoryQuery({
+ page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
+ size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search
+ search: debouncedSearchTerm,
+ },
+ {
+ skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
+ })
+
+ const formatDate = (date) => {
+ return new Date(date).toLocaleDateString('en-GB', {
+ day: '2-digit',
+ month: '2-digit',
+ year: 'numeric',
+ });
+ };
+
+ // Use useEffect to refetch data when the component mounts
+ useEffect(() => {
+ refetch();
+ }, [refetch]);
+
+
+ // ====================================================[Table Setup]================================================================
+ const tableHeadRow = [
+ "Sr No.",
+ "Request On",
+ "Client ID",
+ "First Name",
+ "Last Name",
+ "Country",
+ "Phone Number",
+ "Action"
+ ];
+
+ const extractedArray = deleteHistory?.data?.rows?.map((item, index) => ({
+ id: item?.id,
+ "Sr No.": (
+
+ {index + 1}.
+
+ ),
+ "Request On": (
+
+ {formatDate(item.Requested_on)}
+
+ ),
+ "Client ID": (
+
+ {item.clientId}
+
+ ),
+ "First Name": (
+
+ {item.firstName}
+ {/* {formatDate(item.charge)} */}
+
+ ),
+ "Last Name": (
+
+ {item.lastName}
+
+ ),
+ "Country": (
+
+ {item.country}
+
+ ),
+ "Phone Number": (
+
+ {item.phoneNumber}
+
+ ),
+ "Action": (
+
+
+
+
+
+
+
+
+ ),
+ }));
+
+ const handleDelete = () => {
+ const deleteHistory = sponser.filter(
+ (sponsor) => sponsor.id !== actionId
+ );
+
+ setTimeout(() => {
+ setSponser(deleteHistory);
+ setDeleteAlert(false);
+ setIsLoading(false);
+ }, 100);
+ setIsLoading(true);
+ };
+
+ return (
+
+
+
+ setSearchTerm(e.target.value)}
+ />
+
+ {/*
+
+ */}
+
+
+
+
+
+ setDeleteAlert(false)}
+ isOpen={deleteAlert}
+ message={"Are you sure you want to delete sponers?"}
+ alertHandler={handleDelete}
+ isLoading={isLoading}
+ />
+
+
+
+ );
+ };
+
+ export default ReversalAccountDeletion;
+
\ No newline at end of file
diff --git a/src/Pages/ReversalFawateerDeposit/ConfirmModal.jsx b/src/Pages/ReversalFawateerDeposit/ConfirmModal.jsx
new file mode 100644
index 0000000..40bcbdd
--- /dev/null
+++ b/src/Pages/ReversalFawateerDeposit/ConfirmModal.jsx
@@ -0,0 +1,137 @@
+import {
+ Box,
+ Button,
+ Checkbox,
+ FormControl,
+ FormLabel,
+ Input,
+ Modal,
+ ModalBody,
+ ModalCloseButton,
+ ModalContent,
+ ModalFooter,
+ ModalHeader,
+ ModalOverlay,
+ Text,
+ Textarea,
+ useDisclosure,
+} from "@chakra-ui/react";
+import React, { useState } from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+
+export const conformModalSchema = yup.object().shape({
+ fees: yup.string().required("File name is required"),
+ totalAmount: yup.string().required("File name is required"),
+});
+
+const ConfirmModal = ({ isOpen, onClose, firstField }) => {
+
+ const [emailApproval,setEmailApproval] = useState(false)
+
+ const {
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+ resolver: yupResolver(conformModalSchema),
+ });
+
+ const onSubmit = (data) => {
+ setFile(data.document[0]);
+
+ const newDocument = {
+ ...data,
+ document: data.document[0].name, // Store the document name
+ status: true,
+ id: uuidv4(),
+ createdAt: new Date().toISOString(),
+ Type: getFileIcon(file.type),
+ };
+
+ setCreate((prevCreate) => [...prevCreate, newDocument]);
+ onClose();
+ };
+
+ const handleFileChange = (event) => {
+ const selectedFile = event.target.files[0];
+ setFile(selectedFile);
+ };
+
+ return (
+
+
+
+ Confirm
+
+
+
+
+ Comment
+
+ {errors.comment && (
+
+ {errors.comment.message}
+
+ )}
+
+
+ setEmailApproval(e.target.checked)}
+ >
+ Send an email to the user upon approval
+
+ {emailApproval &&
+
+ Subject
+
+
+
+ Message
+
+
+ }
+
+
+
+
+
+
+
+
+ );
+};
+
+export default ConfirmModal;
diff --git a/src/Pages/ReversalFawateerDeposit/RejectModal.jsx b/src/Pages/ReversalFawateerDeposit/RejectModal.jsx
new file mode 100644
index 0000000..df2b79f
--- /dev/null
+++ b/src/Pages/ReversalFawateerDeposit/RejectModal.jsx
@@ -0,0 +1,98 @@
+import {
+ Box,
+ Button,
+ FormControl,
+ FormLabel,
+ Input,
+ Modal,
+ ModalBody,
+ ModalCloseButton,
+ ModalContent,
+ ModalFooter,
+ ModalHeader,
+ ModalOverlay,
+ Text,
+ Textarea,
+ useDisclosure,
+} from "@chakra-ui/react";
+import React from "react";
+import * as yup from "yup";
+import { yupResolver } from "@hookform/resolvers/yup";
+import { useForm } from "react-hook-form";
+
+export const conformModalSchema = yup.object().shape({
+ comment: yup.string().required("Comment is required"),
+});
+
+const RejectModal = ({ isOpen, onClose, firstField }) => {
+ const {
+ register,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+ resolver: yupResolver(conformModalSchema),
+ });
+
+ const onSubmit = (data) => {
+ setFile(data.document[0]);
+
+ const newDocument = {
+ ...data,
+ document: data.document[0].name, // Store the document name
+ comment: true,
+ id: uuidv4(),
+ Type: getFileIcon(file.type),
+ };
+
+ setCreate((prevCreate) => [...prevCreate, newDocument]);
+ onClose();
+ };
+
+ const handleFileChange = (event) => {
+ const selectedFile = event.target.files[0];
+ setFile(selectedFile);
+ };
+
+ return (
+
+
+
+ Reject
+
+
+
+
+ Comment
+
+ {errors.comment && (
+
+ {errors.comment.message}
+
+ )}
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default RejectModal;
diff --git a/src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx b/src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx
new file mode 100644
index 0000000..7d7b244
--- /dev/null
+++ b/src/Pages/ReversalFawateerDeposit/ReversalFawateerDeposit.jsx
@@ -0,0 +1,390 @@
+import {
+ Avatar,
+ Badge,
+ Box,
+ Button,
+ HStack,
+ Input,
+ Link,
+ Text,
+ Tooltip,
+ useDisclosure,
+ useToast,
+ } from "@chakra-ui/react";
+ import React, { useContext, useEffect, useState } from "react";
+ import { CheckIcon, CloseIcon, ExternalLinkIcon } from "@chakra-ui/icons";
+import Pagination from "../../Components/Pagination";
+import GlobalStateContext from "../../Contexts/GlobalStateContext";
+import CustomAlertDialog from "../../Components/CustomAlertDialog";
+import DrawalRequestReject from "../WithDrawal/DrawalRequest/DrawalRequestReject";
+import NormalTable from "../../Components/DataTable/NormalTable";
+import DrawalRequestApprove from "../WithDrawal/DrawalRequest/DrawalRequestApprove";
+import { generateSerialNumber } from "../../Constants/Constants";
+import { TABLE_PAGINATION } from "../../Constants/Paginations";
+import { OPACITY_ON_LOAD } from "../../Layout/animations";
+import { useGetFawateerForMakerRequestQuery } from "../../Services/fawateer.request.service";
+import ConfirmModal from "./ConfirmModal";
+import RejectModal from "./RejectModal";
+
+ const ReversalFawateerDeposit = () => {
+ const toast = useToast();
+ const { slideFromRight, approveHistory, setApproveHistory } =
+ useContext(GlobalStateContext);
+ const [searchTerm, setSearchTerm] = useState("");
+ const [isLoading, setIsLoading] = useState(true);
+ const [deleteAlert, setDeleteAlert] = useState(false);
+ 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);
+
+ const formatDate = (date) => {
+ return new Date(date).toLocaleDateString("en-GB", {
+ day: "2-digit",
+ month: "2-digit",
+ year: "numeric",
+ });
+ };
+
+ const {
+ isOpen: isConfirmOpen,
+ onOpen: onConfirmOpen,
+ onClose: onConfirmClose,
+ } = useDisclosure();
+ const {
+ isOpen: isRejectOpen,
+ onOpen: onRejectOpen,
+ onClose: onRejectClose,
+ } = useDisclosure();
+
+ const {
+ data,
+ isLoading: drawalRequestLoading,
+ error,
+ refetch
+ } = useGetFawateerForMakerRequestQuery(
+ {
+ 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);
+
+ useEffect(() => {
+ const handler = setTimeout(() => {
+ setDebouncedSearchTerm(searchTerm);
+ }, 500); // Adjust delay as needed
+ return () => {
+ clearTimeout(handler);
+ };
+ }, [searchTerm]);
+
+ // Use useEffect to refetch data when the component mounts
+ useEffect(() => {
+ refetch();
+ }, [refetch]);
+
+ useEffect(() => {
+ // Simulate loading
+ const timer = setTimeout(() => {
+ setIsLoading(false);
+ }, 1500);
+
+ // Cleanup the timer on component unmount
+ return () => clearTimeout(timer);
+ }, []);
+
+ // ====================================================[Table Filter]================================================================
+ const filteredData = data?.data?.rows?.filter((item) => {
+ // Filter by name (case insensitive)
+ const name = item.firstName;
+ const searchLower = searchTerm.toLowerCase();
+ const nameMatches = name.toLowerCase().includes(searchLower);
+
+ // Filter by status
+ // const status = item.status;
+ // const statusLower = status ? "active" : "inactive";
+
+ // const statusMatches =
+ // statusFilter === "all" ||
+ // (statusFilter === "active" && status === true) ||
+ // (statusFilter === "inactive" && status === false);
+
+ return nameMatches;
+ });
+
+ // ====================================================[Table Setup]================================================================
+ const tableHeadRow = [
+ "Sr.no",
+ "Client ID",
+ "First Name",
+ "Last Name",
+ "E-mail ID",
+ "Phone Number",
+ "Deposit Date",
+ "Deposit Amount (BHD)",
+ "Support Image",
+ "Action",
+ ];
+
+ const extractedArray = data?.data?.rows?.map((item, idx) => ({
+
+ // id: item?.id,
+ "Sr.no": (
+
+ {generateSerialNumber(idx, currentPage, pageSize)}
+
+ ),
+ "Client ID": (
+
+ {item.clientReference_id}
+
+ ),
+ "First Name": (
+
+
+ {item.firstName}
+
+
+ ),
+ "Last Name": (
+
+
+ {item.lastName}
+
+
+ ),
+ "E-mail ID": (
+
+
+ {item.emailAddress}
+
+
+ ),
+ "Phone Number": (
+
+
+ {item.mobileNumber}
+
+
+ ),
+ "Deposit Date": (
+
+
+ {formatDate(item?.transaction_date)}
+
+
+ ),
+ "Deposit Amount (BHD)": (
+
+
+ {/* {item.investorAmount} */}
+ {parseFloat(item?.transaction_amount || 0).toLocaleString(undefined, {
+ minimumFractionDigits: 2,
+ maximumFractionDigits: 2,
+ })}
+ {/* {item?.transaction_amount} */}
+
+
+ ),
+ "Support Image": (
+
+ {item?.spportFile_path&&
+
+
+ View
+
+
+
+ }
+
+ ),
+ Action: (
+
+
+
+
+
+
+
+
+ ),
+ }));
+
+ const handleDelete = () => {
+ const updatedSponsors = sponser.filter(
+ (sponsor) => sponsor.id !== actionId
+ );
+
+ setTimeout(() => {
+ setSponser(updatedSponsors);
+ setDeleteAlert(false);
+ setIsLoading(false);
+ }, 100);
+ setIsLoading(true);
+ };
+
+ return (
+
+
+
+ setSearchTerm(e.target.value)}
+ />
+
+
+
+
+
+
+
+ setDeleteAlert(false)}
+ isOpen={deleteAlert}
+ message={"Are you sure you want to delete sponers?"}
+ alertHandler={handleDelete}
+ isLoading={isLoading}
+ />
+
+
+
+ );
+ };
+
+ export default ReversalFawateerDeposit;
+
\ No newline at end of file
diff --git a/src/Routes/Nav.js b/src/Routes/Nav.js
index b7b5f1a..48ae034 100644
--- a/src/Routes/Nav.js
+++ b/src/Routes/Nav.js
@@ -189,6 +189,34 @@ export const nav = [
type: "accordion",
Icon: AiOutlineUserDelete,
},
+
+
+
+ {
+ title: "REVERSAL TRANSACTION",
+ type: "title",
+ },
+ {
+ title: "Bank Deposit Request",
+ type: "single",
+ path: "/bank-deposit-request",
+ Icon: RiBankLine,
+ },
+ {
+ title: "Fawateer Deposit",
+ type: "single",
+ path: "/fawateer-deposit",
+ Icon: TbLayoutDashboard,
+ },
+ {
+ title: "Account Deletion Request",
+ type: "single",
+ path: "/account-deletion-request",
+ Icon: TbLayoutDashboard,
+ },
+
+
+
{
title: "MANAGE ADMIN",
type: "title",
diff --git a/src/Routes/Routes.js b/src/Routes/Routes.js
index a366cf6..56cfaae 100644
--- a/src/Routes/Routes.js
+++ b/src/Routes/Routes.js
@@ -49,6 +49,9 @@ import Profile from "../Pages/Profile/Profile";
import SubAdmin from "../Pages/SubAdmin/SubAdmin";
import SubAdminUpdateCreate from "../Pages/SubAdmin/SubAdminUpdateCreate";
import InvestmentOpportunities from "../Pages/Dashboard/InvestmentOpportunities";
+import BankDepositRequest from "../Pages/BankDepositRequest/BankDepositRequest";
+import ReversalFawateerDeposit from "../Pages/ReversalFawateerDeposit/ReversalFawateerDeposit";
+import ReversalAccountDeletion from "../Pages/ReversalAccountDeletion/ReversalAccountDeletion";
export const RouteLink = [
// =============[ Tanami ]================
@@ -130,7 +133,12 @@ export const RouteLink = [
{ path: "/subadmin", Component: SubAdmin },
{ path: "/subadmin/subadmin-update/:id", Component: SubAdminUpdateCreate },
{ path: "/subadmin/subadmin-update", Component: SubAdminUpdateCreate },
+
+ // ===============[ REVERSAL TRANSACTION ]===============
+ { path: "/bank-deposit-request", Component: BankDepositRequest },
+ { path: "/fawateer-deposit", Component: ReversalFawateerDeposit },
+ { path: "/account-deletion-request", Component: ReversalAccountDeletion },
// ===============[ fawateer ]===============