From 4c1476032d38be2aca366ab534f16a51c07907be Mon Sep 17 00:00:00 2001
From: balibabu <cike8899@users.noreply.github.com>
Date: Mon, 29 Apr 2024 18:22:17 +0800
Subject: [PATCH] fix: omit long file names (#608)

### What problem does this PR solve?

#607
fix: omit long file names
fix: change the parsing method from tag to select
fix: replace icon for new chat
fix: change the OK button text of the Chat Bot API modal to close


### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)
---
 .../components/chunk-method-modal/hooks.ts    |  6 ++--
 .../components/chunk-method-modal/index.less  |  4 +++
 .../components/chunk-method-modal/index.tsx   | 27 +++++---------
 web/src/locales/en.ts                         |  1 +
 web/src/locales/zh-traditional.ts             |  1 +
 web/src/locales/zh.ts                         |  1 +
 .../components/knowledge-file/index.less      |  6 +++-
 .../components/knowledge-file/index.tsx       | 10 ++++--
 .../components/knowledge-file/model.ts        |  8 ++++-
 .../parsing-action-cell/index.tsx             | 36 ++++++++++---------
 .../pages/chat/chat-overview-modal/index.tsx  |  1 +
 web/src/pages/chat/index.tsx                  |  7 ++--
 12 files changed, 63 insertions(+), 45 deletions(-)

diff --git a/web/src/components/chunk-method-modal/hooks.ts b/web/src/components/chunk-method-modal/hooks.ts
index 8f605ba55..27e5a903b 100644
--- a/web/src/components/chunk-method-modal/hooks.ts
+++ b/web/src/components/chunk-method-modal/hooks.ts
@@ -74,9 +74,9 @@ export const useFetchParserListOnMount = (
     setSelectedTag(parserId);
   }, [parserId, documentId]);
 
-  const handleChange = (tag: string, checked: boolean) => {
-    const nextSelectedTag = checked ? tag : selectedTag;
-    setSelectedTag(nextSelectedTag);
+  const handleChange = (tag: string) => {
+    // const nextSelectedTag = checked ? tag : selectedTag;
+    setSelectedTag(tag);
   };
 
   return { parserList: nextParserList, handleChange, selectedTag };
diff --git a/web/src/components/chunk-method-modal/index.less b/web/src/components/chunk-method-modal/index.less
index 8123b026c..ec79449bf 100644
--- a/web/src/components/chunk-method-modal/index.less
+++ b/web/src/components/chunk-method-modal/index.less
@@ -8,3 +8,7 @@
   cursor: help;
   writing-mode: horizontal-tb;
 }
+
+.chunkMethod {
+  margin-bottom: 0;
+}
diff --git a/web/src/components/chunk-method-modal/index.tsx b/web/src/components/chunk-method-modal/index.tsx
index 7f592b546..7490b9b5d 100644
--- a/web/src/components/chunk-method-modal/index.tsx
+++ b/web/src/components/chunk-method-modal/index.tsx
@@ -13,9 +13,9 @@ import {
   Form,
   InputNumber,
   Modal,
+  Select,
   Space,
   Switch,
-  Tag,
   Tooltip,
 } from 'antd';
 import omit from 'lodash/omit';
@@ -25,8 +25,6 @@ import { useFetchParserListOnMount } from './hooks';
 import { useTranslate } from '@/hooks/commonHooks';
 import styles from './index.less';
 
