feat: prevent the user from entering the knowledge base if he is not logged in (#45)

web/src/layouts/index.tsx

@@ -1,22 +1,18 @@
+import logo from '@/assets/logo.png';
+import { Layout, Space, theme } from 'antd';
+import classnames from 'classnames';
 import React, { useEffect, useState } from 'react';
-import { history, Outlet, useLocation, useNavigate } from 'umi';
-import { useTranslation, Trans } from 'react-i18next'
-import classnames from 'classnames'
+import { useTranslation } from 'react-i18next';
+import { Outlet, useLocation, useNavigate } from 'umi';
 import '../locales/config';
-import logo from '@/assets/logo.png'
-import {
-  RedditOutlined
-} from '@ant-design/icons';
-import { Layout, Button, theme, Space, } from 'antd';
-import styles from './index.less'
-import User from './components/user'
-import { head } from 'lodash';
+import User from './components/user';
+import styles from './index.less';
 
 const { Header, Content } = Layout;
 
 const App: React.FC = (props) => {
-  const { t } = useTranslation()
-  const navigate = useNavigate()
+  const { t } = useTranslation();
+  const navigate = useNavigate();
   const {
     token: { colorBgContainer, borderRadiusLG },
   } = theme.useToken();
@@ -25,34 +21,49 @@ const App: React.FC = (props) => {
   const location = useLocation();
   useEffect(() => {
     if (location.pathname !== '/') {
-      const path = location.pathname.split('/')
-      setCurrent(path[1]);
+      const path = location.pathname.split('/');
+      // setCurrent(path[1]);
     }
-    console.log(location.pathname.split('/'))
-  }, [location.pathname])
+    console.log(location.pathname.split('/'));
+  }, [location.pathname]);
 
   const handleChange = (path: string) => {
-    setCurrent(path)
+    // setCurrent(path)
     navigate(path);
   };
-  const tagsData = [{ path: '/knowledge', name: 'knowledge' }, { path: '/chat', name: 'chat' }, { path: '/file', name: 'file' }];
+  const tagsData = [
+    { path: '/knowledge', name: 'knowledge' },
+    { path: '/chat', name: 'chat' },
+    { path: '/file', name: 'file' },
+  ];
 
   return (
-    <Layout className={styles.layout} >
+    <Layout className={styles.layout}>
       <Layout>
-        <Header style={{ padding: '0 8px', background: colorBgContainer, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
-
+        <Header
+          style={{
+            padding: '0 8px',
+            background: colorBgContainer,
+            display: 'flex',
+            justifyContent: 'space-between',
+            alignItems: 'center',
+          }}
+        >
           <img src={logo} alt="" style={{ height: 30, width: 30 }} />
           <Space size={[0, 8]} wrap>
-            {tagsData.map((item) =>
-            (<span key={item.name} className={classnames(styles['tag'], {
-              [styles['checked']]: current === item.name
-            })} onClick={() => handleChange(item.path)}>
-              {item.name}
-            </span>)
-            )}
+            {tagsData.map((item) => (
+              <span
+                key={item.name}
+                className={classnames(styles['tag'], {
+                  [styles['checked']]: current === item.name,
+                })}
+                onClick={() => handleChange(item.path)}
+              >
+                {item.name}
+              </span>
+            ))}
           </Space>
-          <User ></User>
+          <User></User>
         </Header>
         <Content
           style={{
@@ -61,14 +72,14 @@ const App: React.FC = (props) => {
             minHeight: 280,
             background: colorBgContainer,
             borderRadius: borderRadiusLG,
-            overflow: 'auto'
+            overflow: 'auto',
           }}
         >
           <Outlet />
         </Content>
       </Layout>
-    </Layout >
+    </Layout>
   );
 };
 
-export default App;
+export default App;