feat: add files sidebar menu

src/renderer/src/App.tsx

@@ -9,6 +9,7 @@ import AntdProvider from './context/AntdProvider'
 import { ThemeProvider } from './context/ThemeProvider'
 import AgentsPage from './pages/agents/AgentsPage'
 import AppsPage from './pages/apps/AppsPage'
+import FilesPage from './pages/files/FilesPage'
 import HomePage from './pages/home/HomePage'
 import SettingsPage from './pages/settings/SettingsPage'
 import TranslatePage from './pages/translate/TranslatePage'
@@ -24,6 +25,7 @@ function App(): JSX.Element {
                 <Sidebar />
                 <Routes>
                   <Route path="/" element={<HomePage />} />
+                  <Route path="/files" element={<FilesPage />} />
                   <Route path="/agents" element={<AgentsPage />} />
                   <Route path="/translate" element={<TranslatePage />} />
                   <Route path="/apps" element={<AppsPage />} />

src/renderer/src/components/app/Sidebar.tsx

@@ -1,4 +1,4 @@
-import { TranslationOutlined } from '@ant-design/icons'
+import { FolderOutlined, TranslationOutlined } from '@ant-design/icons'
 import { isMac } from '@renderer/config/constant'
 import { isLocalAi, UserAvatar } from '@renderer/config/env'
 import useAvatar from '@renderer/hooks/useAvatar'
@@ -51,6 +51,11 @@ const Sidebar: FC = () => {
               <i className="iconfont icon-chat"></i>
             </Icon>
           </StyledLink>
+          <StyledLink onClick={() => to('/files')}>
+            <Icon className={isRoute('/files')}>
+              <FolderOutlined />
+            </Icon>
+          </StyledLink>
           <StyledLink onClick={() => to('/agents')}>
             <Icon className={isRoute('/agents')}>
               <i className="iconfont icon-business-smart-assistant"></i>

src/renderer/src/i18n/index.ts

@@ -102,6 +102,9 @@ const resources = {
         'message.new.context': 'New Context',
         'assistant.search.placeholder': 'Search'
       },
+      files: {
+        title: 'Files'
+      },
       agents: {
         title: 'Assistants',
         my_agents: 'My Assistants',
@@ -358,6 +361,9 @@ const resources = {
         'message.new.context': '清除上下文',
         'assistant.search.placeholder': '搜索'
       },
+      files: {
+        title: '文件'
+      },
       agents: {
         title: '智能体',
         my_agents: '我的智能体',

src/renderer/src/pages/files/FilesPage.tsx

@@ -0,0 +1,40 @@
+import { Navbar, NavbarCenter } from '@renderer/components/app/Navbar'
+import { Button } from 'antd'
+import { FC } from 'react'
+import { useTranslation } from 'react-i18next'
+import styled from 'styled-components'
+
+const FilesPage: FC = () => {
+  const { t } = useTranslation()
+
+  return (
+    <Container>
+      <Navbar>
+        <NavbarCenter style={{ borderRight: 'none' }}>{t('files.title')}</NavbarCenter>
+      </Navbar>
+      <ContentContainer>
+        <Button>添加文件</Button>
+      </ContentContainer>
+    </Container>
+  )
+}
+
+const Container = styled.div`
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  height: 100%;
+`
+
+const ContentContainer = styled.div`
+  display: flex;
+  flex: 1;
+  flex-direction: row;
+  justify-content: center;
+  height: 100%;
+  overflow-y: scroll;
+  background-color: var(--color-background);
+  padding: 20px;
+`
+
+export default FilesPage

src/renderer/src/pages/home/Inputbar/Inputbar.tsx

@@ -26,6 +26,7 @@ import { CSSProperties, FC, useCallback, useEffect, useMemo, useRef, useState }
 import { useTranslation } from 'react-i18next'
 import styled from 'styled-components'
 
+import AttachmentButton from './AttachmentButton'
 import SendMessageButton from './SendMessageButton'
 import TokenCount from './TokenCount'
 
@@ -260,7 +261,7 @@ const Inputbar: FC<Props> = ({ assistant, setActiveTopic }) => {
               <ControlOutlined />
             </ToolbarButton>
           </Tooltip>
-          {/* <AttachmentButton files={files} setFiles={setFiles} ToolbarButton={ToolbarButton} /> */}
+          <AttachmentButton files={files} setFiles={setFiles} ToolbarButton={ToolbarButton} />
           <Tooltip placement="top" title={expended ? t('chat.input.collapse') : t('chat.input.expand')} arrow>
             <ToolbarButton type="text" onClick={onToggleExpended}>
               {expended ? <FullscreenExitOutlined /> : <FullscreenOutlined />}