feat(navBar): add MyDataIcon component and update navigation item

Author: ErwanDecoster

src/components/icons/MyDataIcon.tsx

@@ -0,0 +1,41 @@
+const MyDataIcon = ({ size = 20, className = '' }) => (
+  <svg
+    width={size}
+    height={size}
+    viewBox="0 0 20 21"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    className={className}
+  >
+    <path
+      d="M8.1599 1.88916H3.0399C2.68644 1.88916 2.3999 2.6055 2.3999 3.48916V6.68916C2.3999 7.57281 2.68644 8.28916 3.0399 8.28916H8.1599C8.51336 8.28916 8.7999 7.57281 8.7999 6.68916V3.48916C8.7999 2.6055 8.51336 1.88916 8.1599 1.88916Z"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+    <path
+      d="M17.76 1.88916H12.64C12.2865 1.88916 12 2.6055 12 3.48916V6.68916C12 7.57281 12.2865 8.28916 12.64 8.28916H17.76C18.1135 8.28916 18.4 7.57281 18.4 6.68916V3.48916C18.4 2.6055 18.1135 1.88916 17.76 1.88916Z"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+    <path
+      d="M8.1599 11.4893H3.0399C2.68644 11.4893 2.3999 12.2056 2.3999 13.0893V16.2893C2.3999 17.1729 2.68644 17.8893 3.0399 17.8893H8.1599C8.51336 17.8893 8.7999 17.1729 8.7999 16.2893V13.0893C8.7999 12.2056 8.51336 11.4893 8.1599 11.4893Z"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+    <path
+      d="M17.76 11.4893H12.64C12.2865 11.4893 12 12.2056 12 13.0893V16.2893C12 17.1729 12.2865 17.8893 12.64 17.8893H17.76C18.1135 17.8893 18.4 17.1729 18.4 16.2893V13.0893C18.4 12.2056 18.1135 11.4893 17.76 11.4893Z"
+      stroke="currentColor"
+      strokeWidth="2"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+    />
+  </svg>
+);
+
+export default MyDataIcon;

src/components/navBar/navigationItems.tsx

@@ -1,48 +1,12 @@
 import { MessageSquare } from 'react-feather';
+import MyDataIcon from '../icons/MyDataIcon';
 
 // navigationItems.js
 export const navigationItems = [
   {
     name: 'My data',
     path: '/my-data',
-    icon: (
-      <svg
-        width="20"
-        height="21"
-        viewBox="0 0 20 21"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <path
-          d="M8.1599 1.88916H3.0399C2.68644 1.88916 2.3999 2.6055 2.3999 3.48916V6.68916C2.3999 7.57281 2.68644 8.28916 3.0399 8.28916H8.1599C8.51336 8.28916 8.7999 7.57281 8.7999 6.68916V3.48916C8.7999 2.6055 8.51336 1.88916 8.1599 1.88916Z"
-          stroke="currentColor"
-          strokeWidth="2"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        />
-        <path
-          d="M17.76 1.88916H12.64C12.2865 1.88916 12 2.6055 12 3.48916V6.68916C12 7.57281 12.2865 8.28916 12.64 8.28916H17.76C18.1135 8.28916 18.4 7.57281 18.4 6.68916V3.48916C18.4 2.6055 18.1135 1.88916 17.76 1.88916Z"
-          stroke="currentColor"
-          strokeWidth="2"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        />
-        <path
-          d="M8.1599 11.4893H3.0399C2.68644 11.4893 2.3999 12.2056 2.3999 13.0893V16.2893C2.3999 17.1729 2.68644 17.8893 3.0399 17.8893H8.1599C8.51336 17.8893 8.7999 17.1729 8.7999 16.2893V13.0893C8.7999 12.2056 8.51336 11.4893 8.1599 11.4893Z"
-          stroke="currentColor"
-          strokeWidth="2"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        />
-        <path
-          d="M17.76 11.4893H12.64C12.2865 11.4893 12 12.2056 12 13.0893V16.2893C12 17.1729 12.2865 17.8893 12.64 17.8893H17.76C18.1135 17.8893 18.4 17.1729 18.4 16.2893V13.0893C18.4 12.2056 18.1135 11.4893 17.76 11.4893Z"
-          stroke="currentColor"
-          strokeWidth="2"
-          strokeLinecap="round"
-          strokeLinejoin="round"
-        />
-      </svg>
-    ),
+    icon: <MyDataIcon />,
   },
   {
     name: 'Send Messages',