From f81b210b0a76584ec11b1e4d0612e6b0963134e7 Mon Sep 17 00:00:00 2001
From: YasinShaikh123 <123150391+YasinShaikh123@users.noreply.github.com>
Date: Wed, 8 Jan 2025 19:51:35 +0530
Subject: [PATCH] =?UTF-8?q?upadate=20investor=20and=20notifation?=
 =?UTF-8?q?=F0=9F=91=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/Pages/Admin/Notification.jsx              |  31 ++-
 .../EmailNotification/EmailNotification.jsx   | 236 +++++++++---------
 .../InvestorDetails/InvestorDetails.jsx       |  94 +++++--
 src/Services/ban.investor.service.js          |   4 +-
 4 files changed, 203 insertions(+), 162 deletions(-)

diff --git a/src/Pages/Admin/Notification.jsx b/src/Pages/Admin/Notification.jsx
index af06635..63ae2b3 100644
--- a/src/Pages/Admin/Notification.jsx
+++ b/src/Pages/Admin/Notification.jsx
@@ -104,30 +104,36 @@ const Notification = () => {
 
   useEffect(() => {
     const handler = setTimeout(() => {
-      setDebouncedSearchTerm(searchTerm);
-    }, 300); // 300ms delay
+      setDebouncedSearchTerm(searchTerm.trim()); // Trim to remove leading/trailing spaces
+    }, 300);
     return () => clearTimeout(handler);
   }, [searchTerm]);
+  
 
-  const {
-    data: investorDetails,
-    isLoading: investorDetailsLoading,
-    refetch,
-  } = useGetUnbanInvestorQuery(
+  const { data: investorDetails, isLoading: investorDetailsLoading, refetch } =
+  useGetUnbanInvestorQuery(
     {
-      page: currentPage, // Omit pagination for search
+      page: 1, // Omit pagination for search
       size: 10000, // Omit pagination for search
-      page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
-      size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search
-      search: debouncedSearchTerm,
+      // page: debouncedSearchTerm ? undefined : currentPage, // Disable pagination for search
+      // size: debouncedSearchTerm ? undefined : pageSize,    // Disable pagination for search
+      search: debouncedSearchTerm,                        // Pass search term
       country_xid: country,
       KYCStatus: kyc,
     },
     {
-      skip: debouncedSearchTerm === "" && searchTerm !== "", // Skip if search is empty and it's not the initial request
+      skip: searchTerm !== "" && debouncedSearchTerm === "", // Skip if search not debounced yet
     }
   );
 
+  // useEffect(() => {
+  //   console.log("Search Term:", searchTerm);
+  //   console.log("Debounced Search Term:", debouncedSearchTerm);
+  //   console.log("Investor Details:", investorDetails);
+  // }, [searchTerm, debouncedSearchTerm, investorDetails]);
+  
+
+
   console.log(investorDetails);
 
   const [sendNotification] = useSendNotificationMutation();
@@ -307,6 +313,7 @@ const Notification = () => {
       </Box>
     ),
   }));
