feat: add UserSetting and set height of MoreIcon to 24px and replace logo (#111)

* feat: replace logo

* feat: set height of MoreIcon to 24px

* feat: add UserSetting

web/src/pages/user-setting/sidebar/index.tsx

@@ -0,0 +1,57 @@
+import { useSecondPathName } from '@/hooks/routeHook';
+import type { MenuProps } from 'antd';
+import { Menu } from 'antd';
+import React, { useMemo } from 'react';
+import { useNavigate } from 'umi';
+import {
+  UserSettingBaseKey,
+  UserSettingIconMap,
+  UserSettingRouteKey,
+  UserSettingRouteMap,
+} from '../constants';
+
+type MenuItem = Required<MenuProps>['items'][number];
+
+function getItem(
+  label: React.ReactNode,
+  key: React.Key,
+  icon?: React.ReactNode,
+  children?: MenuItem[],
+  type?: 'group',
+): MenuItem {
+  return {
+    key,
+    icon,
+    children,
+    label,
+    type,
+  } as MenuItem;
+}
+
+const items: MenuItem[] = Object.values(UserSettingRouteKey).map((value) =>
+  getItem(UserSettingRouteMap[value], value, UserSettingIconMap[value]),
+);
+
+const SideBar = () => {
+  const navigate = useNavigate();
+  const pathName = useSecondPathName();
+
+  const handleMenuClick: MenuProps['onClick'] = ({ key }) => {
+    navigate(`/${UserSettingBaseKey}/${key}`);
+  };
+
+  const selectedKeys = useMemo(() => {
+    return [pathName];
+  }, [pathName]);
+
+  return (
+    <Menu
+      selectedKeys={selectedKeys}
+      mode="inline"
+      items={items}
+      onClick={handleMenuClick}
+    />
+  );
+};
+
+export default SideBar;