From 4a78f9374cbcddf127fc8dfd07f5bed8d5b04a1b Mon Sep 17 00:00:00 2001
From: siddheshmorewdi <siddhesh.more@wdimails.com>
Date: Wed, 26 Jun 2024 17:45:13 +0530
Subject: [PATCH] updated

---
 src/Components/EmptySearchList.jsx            |   2 +-
 src/Components/FormField.jsx                  |  94 +++++---
 .../InvestmentCard/InvestmentCard.jsx         | 219 ++++++++++--------
 src/Contexts/GlobalStateProvider.jsx          |   3 +
 src/Pages/IO_Management/CreateIO.jsx          | 193 +++++++++++++--
 src/Pages/IO_Management/ViewIO.jsx            | 133 ++++++++++-
 .../Investor_Management/InvestorDetails.jsx   |  35 +--
 7 files changed, 496 insertions(+), 183 deletions(-)

diff --git a/src/Components/EmptySearchList.jsx b/src/Components/EmptySearchList.jsx
index dc37c9e..f455898 100644
--- a/src/Components/EmptySearchList.jsx
+++ b/src/Components/EmptySearchList.jsx
@@ -13,7 +13,7 @@ const EmptySearchList = ({message}) => {
     >
         <Image w={200} mb={8} h={200} src={EmptySearchListImage} alt='Dan Abramov' />
         <Text className=" fw-bold fs-5" >{message}</Text>
-        <Text as={'p'} className="web-text-medium">Posts of rubix will appear here.</Text>
+        <Text as={'p'} className="web-text-medium">Posts of tanami will appear here.</Text>
         
     </Box>
   )
diff --git a/src/Components/FormField.jsx b/src/Components/FormField.jsx
index dfa60cc..7005683 100644
--- a/src/Components/FormField.jsx
+++ b/src/Components/FormField.jsx
@@ -1,5 +1,5 @@
-import { FormControl, FormLabel, Input, Textarea } from '@chakra-ui/react';
-import React from 'react'
+import { FormControl, FormLabel, Input, Textarea, Select, Checkbox, RadioGroup, Radio, Stack } from '@chakra-ui/react';
+import React from 'react';
 import { Controller } from 'react-hook-form';
 import { TiWarning } from 'react-icons/ti';
 
