Merge pull request 'bug-fix/9.0.3' (#30) from bug-fix/9.0.3 into main

Reviewed-on: #30

src/Components/Pagination.jsx

@@ -49,7 +49,7 @@ const Pagination = ({
           value={pageSize}
           onChange={handlePageSizeChange}
         >
-          {[15, 20, 30, 500]?.map((size) => (
+          {[15, 20, 30]?.map((size) => (
             <option key={size} value={size}>
               {size}
             </option>

src/Constants/Paginations.js

@@ -1,3 +1,2 @@
 export const TABLE_PAGINATION = { page: 1, size: 20 }
-export const IMAGE_URI = import.meta.env.VITE_API_IMAGE_URL
-export const INVESTOR_TABLE_PAGINATION = { page: 1, size: 500 }
+export const IMAGE_URI = import.meta.env.VITE_API_IMAGE_URL

src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx

@@ -1,5 +1,5 @@
-import { ViewIcon } from "@chakra-ui/icons";
 import {
+  Avatar,
   Badge,
   Box,
   Button,
@@ -11,21 +11,23 @@ import {
   useDisclosure,
   useToast,
 } from "@chakra-ui/react";
-import React, { useContext, useEffect, useRef, useState } from "react";
-import { LuFileSpreadsheet } from "react-icons/lu";
-import { useNavigate } from "react-router-dom";
-import CustomAlertDialog from "../../../Components/CustomAlertDialog";
-import NormalTable from "../../../Components/DataTable/NormalTable";
-import Pagination from "../../../Components/Pagination";
-import {
-  exportToExcelNew,
-  generateSerialNumber,
-} from "../../../Constants/Constants";
-import { INVESTOR_TABLE_PAGINATION } from "../../../Constants/Paginations";
-import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+import React, { useContext, useEffect, useState, useRef } from "react";
 import { OPACITY_ON_LOAD } from "../../../Layout/animations";
-import { useGetInvestorsQuery } from "../../../Services/investor.details.service";
+import NormalTable from "../../../Components/DataTable/NormalTable";
+import { Link, Link as RouterLink, useNavigate } from "react-router-dom";
+import {
+  ViewIcon,
+} from "@chakra-ui/icons";
+import Pagination from "../../../Components/Pagination";
+import GlobalStateContext from "../../../Contexts/GlobalStateContext";
+import CustomAlertDialog from "../../../Components/CustomAlertDialog";
+import ToastBox from "../../../Components/ToastBox";
+import { debounce } from "../../Master/Sponser/AddSponser";
 import InvestmentDetailsEdit from "./InvestmentDetailsEdit";
+import { useGetInvestorsQuery } from "../../../Services/investor.details.service";
+import { TABLE_PAGINATION } from "../../../Constants/Paginations";
+import { exportToExcel, exportToExcelNew, generateSerialNumber } from "../../../Constants/Constants";
+import { LuFileSpreadsheet } from "react-icons/lu";
 
 const formatDate = (date) => new Date(date).toLocaleDateString(); // Simple date formatter
 
@@ -47,11 +49,10 @@ const InvestorDetails = () => {
   } = useDisclosure();
   const btnRef = React.useRef();
 
-  // =========================== [Use State] =============================
-  const [pageSize, setPageSize] = useState(INVESTOR_TABLE_PAGINATION?.size);
-  const [currentPage, setCurrentPage] = useState(
-    INVESTOR_TABLE_PAGINATION?.page
-  );
+
+  // =========================== [Use State] ============================= 
+  const [pageSize, setPageSize] = useState(TABLE_PAGINATION?.size);
+  const [currentPage, setCurrentPage] = useState(TABLE_PAGINATION?.page);
   const [searchTerm, setSearchTerm] = useState("");
   const [debouncedSearchTerm, setDebouncedSearchTerm] = useState("");
 
@@ -72,19 +73,20 @@ const InvestorDetails = () => {
     data: investorDetails,
     isLoading: investorDetailsLoading,
     error,
-  } = useGetInvestorsQuery(
-    {
-      page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
-      size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search userStatus KYCStatus investorType_xid
-      search: debouncedSearchTerm,
-      userStatus: status,
-      KYCStatus: kyc,
-      country_xid: country,
-    },
-    {
-      skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
-    }
-  );
+  } = useGetInvestorsQuery({
+    page: debouncedSearchTerm ? undefined : currentPage,  // Omit pagination for search
+    size: debouncedSearchTerm ? undefined : pageSize,     // Omit pagination for search userStatus KYCStatus investorType_xid 
+    search: debouncedSearchTerm,
+    userStatus: status,
+    KYCStatus: kyc,
+    country_xid: country
+
+  },
+  {
+    skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
+  }
+);
+
 
   useEffect(() => {
     // Simulate loading
@@ -102,41 +104,43 @@ const InvestorDetails = () => {
     "Client ID",
     "First Name",
     "Last Name",
-    "Country",
+    "Country", 
     "Phone Number",
     "E-mail ID",
-    "Type",
+    "Type", 
     "KYC Status",
     "Status",
     "Action",
   ];
 
+
   // ====================================================[Table Filter]================================================================
   const exportInvestor = investorDetails?.data?.rows?.map((item, idx) => ({
-    Id: parseInt(item?.id, 10) || item?.id, // Convert to integer, fallback to string if conversion fails
+    "Id": parseInt(item?.id, 10) || item?.id, // Convert to integer, fallback to string if conversion fails
     "Client ID": item?.clientReference_id, // This is likely a string
     "First Name": item?.principal?.firstName,
     "Last Name": item?.principal?.lastName,
-    Country: item?.country?.countryName,
+    "Country": item?.country?.countryName,
     "Phone Number": item?.principal?.mobileNumber, // Skipping integer conversion, as this is likely a string
     "E-mail ID": item?.principal?.emailAddress,
-    Type: item?.investor_type?.investorTypeName,
-    Status: item.ioStatus ? "Ban" : "Unban",
-    "KYC Status": item.KYCStatus ? "Completed" : "Not complete",
+    "Type": item?.investor_type?.investorTypeName,
+    "Status": item.ioStatus ? "Ban" : "Unban",
+    "KYC Status": item.KYCStatus ? "Completed" : "Not complete"
   }));
 
   const extractedArray = investorDetails?.data?.rows?.map((item, idx) => ({
     id: item?.id,
     "Sr No": (
       <Text
-        w={"24px"}
+      w={'24px'}
         justifyContent={slideFromRight ? "right" : "left"}
         as={"span"}
         color={"gray.600"}
         className="d-flex align-items-center fw-bold web-text-small"
       >
         {/* {item.id} */}
-        {generateSerialNumber(idx, currentPage, pageSize)}
+        {generateSerialNumber(idx,currentPage, pageSize )}
+        
       </Text>
     ),
     "Client ID": (
@@ -144,7 +148,7 @@ const InvestorDetails = () => {
         <Text as={"span"} color={"teal.900"}>
           {item.clientReference_id}
         </Text>
-      </Box>
+      </Box> 
     ),
     "First Name": (
       <Box w={"auto"} isTruncated={true}>
@@ -181,44 +185,39 @@ const InvestorDetails = () => {
         </Text>
       </Box>
     ),
-    Type: (
+    "Type": (
       <Box w={"auto"} isTruncated={true}>
-        <Text as={"span"}>
-          <Badge
-            color={"forestGreen.500"}
-            variant={"ghost"}
-            fontWeight={"700"}
-            px={2}
-            py={0.5}
-          >
+        <Text as={"span"} >
+          <Badge color={"forestGreen.500"}    variant={'ghost'} fontWeight={"700"} px={2} py={0.5}>
             {item?.investor_type?.investorTypeName}
           </Badge>
         </Text>
       </Box>
     ),
     Status: (
-      <Box w={"auto"} isTruncated={true}>
-        <Badge
-          fontWeight={"700"}
-          textTransform={"none"}
-          colorScheme={item.ioStatus ? "red" : "green"}
-          px={2}
-          py={0.5}
-        >
-          {item.ioStatus ? "Ban" : "Unban"}
-        </Badge>
-      </Box>
+    <Box w={"auto"} isTruncated={true}>
+      <Badge
+        fontWeight={"700"}
+        textTransform={"none"}
+        colorScheme={item.ioStatus ? "red" : "green"}
+        px={2}
+        py={0.5}
+      >
+        {item.ioStatus ? "Ban" : "Unban"}
+      </Badge>
+    </Box>
     ),
     "KYC Status": (
-      <Box w={"auto"} display={"flex"} alignItems={"center"} isTruncated={true}>
+      <Box w={"auto"} display={'flex'} alignItems={'center'} isTruncated={true}>
         <Text
-          as={"span"}
+        as={'span'}
           fontWeight={"700"}
           textTransform={"none"}
           color={item?.KYCStatus === true ? "green" : "yellow.500"}
           px={2}
           py={0.5}
-          variant={"solid"}
+          variant={'solid'}
+
         >
           {/* {item.KYCStatus ? "Completed" : "Not complete"} */}
           {item?.KYCStatus === true ? "Completed" : "NotCompleted"}
@@ -236,7 +235,7 @@ const InvestorDetails = () => {
           placement="top"
         >
           <Button
-            isDisabled={item.ioStatus}
+          isDisabled={item.ioStatus}
             onClick={() => {
               navigate(`/investor-details/profile-view/${item.id}`);
             }}
@@ -267,6 +266,7 @@ const InvestorDetails = () => {
     setIsLoading(true);
   };
 
+
   return (
     <Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={38}>
       <Box bg="white.500">
@@ -346,29 +346,35 @@ const InvestorDetails = () => {
             </Select>
 
             <Pagination
-              isLoading={investorDetailsLoading}
+              isLoading={investorDetailsLoading} 
               pageSize={pageSize}
               setPageSize={setPageSize}
               currentPage={currentPage}
               setCurrentPage={setCurrentPage}
               totalItems={investorDetails?.data?.totalItems}
+              
             />
+
           </HStack>
 
+
           <Button
-            onClick={() => exportToExcelNew(exportInvestor, "Investor Details")}
-            leftIcon={<LuFileSpreadsheet />}
-            colorScheme="forestGreen"
-            size={"sm"}
-            variant={"outline"}
-            rounded={"sm"}
-            fontSize={"xs"}
-            w={100}
-            me={2}
-            isDisabled={exportInvestor?.length === 0}
-          >
-            Export xls
-          </Button>
+              onClick={() =>
+                exportToExcelNew(exportInvestor, "Investor Details")
+              }
+              leftIcon={<LuFileSpreadsheet />}
+              colorScheme="forestGreen"
+              size={"sm"}
+              variant={"outline"}
+              rounded={"sm"}
+              fontSize={"xs"}
+              w={100}
+              me={2}
+
+              isDisabled={exportInvestor?.length === 0}
+            >
+              Export xls
+            </Button>
         </HStack>
         <InvestmentDetailsEdit
           id={actionId}