feat: add MainLayout with sidebar

client/src/components/SiderMenu.tsx

@@ -0,0 +1,61 @@
+import { Menu, MenuProps } from 'antd';
+
+type MenuItem = Required<MenuProps>['items'][number];
+
+function getItem(
+  label: React.ReactNode,
+  key: React.Key,
+  icon?: React.ReactNode,
+  children?: MenuItem[]
+): MenuItem {
+  return {
+    key,
+    icon,
+    children,
+    label,
+  } as MenuItem;
+}
+
+const sidebarItems: MenuItem[] = [
+  getItem('VORKOUT', '0', <img src="./icons/sider/menu.svg" alt="toggle" />),
+  getItem(
+    'Схемы процессов',
+    '1',
+    <img src="./icons/sider/process-diagram.svg" alt="process diagram" />
+  ),
+  getItem(
+    'Запущенные процессы',
+    '2',
+    <img src="./icons/sider/running-processes.svg" alt="running processes" />
+  ),
+  getItem(
+    'Настройки',
+    'sub1',
+    <img src="./icons/sider/settings.svg" alt="settings" />,
+    [
+      getItem('Учетные записи', '3'),
+      getItem('Справичник событий', '4'),
+      getItem('Конфигурация', '5'),
+    ]
+  ),
+];
+
+interface SiderMenuProps {
+  selectedKey: string;
+  hangleMenuClick: (e: any) => void;
+}
+
+export default function SiderMenu({
+  selectedKey,
+  hangleMenuClick,
+}: SiderMenuProps) {
+  return (
+    <Menu
+      theme="light"
+      selectedKeys={[selectedKey]}
+      mode="inline"
+      items={sidebarItems}
+      onClick={hangleMenuClick}
+    />
+  );
+}