Table mod 🎨

src/Pages/Investor_Management/InvestorDetails/BankDetails.jsx

@@ -67,7 +67,7 @@ const BankDetails = () => {
   console.log(data?.data?.bank_details);
 
   const filteredData = data?.data?.bank_details?.filter((item) => {
-    const name = item.accountNumber;
+    const name = item.bankNickName;
     const searchLower = searchTerm.toLowerCase();
     const nameMatches = name.toLowerCase().includes(searchLower);
 
@@ -78,7 +78,7 @@ const BankDetails = () => {
 
   const tableHeadRow = [
     "Sr No",
-    "bankNickName",
+    "Bank Nick Name",
     "IBAN",
     "Account No",
     "Bank Name",
@@ -100,7 +100,7 @@ const BankDetails = () => {
         {generateSerialNumber(idx, currentPage, pageSize)}
       </Text>
     ),
-    "bankNickName": (
+    "Bank Nick Name": (
       <Text
         justifyContent={slideFromRight ? "right" : "left"}
         as={"span"}
@@ -133,7 +133,7 @@ const BankDetails = () => {
         isTruncated={true}
         className="d-flex align-items-center web-text-small"
       >
-        {item.accountName}
+        {item.accountNumber}
       </Text>
     ),
     "Bank Name": (
@@ -157,7 +157,7 @@ const BankDetails = () => {
         isTruncated={true}
         className="d-flex align-items-center web-text-small"
       >
-        {item.accountNumber}
+        {item.accountName}
       </Text>
     ),
     "Bank Address": (
@@ -202,7 +202,9 @@ const BankDetails = () => {
 
   return (
     <Box {...OPACITY_ON_LOAD} overflowY={"scroll"} height={"100vh"} pb={38}>
-      <Box bg="white.500">
+      <HStack>
+        <Text as={'span'} fontSize={'sm'} fontWeight={700}>Bank Deatils</Text>
+      </HStack>
         <HStack
           display={"flex"}
           justifyContent={"space-between"}
@@ -225,7 +227,6 @@ const BankDetails = () => {
             onChange={(e) => setSearchTerm(e.target.value)}
           />
         </HStack>
-      </Box>
 
       {/* ======================== [Data Table] ======================= */}
 

src/Pages/Investor_Management/InvestorDetails/ProfileView.jsx

@@ -1,6 +1,7 @@
 import {
   Badge,
   Box,
+  Divider,
   Icon,
   Tab,
   TabList,
@@ -336,6 +337,7 @@ const ProfileView = () => {
         <TabPanels>
           <TabPanel>
             <FormInputView width={"32%"} groupedFields={groupedFields} />
+            <Divider/>
             <BankDetails />
           </TabPanel>
           <TabPanel>