fix left sidebar

src/partials/digitalId/ProfileTable.jsx

@@ -1,12 +1,9 @@
 import React, {useState, useEffect} from 'react';
 import ProfileTableItem from './ProfileTableItem';
-import ProfileIcon from '../../images/profile-icon.svg';
-import Avatar01 from '../../images/avatar-01.jpg';
-import Avatar02 from '../../images/avatar-02.jpg';
-import Avatar03 from '../../images/avatar-03.jpg';
 
 function ProfileTable({
-  selectedItems
+  selectedItems,
+  userData
 }) {
 
   const [isCheck, setIsCheck] = useState([]);
@@ -24,143 +21,9 @@ function ProfileTable({
     }
   };
 
-  const userData = [
-    {
-      id: '0',
-      category: 'General',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: 'Dominik',
-      property: 'First name',
-      status: 'Completed',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: [Avatar01, Avatar02, Avatar03]
-    },
-    {
-      id: '1',
-      category: 'General',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: 'Lamakani',
-      property: 'Second name',
-      status: 'Progress',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: null
-    },
-    {
-      id: '2',
-      category: 'General',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: '05.10.1983',
-      property: 'Birthdate',
-      status: 'Incorrect',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: null
-    },
-    {
-      id: '3',
-      category: 'General',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: 'Male',
-      property: 'Gender',
-      status: 'Stored',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: null
-    },
-    {
-      id: '4',
-      category: 'Nationality',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: 'United Kindom',
-      property: 'Residence',
-      status: 'Completed',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: [Avatar01, Avatar02, Avatar03]
-    },
-    {
-      id: '5',
-      category: 'Nationality',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: 'Passport',
-      property: 'Document type',
-      status: 'Progress',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: [Avatar01, Avatar02, Avatar03]
-    },
-    {
-      id: '6',
-      category: 'Nationality',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: 'A123B3143',
-      property: 'Document ID',
-      status: 'Incorrect',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: null
-    },
-    {
-      id: '7',
-      category: 'Nationality',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: '05.10.2012',
-      property: 'Issue date',
-      status: 'Stored',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: null
-    },
-    {
-      id: '8',
-      category: 'Nationality',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: '05.10.2032',
-      property: 'Expiry date',
-      status: 'Stored',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: null
-    },
-    {
-      id: '9',
-      category: 'Social',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: '@lamakani',
-      property: 'Telegram',
-      status: 'Completed',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: null
-    },
-    {
-      id: '10',
-      category: 'Social',
-      validated: true,
-      blockchained: true,
-      image: ProfileIcon,
-      value: '@lamakani',
-      property: 'Telegram',
-      status: 'Progress',
-      transactions: ['0x7234ABC342342352345', '0x5745DEF342342352345'],
-      avatars: [Avatar01, Avatar02, Avatar03]
-    },
-  ]
-
   return (
     <>
+    {/* General */}
       <h2 className="grow text-base font-semibold text-slate-800 truncate mb-2.5 mt-8">General 🖋️</h2>
       <div className="overflow-x-auto w-[828px]">
         <table className="w-[828px] table-auto w-full">
@@ -186,7 +49,7 @@ function ProfileTable({
           </tbody>
         </table>
       </div>
-
+      {/* Nationality */}
       <h2 className="grow text-base font-semibold text-slate-800 truncate mb-2.5 mt-8">Nationality 🖋️</h2>
       <div className="overflow-x-auto w-[828px]">
         <table className="w-[828px] table-auto w-full">
@@ -212,7 +75,7 @@ function ProfileTable({
           </tbody>
         </table>
       </div>
-
+      {/* Social */}
       <h2 className="grow text-base font-semibold text-slate-800 truncate mb-2.5 mt-8">Social 🖋️</h2>
       <div className="overflow-x-auto w-[828px]">
         <table className="w-[828px] table-auto w-full">