@@ -8,40 +8,82 @@ const FormField = ({
     control,
     name,
     type = "text",
+    options = [],
     errors,
     isRequired,
     arabic,
     ...props
   }) => (
-    // <FormControl isInvalid={errors[name]}>
-    // <FormControl isRequired={isRequired}>
-    <FormControl >
+    <FormControl isInvalid={errors[name]}>
       <FormLabel textAlign={arabic ? "right" : "left"} fontSize={"sm"}>{label}</FormLabel>
       <Controller
         control={control}
         name={name}
         defaultValue=""
         render={({ field }) => {
-          return type === "textarea" ? (
-            <Textarea
-              focusBorderColor="forestGreen.400"
-              size={"sm"}
-              {...field}
-              {...props}
-              placeholder={label}
-              textAlign={arabic ? "right" : "left"}
-            />
-          ) : (
-            <Input
-              focusBorderColor="forestGreen.300"
-              size={"sm"}
-              type={type}
-              {...field}
-              {...props}
-              placeholder={label}
-              textAlign={arabic ? "right" : "left"}
-            />
-          );
+          switch (type) {
+            case 'textarea':
+              return (
+                <Textarea
+                  focusBorderColor="forestGreen.400"
+                  size={"sm"}
+                  {...field}
+                  {...props}
+                  placeholder={label}
+                  textAlign={arabic ? "right" : "left"}
+                />
+              );
+            case 'select':
+              return (
+                <Select
+                  focusBorderColor="forestGreen.300"
+                  size={"sm"}
+                  {...field}
+                  {...props}
+                  placeholder={label}
+                  textAlign={arabic ? "right" : "left"}
+                >
+                  {options.map((option, index) => (
+                    <option key={index} value={option.value}>{option.label}</option>
+                  ))}
+                </Select>
+              );
+            case 'checkbox':
+              return (
+                <Checkbox
+                  size={"sm"}
+                  {...field}
+                  {...props}
+                  textAlign={arabic ? "right" : "left"}
+                >
+                  {label}
+                </Checkbox>
+              );
+            case 'radio':
+              return (
+                <RadioGroup {...field} {...props}>
+                  <Stack direction="row">
+                    {options.map((option, index) => (
+                      <Radio key={index} value={option.value}>
+                        {option.label}
+                      </Radio>
+                    ))}
+                  </Stack>
+                </RadioGroup>
+              );
+            default:
+              return (
+                <Input
+                  focusBorderColor="forestGreen.300"
+                  size={"sm"}
+                  type={type}
+                  {...field}
+                  {...props}
+                  placeholder={label}
+                  textAlign={arabic ? "right" : "left"}
+                />
+              );
+          }
         }}
       />
       {errors[name] && (
@@ -52,4 +94,4 @@ const FormField = ({
     </FormControl>
   );
 
-export default FormField
\ No newline at end of file
+export default FormField;
diff --git a/src/Components/InvestmentCard/InvestmentCard.jsx b/src/Components/InvestmentCard/InvestmentCard.jsx
index 072203e..6b08414 100644
--- a/src/Components/InvestmentCard/InvestmentCard.jsx
+++ b/src/Components/InvestmentCard/InvestmentCard.jsx
@@ -1,4 +1,5 @@
 import {
+  Badge,
   Box,
   Button,
   Card,
@@ -10,101 +11,135 @@ import {
   Text,
   Tooltip,
 } from "@chakra-ui/react";
+import { OPACITY_ON_LOAD } from "../../Layout/animations";
 
-
-const InvestmentCard = ({investment}) => {
+const InvestmentCard = ({ investment }) => {
   return (
-   <Card
-            direction={{ base: "column", sm: "row" }}
-            overflow="scroll"
-            variant="outline"
-            display={"flex"}
-            alignItems={"center"}
-            mb={'20px'}
-            boxShadow={'md'}
-            border={'none'}
-          >
-            <Image
-              p={"15px"}
-              rounded={"24px"}
-              objectFit="cover"
-              w={"200px"}
-              h={"160px"}
-              src={investment?.imgSrc}
-              alt={investment?.title}
-            />
+    <Card
+    {...OPACITY_ON_LOAD}
+      direction={{ base: "column", sm: "row" }}
+      variant="outline"
+      display={"flex"}
+      alignItems={"center"}
+      mb={"20px"}
+      boxShadow={"md"}
+      border={"none"}
+  mt={2}
+    >
+      <Image
+        p={"14px"}
+        rounded={"24px"}
+        objectFit="cover"
+        w={"200px"}
+        h={"140px"}
+        src={investment?.imgSrc}
+        alt={investment?.title}
+      />
 
-            <Stack>
-              <CardBody>
-                <Heading size="sm" fontWeight={"500"}>
-                  {investment?.title}
-                </Heading>
-                <Text fontSize="sm" mb={"4px"}>
-                  Sponsor:{" "}
-                  <Text as={"span"} fontWeight={"600"}>
-                    {investment?.sponsor}
-                  </Text>{" "}
-                </Text>
-                <Text fontSize="sm" mb={"4px"}>
-                  Ann return:{" "}
-                  <Text as={"span"} fontWeight={"600"}>
-                    {investment?.annReturn}
-                  </Text>{" "}
-                </Text>
-                <Text fontSize="sm" mb={"4px"}>
-                  Ann Yield:{" "}
-                  <Text as={"span"} fontWeight={"600"}>
-                    {investment?.annYield}
-                  </Text>{" "}
-                </Text>
-              </CardBody>
-            </Stack>
-            <Stack borderLeft={"1px solid #ccc"}>
-              <CardBody>
-                <Text fontSize="sm" mb={"4px"}>
-                  Min.Invests:{" "}
-                  <Text as={"span"} fontWeight={"600"}>
-                    {investment?.minInvests}
-                  </Text>{" "}
-                </Text>
-                <Text fontSize="sm" mb={"4px"}>
-                  Targ Close:{" "}
-                  <Text as={"span"} fontWeight={"600"}>
-                    {investment?.targClose}
-                  </Text>{" "}
-                </Text>
-                <Text fontSize="sm" mb={"4px"}>
-                  Holding per:{" "}
-                  <Text as={"span"} fontWeight={"600"}>
-                    {investment?.holdingPer}
-                  </Text>{" "}
-                </Text>
-              </CardBody>
-            </Stack>
-            <Stack>
-              <CardBody>
-              <Tooltip hasArrow placement='top-start' label={investment?.progressValue} bg='white' color='#000'>
-                <Progress
-                  width={"200px"}
-                  value={investment?.progressValue}
-                  rounded={"10px"}
-                  colorScheme={"green"}
-                  size={'sm'}
-                />
-                </Tooltip>
-                <Button
-                // variant='ghost'
-                  w={"100%"}
-                  colorScheme={"gray"}
-                  rounded={"sm"}
-                  size={"sm"}
-                  mt={"20px"}
-                >
-                  View
-                </Button>
-              </CardBody>
-            </Stack>
-          </Card>
+      <Stack w={"38%"}>
+        <CardBody>
+          <Heading size="sm" fontWeight={"500"}>
+            {investment?.title}
+            <Badge
+              colorScheme={
+                investment?.status === "Available"
+                  ? "teal"
+                  : investment?.status === "Upcomming"
+                  ? "green"
+                  : "red"
+              }
+              ps={2} pe={2} pt={0.5} pb={0.5}
+              fontSize={"xs"}
+              ms={3}
+            >
+              {investment?.status === "Available"
+                ? "Available"
+                : investment?.status === "Upcomming"
+                ? "Upcomming"
+                : "Closed"}
+            </Badge>
+          </Heading>
+          <Text fontSize="sm" mb={"4px"}>
+            Sponsor:{" "}
+            <Text as={"span"} fontWeight={"600"}>
+              {investment?.sponsor}
+            </Text>{" "}
+          </Text>
+          <Text fontSize="sm" mb={"4px"}>
+            Ann return:{" "}
+            <Text as={"span"} fontWeight={"600"}>
+              {investment?.annReturn}
+            </Text>{" "}
+          </Text>
+          <Text fontSize="sm" mb={"4px"}>
+            Ann Yield:{" "}
+            <Text as={"span"} fontWeight={"600"}>
+              {investment?.annYield}
+            </Text>{" "}
+          </Text>
+        </CardBody>
+      </Stack>
+      <Stack borderLeft={"1px solid #ccc"}>
+        <CardBody>
+          <Text fontSize="sm" mb={"4px"}>
+            Min.Invests:{" "}
+            <Text as={"span"} fontWeight={"600"}>
+              {investment?.minInvests}
+            </Text>{" "}
+          </Text>
+          <Text fontSize="sm" mb={"4px"}>
+            Targ Close:{" "}
+            <Text as={"span"} fontWeight={"600"}>
+              {investment?.targClose}
+            </Text>{" "}
+          </Text>
+          <Text fontSize="sm" mb={"4px"}>
+            Holding per:{" "}
+            <Text as={"span"} fontWeight={"600"}>
+              {investment?.holdingPer}
+            </Text>{" "}
+          </Text>
+        </CardBody>
+      </Stack>
+      <Stack>
+        <CardBody>
+
+          <Box as="span" display={'flex'} justifyContent={'space-between'} mb={1}>
+                <Text fontSize={'xs'} fontWeight={500} as={'span'}>$ 500,000.450</Text>
+                <Text fontSize={'xs'} fontWeight={500}  as={'span'}>{investment?.progressValue} % Funded</Text>
+          </Box>
+          {/* <Tooltip
+            hasArrow
+            placement="top-start"
+            label={`${investment?.progressValue}%`}
+            bg="white"
+            color="#000"
+            fontSize={'xs'}
+          > */}
+            <Progress
+              width={"200px"}
+              value={investment?.progressValue}
+              rounded={"10px"}
+              colorScheme={"green"}
+              size={"sm"}
+            />
+          {/* </Tooltip> */}
+
+
+
+          <Button
+            // variant='ghost'
+            w={"100%"}
+            colorScheme={"gray"}
+            rounded={"sm"}
+            size={"sm"}
+            mt={"20px"}
+          >
+            View
+          </Button>
+        </CardBody>
+      </Stack>
+    </Card>
   );
 };
 
diff --git a/src/Contexts/GlobalStateProvider.jsx b/src/Contexts/GlobalStateProvider.jsx
index 3718cd9..7c802db 100644
--- a/src/Contexts/GlobalStateProvider.jsx
+++ b/src/Contexts/GlobalStateProvider.jsx
@@ -276,6 +276,7 @@ const GlobalStateProvider = ({ children }) => {
       targClose: "24 December",
       holdingPer: "5-7 years",
       progressValue: 80,
+      status: "Available"
     },
     {
       imgSrc:
@@ -288,6 +289,7 @@ const GlobalStateProvider = ({ children }) => {
       targClose: "24 December",
       holdingPer: "5-7 years",
       progressValue: 80,
+      status: "Upcomming"
     },
     {
       imgSrc:
@@ -300,6 +302,7 @@ const GlobalStateProvider = ({ children }) => {
       targClose: "24 December",
       holdingPer: "5-7 years",
       progressValue: 80,
+      status: "Closed"
     },
   ]);
 
diff --git a/src/Pages/IO_Management/CreateIO.jsx b/src/Pages/IO_Management/CreateIO.jsx
index db9be00..0e8d424 100644
--- a/src/Pages/IO_Management/CreateIO.jsx
+++ b/src/Pages/IO_Management/CreateIO.jsx
@@ -1,22 +1,173 @@
-import { Box, Image, Text } from "@chakra-ui/react"
-// import error from "../assets/Error.svg"
-import robot from "../../assets/robot.png"
-// import robot from "../assets/robot.png"
-const CreateIO = () => {
-  return (
-    
-    <Box
-    h={'100vh'}
-    display={'flex'}
-    justifyContent={'center'}
-    alignItems={'center'}
-    flexDirection={'column'}
-    gap={8}
-    >
-        <Image src={robot} w={"171px"} />
-        {/* <Text color={'green.800'} as={'span'} fontSize={'small'}>The requested URL was not found on this server.</Text> */}
-    </Box>
-  )
-}
+import React, { useContext } from "react";
+import { OPACITY_ON_LOAD } from "../../Layout/animations";
+import {
+  Box,
+  Divider,
+  FormControl,
+  FormLabel,
+  Heading,
+  Input,
+  Select,
+  Textarea,
+  Button,
+  Text,
+} from "@chakra-ui/react";
+import { useForm, Controller } from "react-hook-form";
+import { yupResolver } from "@hookform/resolvers/yup";
+import * as yup from "yup";
+import { WarningTwoIcon } from "@chakra-ui/icons";
+import { TiWarning } from "react-icons/ti";
+import GlobalStateContext from "../../Contexts/GlobalStateContext";
+import { useNavigate } from "react-router-dom";
+import FormField from "../../Components/FormField";
+import { v4 as uuidv4 } from "uuid";
 
-export default CreateIO
\ No newline at end of file
+const schema = yup.object().shape({
+  sponserName: yup.string().required("Sponser name is required"),
+  mobileNo: yup.string().required("Mobile no is required"),
+  sponserAddress: yup.string().required("Sponser address is required"),
+
+  bankName: yup.string().required("Bank Name is required"),
+  accountNumber: yup.string().required("Account Number is required"),
+  swiftCode: yup.string().required("SWIFT/BIC Code is required"),
+  bankEmail: yup.string().email("Invalid email format"),
+
+  // routingNumber: yup.string().required("Routing Number is required"),
+  // iban: yup.string().required("IBAN is required"),
+  // accountType: yup.string().required("Account Type is required"),
+  // bankPhoneNumber: yup.string().required("Bank Phone Number is required"),
+  // bankBranch: yup.string().required("Bank Branch is required"),
+  // branchAddress: yup.string().required("Branch Address is required"),
+  // ifscCode: yup.string().required("IFSC Code is required"),
+  // accountHolderName: yup.string().required("Account Holder's Name is required"),
+});
+
+
+
+export function debounce(func, delay) {
+  let debounceTimer;
+  return function(...args) {
+    clearTimeout(debounceTimer);
+    debounceTimer = setTimeout(() => func.apply(this, args), delay);
+  };
+}
+const CreateIO = () => {
+  const navigate = useNavigate();
+  const { sponser, setSponser } = useContext(GlobalStateContext);
+  const {
+    control,
+    handleSubmit,
+    formState: { errors },
+  } = useForm({
+    resolver: yupResolver(schema),
+  });
+
+  console.log(errors);
+
+  const onSubmit = (data) => {
+    setSponser([
+      {
+        ...data,
+        status: true,
+        id: uuidv4(),
+        createdAt: new Date().toISOString(),
+      },
+      ...sponser,
+    ]);
+    navigate("/sponser");
+  };
+
+
+    // Extract options for the select input
+    const sponserOptions = sponser.map(item => ({
+      value: item.id,
+      label: item.sponserName
+    }));
+
+  return (
+    <Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={14}>
+      <form onSubmit={handleSubmit(onSubmit)}>
+        <Heading as="h6" size="xs" mt={4}>
+          IO Details
+        </Heading>
+        <Box display={"flex"} gap={0}>
+          <Box
+            width={"50%"}
+            p={5}
+            display={"flex"}
+            flexDirection={"column"}
+            gap={4}
+          >
+            <FormField
+              label="IO name"
+              name="IO name"
+              control={control}
+              errors={errors}
+              isRequired={true}
+            />
+
+<FormField
+  label="Select Option"
+  control={control}
+  name="selectOption"
+  type="select"
+  options={sponserOptions}
+  errors={errors}
+/>
+
+
+            <FormField
+              label="Mobile no"
+              name="mobileNo"
+              type="tel"
+              control={control}
+              errors={errors}
+              isRequired={true}
+            />
+            <FormField
+              label="Sponser address"
+              name="sponserAddress"
+              type="textarea"
+              control={control}
+              errors={errors}
+              isRequired={true}
+            />
+          </Box>
+
+          <Box
+            width={"50%"}
+            p={5}
+            display={"flex"}
+            flexDirection={"column"}
+            gap={4}
+          >
+            <FormField
+              label="اسم الراعي"
+              name="اسم الراعي"
+              control={control}
+              errors={errors}
+              isRequired={true}
+              arabic={true}
+            />
+          </Box>
+        </Box>
+
+        <Box display={"flex"} justifyContent={"flex-start"} p={4}>
+          <Button
+            size={"sm"}
+            width={"50%"}
+            rounded={"sm"}
+            type="submit"
+            colorScheme="green"
+          >
+            Submit
+          </Button>
+        </Box>
+      </form>
+      
+      <Divider />
+    </Box>
+  );
+};
+
+export default CreateIO;
diff --git a/src/Pages/IO_Management/ViewIO.jsx b/src/Pages/IO_Management/ViewIO.jsx
index c35d5f2..4c8fb4e 100644
--- a/src/Pages/IO_Management/ViewIO.jsx
+++ b/src/Pages/IO_Management/ViewIO.jsx
@@ -1,6 +1,7 @@
 import {
   Box,
   Image,
+  Input,
   Skeleton,
   Tab,
   TabIndicator,
@@ -16,26 +17,51 @@ import { useContext, useEffect, useState } from "react";
 import { OPACITY_ON_LOAD } from "../../Layout/animations";
 import InvestmentCard from "../../Components/InvestmentCard/InvestmentCard";
 import GlobalStateContext from "../../Contexts/GlobalStateContext";
-// import robot from "../assets/robot.png"
+import Pagination from "../../Components/Pagination";
+import EmptySearchList from "../../Components/EmptySearchList";
+
 const ExchangeRate = () => {
+  const [searchTerm, setSearchTerm] = useState("");
   const { investment, setInvestment } = useContext(GlobalStateContext);
   const [isLoading, setIsLoading] = useState(true);
 
-  
-
-
   useEffect(() => {
     // Simulate loading
     const timer = setTimeout(() => {
       setIsLoading(false);
     }, 1500);
-
     // Cleanup the timer on component unmount
     return () => clearTimeout(timer);
   }, []);
 
+  // ====================================================[Table Filter]================================================================
+  const filteredData = investment.filter((item) => {
+    // Filter by name (case insensitive)
+    const name = item.title;
+    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;
+  });
+
+  const availableInvestments = filteredData.filter(
+    (item) => item.status === "Available"
+  );
+  const upcomingInvestments = filteredData.filter(
+    (item) => item.status === "Upcomming"
+  );
+  const closedInvestments = filteredData.filter(
+    (item) => item.status === "Closed"
+  );
 
   return (
     <Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"}>
@@ -54,18 +80,103 @@ const ExchangeRate = () => {
         />
         <TabPanels>
           <TabPanel>
-            {investment?.map((investmentDetails, index) => (
-                <Skeleton  key={index} isLoaded={!isLoading}><InvestmentCard  investment={investmentDetails} /></Skeleton>
-                ))}
+            <Box display={"flex"} justifyContent={"space-between"}>
+              <Input
+                type="search"
+                width={300}
+                placeholder="Search..."
+                size="sm"
+                rounded="sm"
+                focusBorderColor="green.500"
+                value={searchTerm}
+                onChange={(e) => setSearchTerm(e.target.value)}
+              />
+              <Pagination pageCount={false} totalItems={50} />
+            </Box>
+            {filteredData?.length === 0 ? (
+              <EmptySearchList message="We have no IO with this name" />
+            ) : (
+              filteredData?.map((investmentDetails, index) => (
+                <Skeleton key={index} isLoaded={!isLoading}>
+                  <InvestmentCard investment={investmentDetails} />
+                </Skeleton>
+              ))
+            )}
           </TabPanel>
+
           <TabPanel>
-            <p>two!</p>
+            <Box display={"flex"} justifyContent={"space-between"}>
+              <Input
+                type="search"
+                width={300}
+                placeholder="Search..."
+                size="sm"
+                rounded="sm"
+                focusBorderColor="green.500"
+                value={searchTerm}
+                onChange={(e) => setSearchTerm(e.target.value)}
+              />
+              <Pagination pageCount={false} totalItems={50} />
+            </Box>
+            {availableInvestments?.length === 0 ? (
+              <EmptySearchList message="We have no IO with this name" />
+            ) : (
+              availableInvestments?.map((investmentDetails, index) => (
+                <Skeleton key={index} isLoaded={!isLoading}>
+                  <InvestmentCard investment={investmentDetails} />
+                </Skeleton>
+              ))
+            )}
           </TabPanel>
+
           <TabPanel>
-            <p>three!</p>
+            <Box display={"flex"} justifyContent={"space-between"}>
+              <Input
+                type="search"
+                width={300}
+                placeholder="Search..."
+                size="sm"
+                rounded="sm"
+                focusBorderColor="green.500"
+                value={searchTerm}
+                onChange={(e) => setSearchTerm(e.target.value)}
+              />
+              <Pagination pageCount={false} totalItems={50} />
+            </Box>
+            {upcomingInvestments?.length === 0 ? (
+              <EmptySearchList message="We have no IO with this name" />
+            ) : (
+              upcomingInvestments?.map((investmentDetails, index) => (
+                <Skeleton key={index} isLoaded={!isLoading}>
+                  <InvestmentCard investment={investmentDetails} />
+                </Skeleton>
+              ))
+            )}
           </TabPanel>
+
           <TabPanel>
-            <p>three!</p>
+            <Box display={"flex"} justifyContent={"space-between"}>
+              <Input
+                type="search"
+                width={300}
+                placeholder="Search..."
+                size="sm"
+                rounded="sm"
+                focusBorderColor="green.500"
+                value={searchTerm}
+                onChange={(e) => setSearchTerm(e.target.value)}
+              />
+              <Pagination pageCount={false} totalItems={50} />
+            </Box>
+            {closedInvestments?.length === 0 ? (
+              <EmptySearchList message="We have no IO with this name" />
+            ) : (
+              closedInvestments?.map((investmentDetails, index) => (
+                <Skeleton key={index} isLoaded={!isLoading}>
+                  <InvestmentCard investment={investmentDetails} />
+                </Skeleton>
+              ))
+            )}
           </TabPanel>
         </TabPanels>
       </Tabs>
diff --git a/src/Pages/Investor_Management/InvestorDetails.jsx b/src/Pages/Investor_Management/InvestorDetails.jsx
index 8b0eb35..7cbf8e5 100644
--- a/src/Pages/Investor_Management/InvestorDetails.jsx
+++ b/src/Pages/Investor_Management/InvestorDetails.jsx
@@ -141,38 +141,9 @@ const InvestorDetails = () => {
     // ),
 
     Action: (
-      <Box w={"auto"} isTruncated={true}>
-        <span className="d-flex justify-content-between align-items-center">
-          <Text as={"span"} color={"gray.600"} className=" fw-bold">
-            {/* {formatDate(item.createdAt)} */}
-            {item.Action}
-          </Text>
-          <Menu>
-            <MenuButton className="link p-1 rounded-1">
-              <HiDotsVertical className="rubix-text-dark fs-6" />
-            </MenuButton>
-            <Portal>
-              <MenuList minWidth="80px">
-                <RouterLink to={`edit-sponser/${item.id}`}>
-                  <MenuItem className="web-text-medium">Edit</MenuItem>
-                </RouterLink>
-                <RouterLink to={`view-sponser/${item.id}`}>
-                  <MenuItem className="web-text-medium">View</MenuItem>
-                </RouterLink>
-                <MenuItem
-                  onClick={() => {
-                    setActionId(item?.id);
-                    setDeleteAlert(true);
-                  }}
-                  className="web-text-medium"
-                >
-                  Delete
-                </MenuItem>
-              </MenuList>
-            </Portal>
-          </Menu>
-        </span>
-      </Box>
+          <Button colorScheme="green" size={"xs"} variant={"ghost"}>
+        Distribute
+       </Button>
     ),
   }));