+  
 
   return (
     <Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={14}>
diff --git a/src/Pages/EmailNotification/EmailNotification.jsx b/src/Pages/EmailNotification/EmailNotification.jsx
index 9d2432e..22d5c98 100644
--- a/src/Pages/EmailNotification/EmailNotification.jsx
+++ b/src/Pages/EmailNotification/EmailNotification.jsx
@@ -11,7 +11,7 @@ import {
   Text,
   useToast,
 } from "@chakra-ui/react";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
 import { OPACITY_ON_LOAD } from "../../Layout/animations";
 import NormalTable from "../../Components/DataTable/NormalTable";
 import { useGetUnbanInvestorQuery } from "../../Services/ban.investor.service";
@@ -60,12 +60,12 @@ const EmailNotification = () => {
   //   size: 10000, // Omit pagination for search
   // });
 
-  // useEffect(() => {
-  //   const handler = setTimeout(() => {
-  //     setDebouncedSearchTerm(searchTerm);
-  //   }, 300); // 300ms delay
-  //   return () => clearTimeout(handler);
-  // }, [searchTerm]);
+  useEffect(() => {
+    const handler = setTimeout(() => {
+      setDebouncedSearchTerm(searchTerm.trim()); // Trim to remove leading/trailing spaces
+    }, 300);
+    return () => clearTimeout(handler);
+  }, [searchTerm]);
 
   const {
     data: investorDetails,
@@ -73,10 +73,10 @@ const EmailNotification = () => {
     refetch,
   } = useGetUnbanInvestorQuery(
     {
-      page: currentPage, // Omit pagination for search
+      page: 1, // Omit pagination for search
       size: 10000, // Omit pagination for search
-      page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
-      size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search
+      // page: debouncedSearchTerm ? undefined : currentPage, // Omit pagination for search
+      // size: debouncedSearchTerm ? undefined : pageSize, // Omit pagination for search
       search: debouncedSearchTerm,
       country_xid: country,
       KYCStatus: kyc,
@@ -165,9 +165,9 @@ const EmailNotification = () => {
 
   const modules = {
     toolbar: [
-    //   [{ header: "1" }, { header: "2" }, 
-    //   // { font: [] }
-    // ],
+      //   [{ header: "1" }, { header: "2" },
+      //   // { font: [] }
+      // ],
       // [{ size: [] }],
       ["bold", "italic", "underline", "strike", "blockquote"],
       [{ list: "ordered" }, { list: "bullet" }],
@@ -177,12 +177,15 @@ const EmailNotification = () => {
 
   // Main submission logic
   const handleSend = async (e) => {
-    e.preventDefault();  // Prevent default form submission
+    e.preventDefault(); // Prevent default form submission
 
     if (!subject || !value) {
       toast({
         render: () => (
-          <ToastBox status={"error"} message={"Subject or email body cannot be empty"} />
+          <ToastBox
+            status={"error"}
+            message={"Subject or email body cannot be empty"}
+          />
         ),
       });
       return;
@@ -191,7 +194,10 @@ const EmailNotification = () => {
     if (selectedRadio.length === 0) {
       toast({
         render: () => (
-          <ToastBox status={"error"} message={"Please select at least one recipient"} />
+          <ToastBox
+            status={"error"}
+            message={"Please select at least one recipient"}
+          />
         ),
       });
       return;
@@ -202,44 +208,36 @@ const EmailNotification = () => {
     const emailPayload = {
       subject,
       body: value,
-      principal_xid:  selectedRadio,
+      principal_xid: selectedRadio,
     };
 
-
     try {
-      const res = await sendCustomNotification(emailPayload)
-      console.log(res); 
+      const res = await sendCustomNotification(emailPayload);
+      console.log(res);
       if (res?.error) {
         toast({
           render: () => (
             <ToastBox status={"error"} message={res?.error?.data?.message} />
           ),
         });
-        setIsLoading(false)
-      }else if(res?.data){
+        setIsLoading(false);
+      } else if (res?.data) {
+        toast({
+          render: () => <ToastBox message={res?.data?.message} />,
+        });
+        setIsLoading(false);
+        setSubject("");
+        setValue("");
+        setSelectedRadio([]);
+      } else {
         toast({
           render: () => (
-            <ToastBox message={res?.data?.message} />
+            <ToastBox status={"error"} message={"Something went wrong"} />
           ),
         });
-        setIsLoading(false)
-        setSubject("")
-        setValue("")
-        setSelectedRadio([])
-
-      }else{
-        toast({
-          render: () => (
-            <ToastBox status={'error'} message={"Something went wrong"} />
-          ),
-        });
-        setIsLoading(false)
+        setIsLoading(false);
       }
-      
-    } catch (error) {
-      
-    }
-
+    } catch (error) {}
   };
 
   return (
@@ -277,98 +275,92 @@ const EmailNotification = () => {
           {/* <FormHelperText>Entered subject will be reflected on emails subject body.</FormHelperText> */}
         </FormControl>
 
-
         <FormControl minH={400} isRequired mb={3} p={1}>
           <FormLabel fontSize={"sm"}>Create Custom body</FormLabel>
-        <ReactQuill
-          theme="snow"
-          style={{
-            height:300
-          }}
-          value={value}
-          onChange={setValue}
-          modules={modules}
-          placeholder="Start typing here..."
-
-        />
+          <ReactQuill
+            theme="snow"
+            style={{
+              height: 300,
+            }}
+            value={value}
+            onChange={setValue}
+            modules={modules}
+            placeholder="Start typing here..."
+          />
         </FormControl>
         {/* <FormHelperText fontSize={"xs"}>
           We'll never share your email.
         </FormHelperText> */}
-
-
-
-
       </FormControl>
       <HStack
-          display={"flex"}
-          justifyContent={"space-between"}
-          ps={1}
-          pe={1}
-          pb={4}
-          pt={4}
-          spacing="24px"
-        >
-          <Input
-            mt={1}
-            type="search"
-            width={300}
-            placeholder="Search..."
-            size="sm"
-            rounded="sm"
+        display={"flex"}
+        justifyContent={"space-between"}
+        ps={1}
+        pe={1}
+        pb={4}
+        pt={4}
+        spacing="24px"
+      >
+        <Input
+          mt={1}
+          type="search"
+          width={300}
+          placeholder="Search..."
+          size="sm"
+          rounded="sm"
+          focusBorderColor="green.500"
+          value={searchTerm}
+          onChange={(e) => setSearchTerm(e.target.value)}
+        />
+        <HStack className="col" justifyContent={"end"}>
+          <Select
+            w={250}
             focusBorderColor="green.500"
-            value={searchTerm}
-            onChange={(e) => setSearchTerm(e.target.value)}
-          />
-          <HStack className="col" justifyContent={"end"}>
-            <Select
-              w={250}
-              focusBorderColor="green.500"
-              size={"sm"}
-              fontSize={"xs"}
-              cursor={"pointer"}
-              onChange={(e) => setCountry(e.target.value)}
-              value={country}
-            >
-              <option value="" defaultValue={""} disabled hidden>
-                Country
-              </option>
-              <option value="">All</option>
-              <option value="1">Bahrain</option>
-              <option value="2">Kuwait</option>
-              <option value="3">Oman</option>
-              <option value="4">Qatar</option>
-              <option value="5">Saudi arabia</option>
-              <option value="6">United arab emirates</option>
-            </Select>
-            <Select
-              w={250}
-              focusBorderColor="green.500"
-              size={"sm"}
-              fontSize={"xs"}
-              cursor={"pointer"}
-              onChange={(e) => setKyc(e.target.value)}
-              value={kyc}
-            >
-              <option value="" defaultValue={""} disabled hidden>
-                KYC Status
-              </option>
-              <option value="">KYC Status</option>
-              <option value="0">Not Completed</option>
-              <option value="1">Completed</option>
-            </Select>
-          </HStack>
+            size={"sm"}
+            fontSize={"xs"}
+            cursor={"pointer"}
+            onChange={(e) => setCountry(e.target.value)}
+            value={country}
+          >
+            <option value="" defaultValue={""} disabled hidden>
+              Country
+            </option>
+            <option value="">All</option>
+            <option value="1">Bahrain</option>
+            <option value="2">Kuwait</option>
+            <option value="3">Oman</option>
+            <option value="4">Qatar</option>
+            <option value="5">Saudi arabia</option>
+            <option value="6">United arab emirates</option>
+          </Select>
+          <Select
+            w={250}
+            focusBorderColor="green.500"
+            size={"sm"}
+            fontSize={"xs"}
+            cursor={"pointer"}
+            onChange={(e) => setKyc(e.target.value)}
+            value={kyc}
+          >
+            <option value="" defaultValue={""} disabled hidden>
+              KYC Status
+            </option>
+            <option value="">KYC Status</option>
+            <option value="0">Not Completed</option>
+            <option value="1">Completed</option>
+          </Select>
         </HStack>
-      <Box overflow={'scroll'} h={'58vh'}>
-      <NormalTable
-        centered={true}
-        emptyMessage={`We don't have any Sponsors`}
-        tableHeadRow={tableHeadRow}
-        data={extractedArray}
-        setSelectedRadio={setSelectedRadio}
-        selectedRadio={selectedRadio}
-        showRadioButton={true}
-      />
+      </HStack>
+      <Box overflow={"scroll"} h={"58vh"}>
+        <NormalTable
+          centered={true}
+          emptyMessage={`We don't have any Sponsors`}
+          tableHeadRow={tableHeadRow}
+          data={extractedArray}
+          setSelectedRadio={setSelectedRadio}
+          selectedRadio={selectedRadio}
+          showRadioButton={true}
+        />
       </Box>
 
       <HStack justifyContent={"flex-end"} px={2}>
diff --git a/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx b/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx
index 927a9a0..96e8e0e 100644
--- a/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx
+++ b/src/Pages/Investor_Management/InvestorDetails/InvestorDetails.jsx
@@ -105,9 +105,11 @@ const InvestorDetails = () => {
     "Country",
     "Phone Number",
     "E-mail ID",
-    "Type",
+    // "Type",
+    "Wallet Balance",
+    "Investor Portfolio",
     "KYC Status",
-    "Status",
+    // "Status",
     "Action",
   ];
 
@@ -120,8 +122,10 @@ const InvestorDetails = () => {
     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",
+    "Wallet Balance": item?.principal?.WalletBalance_InInvCur, // Skipping integer conversion, as this is likely a string
+    "Investor Portfolio": item?.principal?.Portfolio_InInvCur,
+    // Type: item?.investor_type?.investorTypeName,
+    // Status: item.ioStatus ? "Ban" : "Unban",
     "KYC Status": item.KYCStatus ? "Completed" : "Not complete",
   }));
 
@@ -181,32 +185,70 @@ const InvestorDetails = () => {
         </Text>
       </Box>
     ),
-    Type: (
-      <Box w={"auto"} isTruncated={true}>
-        <Text as={"span"}>
-          <Badge
-            color={"forestGreen.500"}
-            variant={"ghost"}
-            fontWeight={"700"}
-            px={2}
-            py={0.5}
-          >
-            {item?.investor_type?.investorTypeName}
+    // Type: (
+    //   <Box w={"auto"} isTruncated={true}>
+    //     <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>
+    // ),
+    "Wallet Balance": (
+      <Box
+        display={"flex"}
+        justifyContent={"end"}
+        w={"110px"}
+        isTruncated={true}
+      >
+        <Text as={"span"} color={"teal.900"}>
+          {/* {formatCurrency(removeTrailingZeros(item?.investorAmount))}  */}
+          {parseFloat(item?.WalletBalance_InInvCur || 0).toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          })}
+          <Badge ms={1} colorScheme="green">
+            {item?.currencyCode}
           </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>
+    "Investor Portfolio": (
+      <Box
+        display={"flex"}
+        justifyContent={"end"}
+        w={"120px"}
+        isTruncated={true}
+      >
+        <Text as={"span"} color={"teal.900"}>
+          {/* {formatCurrency(removeTrailingZeros(item?.investorAmount))}  */}
+          {parseFloat(item?.Portfolio_InInvCur || 0).toLocaleString(undefined, {
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+          })}
+          <Badge ms={1} colorScheme="green">
+            {item?.currencyCode}
+          </Badge>
+        </Text>
       </Box>
     ),
     "KYC Status": (
diff --git a/src/Services/ban.investor.service.js b/src/Services/ban.investor.service.js
index e21a758..638eb02 100644
--- a/src/Services/ban.investor.service.js
+++ b/src/Services/ban.investor.service.js
@@ -20,9 +20,9 @@ export const banInvestorDetails = createApi({
  
 
     getUnbanInvestor: builder.query({
-      query: ({ page, size, searchTerm, userStatus, KYCStatus, country_xid  }) => {
+      query: ({ page, size, search, userStatus, KYCStatus, country_xid  }) => {
         // Start with the base URL, including searchTerm
-        let baseURL = `/investorDetails/admin/getAllUnbanned?search=${searchTerm || ""}&userStatus=${userStatus ||""}&KYCStatus=${KYCStatus || ""}&country_xid=${country_xid||""}`;
+        let baseURL = `/investorDetails/admin/getAllUnbanned?search=${search || ""}&userStatus=${userStatus ||""}&KYCStatus=${KYCStatus || ""}&country_xid=${country_xid||""}`;
         
         // Conditionally append kycStatus if it's defined
         if (KYCStatus) {