-const { CheckableTag } = Tag;
-
 interface IProps extends Omit<IModalManagerChildrenProps, 'showModal'> {
   loading: boolean;
   onOk: (
@@ -113,21 +111,14 @@ const ChunkMethodModal: React.FC<IProps> = ({
       afterClose={afterClose}
     >
       <Space size={[0, 8]} wrap>
-        <div className={styles.tags}>
-          {parserList.map((x) => {
-            return (
-              <CheckableTag
-                key={x.value}
-                checked={selectedTag === x.value}
-                onChange={(checked) => {
-                  handleChange(x.value, checked);
-                }}
-              >
-                {x.label}
-              </CheckableTag>
-            );
-          })}
-        </div>
+        <Form.Item label={t('chunkMethod')} className={styles.chunkMethod}>
+          <Select
+            style={{ width: 120 }}
+            onChange={handleChange}
+            value={selectedTag}
+            options={parserList}
+          />
+        </Form.Item>
       </Space>
       {hideDivider || <Divider></Divider>}
       <Form name="dynamic_form_nest_item" autoComplete="off" form={form}>
diff --git a/web/src/locales/en.ts b/web/src/locales/en.ts
index 31da8897f..8d824ab56 100644
--- a/web/src/locales/en.ts
+++ b/web/src/locales/en.ts
@@ -24,6 +24,7 @@ export default {
       copied: 'Copied',
       comingSoon: 'Coming Soon',
       download: 'Download',
+      close: 'Close',
     },
     login: {
       login: 'Sign in',
diff --git a/web/src/locales/zh-traditional.ts b/web/src/locales/zh-traditional.ts
index 133dd301f..467afb754 100644
--- a/web/src/locales/zh-traditional.ts
+++ b/web/src/locales/zh-traditional.ts
@@ -24,6 +24,7 @@ export default {
       copied: '複製成功',
       comingSoon: '即將推出',
       download: '下載',
+      close: '关闭',
     },
     login: {
       login: '登入',
diff --git a/web/src/locales/zh.ts b/web/src/locales/zh.ts
index 264555392..1a44c34cf 100644
--- a/web/src/locales/zh.ts
+++ b/web/src/locales/zh.ts
@@ -24,6 +24,7 @@ export default {
       copied: '复制成功',
       comingSoon: '即将推出',
       download: '下载',
+      close: '关闭',
     },
     login: {
       login: '登录',
diff --git a/web/src/pages/add-knowledge/components/knowledge-file/index.less b/web/src/pages/add-knowledge/components/knowledge-file/index.less
index fa7139c05..6440b2ea3 100644
--- a/web/src/pages/add-knowledge/components/knowledge-file/index.less
+++ b/web/src/pages/add-knowledge/components/knowledge-file/index.less
@@ -28,7 +28,7 @@
   min-width: 200px;
 }
 
-.tochunks {
+.toChunks {
   cursor: pointer;
 }
 
@@ -42,3 +42,7 @@
   cursor: help;
   writing-mode: horizontal-tb;
 }
+
+.nameText {
+  color: #1677ff;
+}
diff --git a/web/src/pages/add-knowledge/components/knowledge-file/index.tsx b/web/src/pages/add-knowledge/components/knowledge-file/index.tsx
index b69ea3833..4b8b7b3c1 100644
--- a/web/src/pages/add-knowledge/components/knowledge-file/index.tsx
+++ b/web/src/pages/add-knowledge/components/knowledge-file/index.tsx
@@ -8,7 +8,7 @@ import { useSetSelectedRecord } from '@/hooks/logicHooks';
 import { useSelectParserList } from '@/hooks/userSettingHook';
 import { IKnowledgeFile } from '@/interfaces/database/knowledge';
 import { getExtension } from '@/utils/documentUtils';
-import { Divider, Flex, Switch, Table } from 'antd';
+import { Divider, Flex, Switch, Table, Typography } from 'antd';
 import type { ColumnsType } from 'antd/es/table';
 import { useTranslation } from 'react-i18next';
 import CreateFileModal from './create-file-modal';
@@ -31,6 +31,8 @@ import FileUploadModal from '@/components/file-upload-modal';
 import { formatDate } from '@/utils/date';
 import styles from './index.less';
 
+const { Text } = Typography;
+
 const KnowledgeFile = () => {
   const data = useSelectDocumentList();
   const { fetchDocumentList } = useFetchDocumentListOnMount();
@@ -80,7 +82,7 @@ const KnowledgeFile = () => {
       key: 'name',
       fixed: 'left',
       render: (text: any, { id, thumbnail, name }) => (
-        <div className={styles.tochunks} onClick={() => toChunk(id)}>
+        <div className={styles.toChunks} onClick={() => toChunk(id)}>
           <Flex gap={10} align="center">
             {thumbnail ? (
               <img className={styles.img} src={thumbnail} alt="" />
@@ -90,7 +92,9 @@ const KnowledgeFile = () => {
                 width={24}
               ></SvgIcon>
             )}
-            {text}
+            <Text ellipsis={{ tooltip: text }} className={styles.nameText}>
+              {text}
+            </Text>
           </Flex>
         </div>
       ),
diff --git a/web/src/pages/add-knowledge/components/knowledge-file/model.ts b/web/src/pages/add-knowledge/components/knowledge-file/model.ts
index c06920b35..743fd58ef 100644
--- a/web/src/pages/add-knowledge/components/knowledge-file/model.ts
+++ b/web/src/pages/add-knowledge/components/knowledge-file/model.ts
@@ -218,7 +218,13 @@ const model: DvaModel<KFModelState> = {
       });
 
       const { data } = yield call(kbService.document_upload, formData);
-      if (data.retcode === 0 || data.retcode === 500) {
+
+      const succeed = data.retcode === 0;
+
+      if (succeed) {
+        message.success(i18n.t('message.uploaded'));
+      }
+      if (succeed || data.retcode === 500) {
         yield put({
           type: 'getKfList',
           payload: { kb_id: payload.kb_id },
diff --git a/web/src/pages/add-knowledge/components/knowledge-file/parsing-action-cell/index.tsx b/web/src/pages/add-knowledge/components/knowledge-file/parsing-action-cell/index.tsx
index c50a6931b..7e8a700dd 100644
--- a/web/src/pages/add-knowledge/components/knowledge-file/parsing-action-cell/index.tsx
+++ b/web/src/pages/add-knowledge/components/knowledge-file/parsing-action-cell/index.tsx
@@ -93,22 +93,26 @@ const ParsingActionCell = ({
           <EditOutlined size={20} />
         </Button>
       </Tooltip>
-      <Button
-        type="text"
-        disabled={isRunning}
-        onClick={onRmDocument}
-        className={styles.iconButton}
-      >
-        <DeleteOutlined size={20} />
-      </Button>
-      <Button
-        type="text"
-        disabled={isRunning}
-        onClick={onDownloadDocument}
-        className={styles.iconButton}
-      >
-        <DownloadOutlined size={20} />
-      </Button>
+      <Tooltip title={t('delete', { keyPrefix: 'common' })}>
+        <Button
+          type="text"
+          disabled={isRunning}
+          onClick={onRmDocument}
+          className={styles.iconButton}
+        >
+          <DeleteOutlined size={20} />
+        </Button>
+      </Tooltip>
+      <Tooltip title={t('download', { keyPrefix: 'common' })}>
+        <Button
+          type="text"
+          disabled={isRunning}
+          onClick={onDownloadDocument}
+          className={styles.iconButton}
+        >
+          <DownloadOutlined size={20} />
+        </Button>
+      </Tooltip>
     </Space>
   );
 };
diff --git a/web/src/pages/chat/chat-overview-modal/index.tsx b/web/src/pages/chat/chat-overview-modal/index.tsx
index 21856bd7b..2c392e51b 100644
--- a/web/src/pages/chat/chat-overview-modal/index.tsx
+++ b/web/src/pages/chat/chat-overview-modal/index.tsx
@@ -73,6 +73,7 @@ const ChatOverviewModal = ({
         cancelButtonProps={{ style: { display: 'none' } }}
         onOk={hideModal}
         width={'100vw'}
+        okText={t('close', { keyPrefix: 'common' })}
       >
         <Flex vertical gap={'middle'}>
           <Card title={t('backendServiceApi')}>
diff --git a/web/src/pages/chat/index.tsx b/web/src/pages/chat/index.tsx
index a6499d53d..14557e25c 100644
--- a/web/src/pages/chat/index.tsx
+++ b/web/src/pages/chat/index.tsx
@@ -4,7 +4,7 @@ import {
   CloudOutlined,
   DeleteOutlined,
   EditOutlined,
-  FormOutlined,
+  PlusOutlined,
 } from '@ant-design/icons';
 import {
   Avatar,
@@ -157,7 +157,7 @@ const Chat = () => {
       onClick: handleCreateTemporaryConversation,
       label: (
         <Space>
-          <EditOutlined />
+          <PlusOutlined />
           {t('newChat')}
         </Space>
       ),
@@ -293,7 +293,8 @@ const Chat = () => {
               <Tag>{conversationList.length}</Tag>
             </Space>
             <Dropdown menu={{ items }}>
-              <FormOutlined />
+              {/* <FormOutlined /> */}
+              <PlusOutlined />
             </Dropdown>
           </Flex>
           <Divider></Divider>