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/add-knowledge/constant.ts

@@ -4,7 +4,6 @@ export const routeMap = {
   [KnowledgeRouteKey.Dataset]: 'Dataset',
   [KnowledgeRouteKey.Testing]: 'Retrieval testing',
   [KnowledgeRouteKey.Configuration]: 'Configuration',
-  [KnowledgeRouteKey.TempTesting]: 'Testing',
 };
 
 export enum KnowledgeDatasetRouteKey {

web/src/pages/chat/chat-container/index.tsx

@@ -36,7 +36,7 @@ import styles from './index.less';
 
 const reg = /(#{2}\d+\${2})/g;
 
-const getChunkIndex = (match: string) => Number(match.slice(2, 3));
+const getChunkIndex = (match: string) => Number(match.slice(2, -2));
 
 const rehypeWrapReference = () => {
   return function wrapTextTransform(tree: any) {

web/src/pages/knowledge/knowledge-card/index.less

@@ -4,6 +4,10 @@
   flex-direction: column;
   justify-content: space-between;
 
+  .delete {
+    height: 24px;
+  }
+
   .content {
     display: flex;
     justify-content: space-between;

web/src/pages/knowledge/knowledge-card/index.tsx

@@ -64,17 +64,16 @@ const KnowledgeCard = ({ item }: IProps) => {
       <div className={styles.container}>
         <div className={styles.content}>
           <Avatar size={34} icon={<UserOutlined />} src={item.avatar} />
-
-          <span className={styles.delete}>
-            <Dropdown
-              menu={{
-                items,
-                onClick: handleDropdownMenuClick,
-              }}
-            >
+          <Dropdown
+            menu={{
+              items,
+              onClick: handleDropdownMenuClick,
+            }}
+          >
+            <span className={styles.delete}>
               <MoreIcon />
-            </Dropdown>
-          </span>
+            </span>
+          </Dropdown>
         </div>
         <div className={styles.titleWrapper}>
           <span className={styles.title}>{item.name}</span>

web/src/pages/user-setting/constants.tsx

@@ -0,0 +1,16 @@
+import { UserSettingRouteKey } from '@/constants/setting';
+import {
+  ContainerOutlined,
+  DesktopOutlined,
+  PieChartOutlined,
+} from '@ant-design/icons';
+
+export const UserSettingIconMap = {
+  [UserSettingRouteKey.Profile]: <PieChartOutlined />,
+  [UserSettingRouteKey.Password]: <DesktopOutlined />,
+  [UserSettingRouteKey.Model]: <ContainerOutlined />,
+  [UserSettingRouteKey.Team]: <ContainerOutlined />,
+  [UserSettingRouteKey.Logout]: <ContainerOutlined />,
+};
+
+export * from '@/constants/setting';

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

@@ -0,0 +1,14 @@
+import { Flex } from 'antd';
+import { Outlet } from 'umi';
+import SideBar from './sidebar';
+
+const UserSetting = () => {
+  return (
+    <Flex>
+      <SideBar></SideBar>
+      <Outlet></Outlet>
+    </Flex>
+  );
+};
+
+export default UserSetting;

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

@@ -0,0 +1,5 @@
+const UserSettingModel = () => {
+  return <div>UserSettingModel</div>;
+};
+
+export default UserSettingModel;

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

@@ -0,0 +1,5 @@
+const UserSettingPassword = () => {
+  return <div>UserSettingPassword</div>;
+};
+
+export default UserSettingPassword;

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

@@ -0,0 +1,5 @@
+const UserSettingProfile = () => {
+  return <div>UserSettingProfile</div>;
+};
+
+export default UserSettingProfile;

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

@@ -0,0 +1,5 @@
+const UserSettingTeam = () => {
+  return <div>UserSettingTeam</div>;
+};
+
+export default UserSettingTeam;

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;