From c51ae9081f15a2242feb8278e6bd694a4e1ae4bb Mon Sep 17 00:00:00 2001
From: "Siddhesh.More" <siddhesh.more@wdimails.com>
Date: Thu, 3 Oct 2024 13:48:09 +0530
Subject: [PATCH] 0.7

---
 src/Components/DataTable/NormalTable.jsx      |  2 +-
 .../IO_Management/CreateIO/Investors.jsx      | 45 +++++++++++++++++--
 .../InvestorDetails/InvestorDetails.jsx       | 21 ++++-----
 src/Services/investor.details.service.js      |  4 +-
 4 files changed, 56 insertions(+), 16 deletions(-)

diff --git a/src/Components/DataTable/NormalTable.jsx b/src/Components/DataTable/NormalTable.jsx
index d1dd2c1..aafab00 100644
--- a/src/Components/DataTable/NormalTable.jsx
+++ b/src/Components/DataTable/NormalTable.jsx
@@ -75,7 +75,7 @@ const NormalTable = ({
                   textTransform={"none"}
                 >
                   <Checkbox
-                    isChecked={selectedRadio.length === data.length}
+                    isChecked={selectedRadio?.length === data?.length}
                     onChange={handleCheckAllChange}
                     colorScheme="forestGreen"
 
diff --git a/src/Pages/IO_Management/CreateIO/Investors.jsx b/src/Pages/IO_Management/CreateIO/Investors.jsx
index b27bc7b..91e2e61 100644
--- a/src/Pages/IO_Management/CreateIO/Investors.jsx
+++ b/src/Pages/IO_Management/CreateIO/Investors.jsx
@@ -38,6 +38,8 @@ import { formatCurrency } from "../../../Components/CurrencyInput";
 import { FiRefreshCw } from "react-icons/fi";
 import { useGetIOByIdQuery } from "../../../Services/io.service";
 import { RepeatIcon } from "@chakra-ui/icons";
+import { exportToExcel } from "../../../Constants/Constants";
+import { LuFileSpreadsheet } from "react-icons/lu";
 
 const rotate = keyframes`
   from {
@@ -124,6 +126,8 @@ const Investors = ({ data }) => {
     });
   }, 300);
 
+
+
   // Table filter
   const filteredData = IODetails?.investors?.filter((item) => {
     const name = item.firstName;
@@ -132,6 +136,22 @@ const Investors = ({ data }) => {
     return nameMatches;
   });
 
+
+  const customHeaders = [
+    { label: "Client ID", key: "clientReference_id" },
+    { label: "First Name", key: "firstName" },  // Nested property
+    { label: "Last Name", key: "lastName" },    // Nested property
+    { label: "Investment amount", key: "InvestedAmount_USD" },     // Nested property
+    { label: "Percentage", key: "Investor_Holidings" }, // Nested property
+    { label: "Market Value", key: "Market_Value" },    // Nested property
+    { label: "Return on Investment", key: "Return_On_Investment" }, // Nested property
+    { label: "Distribution", key: "Distribution_Amt" },                     // Simple property
+    { label: "Distribution Percent", key: "Distribution_Per" },                // Simple property        // Simple property
+    { label: "Total Return", key: "Total_Return" },            // Simple property
+    { label: "Total return on Investment", key: "Total_Return_On_Investment" },    
+  ];
+  
+
   const extractedArray = filteredData?.map((item, index) => ({
     id: item?.id,
     "Client ID": (
@@ -430,6 +450,9 @@ const Investors = ({ data }) => {
     setIsRefetchLoading(false);
   };
 
+
+
+
   return (
     <Box {...OPACITY_ON_LOAD} pb={0}>
       <Box bg="white.500">
@@ -439,7 +462,7 @@ const Investors = ({ data }) => {
           pb={3}
           spacing="24px"
         >
-          <span>
+          <Box  display={'flex'} gap={3}>
             <Input
               type="search"
               width={300}
@@ -450,9 +473,25 @@ const Investors = ({ data }) => {
               value={searchTerm}
               onChange={(e) => setSearchTerm(e.target.value)}
             />
+
+          <Button
+              onClick={() =>
+                exportToExcel(IODetails?.investors, customHeaders)
+              }
+              leftIcon={<LuFileSpreadsheet />}
+              colorScheme="forestGreen"
+              size={"sm"}
+              variant={"outline"}
+              rounded={"sm"}
+              fontSize={"xs"}
+              w={100}
+              me={2}
+            >
+              Export xls
+            </Button>
             <Box as="span">
               <Icon
-                ms={3}
+                ms={0}
                 animation={
                   isRefetchLoading ? `${rotate} 1s linear infinite` : "none"
                 }
@@ -467,7 +506,7 @@ const Investors = ({ data }) => {
                 cursor={"pointer"}
               />
             </Box>
-          </span>
+          </Box>
 
           <HStack
             bg={"#C6F6D5"}
diff --git a/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx b/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx
index e9ef3f9..afe1b39 100644
--- a/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx
+++ b/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx
@@ -84,7 +84,7 @@ const InvestorDetails = () => {
   } = useGetInvestorsQuery({
     page: debouncedSearchTerm ? undefined : currentPage,  // Omit pagination for search
     size: debouncedSearchTerm ? undefined : pageSize,     // Omit pagination for search
-    searchTerm: debouncedSearchTerm,
+    search: debouncedSearchTerm,
   },
   {
     skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
@@ -335,7 +335,7 @@ const InvestorDetails = () => {
           />
 
           <HStack className="col" display={"flex"} alignItems={"center"}>
-            <Select
+            {/* <Select
               focusBorderColor="green.500"
               size={"sm"}
               fontSize={"xs"}
@@ -348,9 +348,9 @@ const InvestorDetails = () => {
               <option value="all">All</option>
               <option value="ban">Ban</option>
               <option value="unban">UnBan</option>
-            </Select>
+            </Select> */}
 
-            <Select
+            {/* <Select
               focusBorderColor="green.500"
               size={"sm"}
               fontSize={"xs"}
@@ -363,7 +363,7 @@ const InvestorDetails = () => {
               <option value="all">All</option>
               <option value="ban">Ban</option>
               <option value="unban">UnBan</option>
-            </Select>
+            </Select> */}
 
             <Select
               focusBorderColor="green.500"
@@ -371,11 +371,11 @@ const InvestorDetails = () => {
               fontSize={"xs"}
               cursor={"pointer"}
             >
-              <option value="" defaultValue={"all"} disabled hidden>
+              <option value="all" defaultValue={"all"} disabled hidden>
                 Status
               </option>
 
-              <option value="all">All</option>
+              <option value="all">Status</option>
               <option value="ban">Ban</option>
               <option value="unban">UnBan</option>
             </Select>
@@ -386,10 +386,10 @@ const InvestorDetails = () => {
               fontSize={"xs"}
               cursor={"pointer"}
             >
-              <option value="" defaultValue={"all"} disabled hidden>
+              <option value="all" defaultValue={"all"} disabled hidden>
                 KYC Status
               </option>
-              <option value="all">All</option>
+              <option value="all">KYC Status</option>
               <option value="completed">Completed</option>
               <option value="incompleted">Incompleted</option>
             </Select>
@@ -400,9 +400,10 @@ const InvestorDetails = () => {
               fontSize={"xs"}
               cursor={"pointer"}
             >
-              <option value="" defaultValue={"all"} disabled hidden>
+              <option value="all" defaultValue={"all"} disabled hidden>
                 Country
               </option>
+              <option value="all">All</option>
               <option value="behrain">Behrain</option>
               <option value="kuwait">Kuwait</option>
               <option value="oman">Oman</option>
diff --git a/src/Services/investor.details.service.js b/src/Services/investor.details.service.js
index f30d04e..f1ed90e 100644
--- a/src/Services/investor.details.service.js
+++ b/src/Services/investor.details.service.js
@@ -13,9 +13,9 @@ export const investorDetails = createApi({
   endpoints: (builder) => ({
     
     getInvestors: builder.query({
-    query: ({ page, size, searchTerm }) => {
+    query: ({ page, size, search }) => {
       // Start with the base URL, including searchTerm
-      let baseURL = `/investorDetails/admin/?search_data=${searchTerm || ""}`;
+      let baseURL = `/investorDetails/admin/?search=${search || ""}`;
   
       // Conditionally append page and size parameters if they are defined
       if (page !== undefined && size !== undefined) {