Manage Profile Pages

client/src/components/profile-sidebar/profile-sidebar.component.jsx

@@ -0,0 +1,34 @@
+import React from "react";
+import { useTranslation } from "react-i18next";
+import { Layout, Menu, Icon } from "antd";
+
+export default function ProfileSideBar({
+  sidebarSelection,
+  setSidebarSelection
+}) {
+  const { t } = useTranslation();
+
+  const onMenuClick = e => {
+    setSidebarSelection({ ...sidebarSelection, key: e.key });
+  };
+
+  return (
+    <Layout.Sider>
+      <Menu
+        theme="dark"
+        selectedKeys={sidebarSelection.key}
+        onClick={onMenuClick}
+        mode="inline"
+      >
+        <Menu.Item key="profile">
+          <Icon type="user" />
+          <span>{t("menus.profilesidebar.profile")}</span>
+        </Menu.Item>
+        <Menu.Item key="shops">
+          <Icon type="bank" />
+          <span>{t("menus.profilesidebar.shops")}</span>
+        </Menu.Item>
+      </Menu>
+    </Layout.Sider>
+  );
+}