diff --git a/src/Components/Popups/InitiateReversalPopups.jsx b/src/Components/Popups/InitiateReversalPopups.jsx
new file mode 100644
index 0000000..57f2293
--- /dev/null
+++ b/src/Components/Popups/InitiateReversalPopups.jsx
@@ -0,0 +1,118 @@
+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 InitiateReversalPopup = ({ isOpen, onClose, handelApproved }) => {
+ const {
+ watch,
+ register,
+ reset,
+ handleSubmit,
+ formState: { errors },
+ } = useForm({
+ resolver: yupResolver(conformModalSchema),
+ mode: "all",
+ });
+
+ return (
+
+
+
+ Reversal Reason
+
+ {
+ handelApproved(data);
+ reset();
+ })}
+ >
+
+
+ Comment
+
+
+ {errors.comments ? (
+
+ {errors.comments.message}
+
+ ) : (
+
+ Maximum length should be 150 characters. You have entered{" "}
+ {watch()?.comments?.length || 0} characters.
+
+ )}
+
+
+
+
+
+
+
+
+
+ );
+};
+
+InitiateReversalPopup.propTypes = {
+ isOpen: PropTypes.bool.isRequired,
+ onClose: PropTypes.func.isRequired,
+ handelApproved: PropTypes.func.isRequired,
+};
+
+export default InitiateReversalPopup;
diff --git a/src/Pages/Deposit/DepositViewHistory/DepositHistory.jsx b/src/Pages/Deposit/DepositViewHistory/DepositHistory.jsx
index 787fddf..aacde5d 100644
--- a/src/Pages/Deposit/DepositViewHistory/DepositHistory.jsx
+++ b/src/Pages/Deposit/DepositViewHistory/DepositHistory.jsx
@@ -4,39 +4,32 @@ import {
Button,
HStack,
Input,
- Switch,
- Text,
- Tooltip,
- useToast,
- useDisclosure,
Link,
+ Text,
+ useDisclosure,
+ useToast,
} from "@chakra-ui/react";
import React, { useContext, useEffect, useState } from "react";
-import { HiDotsVertical } from "react-icons/hi";
import { useNavigate } from "react-router-dom";
-import { debounce } from "../../Master/Sponser/AddSponser";
-import { OPACITY_ON_LOAD } from "../../../Layout/animations";
-import Pagination from "../../../Components/Pagination";
-import GlobalStateContext from "../../../Contexts/GlobalStateContext";
import CustomAlertDialog from "../../../Components/CustomAlertDialog";
-import ToastBox from "../../../Components/ToastBox";
import NormalTable from "../../../Components/DataTable/NormalTable";
-import ConfirmModal from "./ConfirmModal";
-import RejectModal from "./RejectModal";
-import {
- useDepositRejectMutation,
- useGetDepositHistoryQuery,
-} from "../../../Services/deposit.request.service";
+import Pagination from "../../../Components/Pagination";
+import ToastBox from "../../../Components/ToastBox";
+import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+import { OPACITY_ON_LOAD } from "../../../Layout/animations";
+import { useGetDepositHistoryQuery } from "../../../Services/deposit.request.service";
+import { debounce } from "../../Master/Sponser/AddSponser";
import { ExternalLinkIcon } from "@chakra-ui/icons";
-import { TABLE_PAGINATION } from "../../../Constants/Paginations";
+import InitiateReversalPopup from "../../../Components/Popups/InitiateReversalPopups";
import { generateSerialNumber } from "../../../Constants/Constants";
+import { TABLE_PAGINATION } from "../../../Constants/Paginations";
const formatDate = (date) => {
- return new Date(date).toLocaleDateString('en-GB', {
- day: '2-digit',
- month: '2-digit',
- year: 'numeric',
+ return new Date(date).toLocaleDateString("en-GB", {
+ day: "2-digit",
+ month: "2-digit",
+ year: "numeric",
});
}; // Simple date formatter
@@ -50,22 +43,18 @@ const DepositHistory = () => {
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] =============================
+ // =========================== [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 [reversalId, setReversalId] = useState();
+ const {
+ isOpen: isOpenInRev,
+ onOpen: onOpenInRev,
+ onClose: onCloseInRev,
+ } = useDisclosure();
// Debounce the search term to avoid making a request on every keystroke
useEffect(() => {
@@ -77,20 +66,21 @@ const DepositHistory = () => {
};
}, [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
- });
+ } = 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(() => {
@@ -109,6 +99,7 @@ const DepositHistory = () => {
"Deposit Date",
"Status",
"Supporting's",
+ "Reversal Action",
];
const handleUpdateStatus = debounce((id) => {
@@ -161,7 +152,7 @@ const DepositHistory = () => {
fontWeight={"500"}
className="d-flex align-items-center web-text-small"
>
- {generateSerialNumber(idx,currentPage, pageSize )}
+ {generateSerialNumber(idx, currentPage, pageSize)}
),
"Client ID": (
@@ -205,11 +196,7 @@ const DepositHistory = () => {
),
"Deposit Amount": (
-
+
{parseFloat(item?.investorAmount || 0).toLocaleString(undefined, {
minimumFractionDigits: 2,
@@ -283,6 +270,35 @@ const DepositHistory = () => {
) : (
""
),
+ "Reversal Action": (
+
+ {item.transactionStatus === "Approved" ? (
+
+ {!item.isReversal ? (
+
+ ) : (
+ "Under process"
+ )}
+
+ ) : (
+ ""
+ )}
+
+ ),
}));
const handleDelete = () => {
@@ -298,16 +314,13 @@ const DepositHistory = () => {
setIsLoading(true);
};
+ const handelApproved = async (data) => {
+ console.log(data, reversalId);
+ onCloseInRev();
+ };
+
return (
- {/*
- */}
{
alertHandler={handleDelete}
isLoading={isLoading}
/>
+
+
);
};