remove showDeleteConfirm function and center the Empty of knowledge list and extract the text of the login page to en.json (#203)

feat: remove showDeleteConfirm function
feat: center the Empty of knowledge list
feat: extract the text of the login page to en.json
#204

web/src/pages/add-knowledge/components/knowledge-file/model.ts

@@ -203,7 +203,6 @@ const model: DvaModel<KFModelState> = {
       const documentId = payload;
       try {
         const ret = yield call(getDocumentFile, documentId);
-        console.info('fetch_document_file:', ret);
         return ret;
       } catch (error) {
         console.warn(error);
@@ -238,7 +237,6 @@ const model: DvaModel<KFModelState> = {
             payload: { current: 1, pageSize: 10 },
           });
         }
-        console.info(location);
       });
     },
   },

web/src/pages/add-knowledge/components/knowledge-file/parsing-action-cell/index.tsx

@@ -1,4 +1,4 @@
-import showDeleteConfirm from '@/components/deleting-confirm';
+import { useShowDeleteConfirm } from '@/hooks/commonHooks';
 import { useRemoveDocument } from '@/hooks/documentHooks';
 import { IKnowledgeFile } from '@/interfaces/database/knowledge';
 import { api_host } from '@/utils/api';
@@ -31,6 +31,7 @@ const ParsingActionCell = ({
   const isRunning = isParserRunning(record.run);
 
   const removeDocument = useRemoveDocument(documentId);
+  const showDeleteConfirm = useShowDeleteConfirm();
 
   const onRmDocument = () => {
     if (!isRunning) {

web/src/pages/chat/hooks.ts

@@ -1,7 +1,6 @@
-import showDeleteConfirm from '@/components/deleting-confirm';
 import { MessageType } from '@/constants/chat';
 import { fileIconMap } from '@/constants/common';
-import { useSetModalState } from '@/hooks/commonHooks';
+import { useSetModalState, useShowDeleteConfirm } from '@/hooks/commonHooks';
 import { useOneNamespaceEffectsLoading } from '@/hooks/storeHooks';
 import { IConversation, IDialog } from '@/interfaces/database/chat';
 import { IChunk } from '@/interfaces/database/knowledge';
@@ -150,6 +149,7 @@ export const useSelectPromptConfigParameters = (): VariableTableDataType[] => {
 
 export const useRemoveDialog = () => {
   const dispatch = useDispatch();
+  const showDeleteConfirm = useShowDeleteConfirm();
 
   const removeDocument = (dialogIds: Array<string>) => () => {
     return dispatch({
@@ -668,6 +668,7 @@ export const useRemoveConversation = () => {
   const dispatch = useDispatch();
   const { dialogId } = useGetChatSearchParams();
   const { handleClickConversation } = useClickConversationCard();
+  const showDeleteConfirm = useShowDeleteConfirm();
 
   const removeConversation = (conversationIds: Array<string>) => async () => {
     const ret = await dispatch<any>({

web/src/pages/knowledge/index.less

@@ -44,4 +44,7 @@
 .knowledgeCardContainer {
   padding: 0 60px;
   overflow: auto;
+  .knowledgeEmpty {
+    width: 100%;
+  }
 }

web/src/pages/knowledge/index.tsx

@@ -6,22 +6,22 @@ import { Button, Empty, Flex, Space, Spin } from 'antd';
 import KnowledgeCard from './knowledge-card';
 import KnowledgeCreatingModal from './knowledge-creating-modal';
 
+import { useTranslation } from 'react-i18next';
 import styles from './index.less';
 
 const Knowledge = () => {
   const { list, loading } = useFetchKnowledgeList();
   const userInfo = useSelectUserInfo();
+  const { t } = useTranslation('translation', { keyPrefix: 'knowledgeList' });
 
   return (
     <Flex className={styles.knowledge} vertical flex={1}>
       <div className={styles.topWrapper}>
         <div>
           <span className={styles.title}>
-            Welcome back, {userInfo.nickname}
+            {t('welcome')}, {userInfo.nickname}
           </span>
-          <p className={styles.description}>
-            Which database are we going to use today?
-          </p>
+          <p className={styles.description}>{t('description')}</p>
         </div>
         <Space size={'large'}>
           {/* <Button icon={<FilterIcon />} className={styles.filterButton}>
@@ -38,7 +38,7 @@ const Knowledge = () => {
                   }}
                   className={styles.topButton}
                 >
-                  Create knowledge base
+                  {t('createKnowledgeBase')}
                 </Button>
                 <KnowledgeCreatingModal
                   visible={visible}
@@ -62,7 +62,7 @@ const Knowledge = () => {
               );
             })
           ) : (
-            <Empty></Empty>
+            <Empty className={styles.knowledgeEmpty}></Empty>
           )}
         </Flex>
       </Spin>

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

@@ -1,5 +1,6 @@
 import { ReactComponent as MoreIcon } from '@/assets/svg/more.svg';
 import { KnowledgeRouteKey } from '@/constants/knowledge';
+import { useShowDeleteConfirm } from '@/hooks/commonHooks';
 import { IKnowledge } from '@/interfaces/database/knowledge';
 import { formatDate } from '@/utils/date';
 import {
@@ -11,7 +12,6 @@ import {
 import { Avatar, Card, Dropdown, MenuProps, Space } from 'antd';
 import { useDispatch, useNavigate } from 'umi';
 
-import showDeleteConfirm from '@/components/deleting-confirm';
 import styles from './index.less';
 
 interface IProps {
@@ -21,6 +21,7 @@ interface IProps {
 const KnowledgeCard = ({ item }: IProps) => {
   const navigate = useNavigate();
   const dispatch = useDispatch();
+  const showDeleteConfirm = useShowDeleteConfirm();
 
   const removeKnowledge = () => {
     return dispatch({

web/src/pages/knowledge/knowledge-creating-modal/index.tsx

@@ -1,6 +1,7 @@
 import { IModalManagerChildrenProps } from '@/components/modal-manager';
 import { KnowledgeRouteKey } from '@/constants/knowledge';
 import { Form, Input, Modal } from 'antd';
+import { useTranslation } from 'react-i18next';
 import { useDispatch, useNavigate, useSelector } from 'umi';
 
 type FieldType = {
@@ -17,6 +18,7 @@ const KnowledgeCreatingModal = ({
     (state: any) => state.loading.effects['kSModel/createKb'],
   );
   const navigate = useNavigate();
+  const { t } = useTranslation('translation', { keyPrefix: 'knowledgeList' });
 
   const handleOk = async () => {
     const ret = await form.validateFields();
@@ -50,7 +52,7 @@ const KnowledgeCreatingModal = ({
 
   return (
     <Modal
-      title="Create knowledge base"
+      title={t('createKnowledgeBase')}
       open={visible}
       onOk={handleOk}
       onCancel={handleCancel}
@@ -67,11 +69,11 @@ const KnowledgeCreatingModal = ({
         form={form}
       >
         <Form.Item<FieldType>
-          label="Name"
+          label={t('name')}
           name="name"
-          rules={[{ required: true, message: 'Please input name!' }]}
+          rules={[{ required: true, message: t('namePlaceholder') }]}
         >
-          <Input />
+          <Input placeholder={t('namePlaceholder')} />
         </Form.Item>
       </Form>
     </Modal>

web/src/pages/login/index.tsx

@@ -1,3 +1,4 @@
+import { useLogin, useRegister } from '@/hooks/loginHooks';
 import { useOneNamespaceEffectsLoading } from '@/hooks/storeHooks';
 import { rsaPsw } from '@/utils';
 import { Button, Checkbox, Form, Input } from 'antd';
@@ -6,7 +7,6 @@ import { useTranslation } from 'react-i18next';
 import { Icon, useNavigate } from 'umi';
 import RightPanel from './right-panel';
 
-import { useLogin, useRegister } from '@/hooks/loginHooks';
 import styles from './index.less';
 
 const Login = () => {
@@ -14,7 +14,7 @@ const Login = () => {
   const navigate = useNavigate();
   const login = useLogin();
   const register = useRegister();
-  const { t } = useTranslation();
+  const { t } = useTranslation('translation', { keyPrefix: 'login' });
 
   // TODO: When the server address request is not accessible, the value of dva-loading always remains true.
 
@@ -75,13 +75,11 @@ const Login = () => {
       <div className={styles.loginLeft}>
         <div className={styles.leftContainer}>
           <div className={styles.loginTitle}>
-            <div>
-              {title === 'login' ? t('login.login') : 'Create an account'}
-            </div>
+            <div>{title === 'login' ? t('login') : 'Create an account'}</div>
             <span>
               {title === 'login'
-                ? 'We’re so excited to see you again!'
-                : 'Glad to have you on board!'}
+                ? t('loginDescription')
+                : t('registerDescription')}
             </span>
           </div>
 
@@ -94,55 +92,52 @@ const Login = () => {
             <Form.Item
               {...formItemLayout}
               name="email"
-              label="Email"
-              rules={[{ required: true, message: 'Please input value' }]}
+              label={t('emailLabel')}
+              rules={[{ required: true, message: t('emailPlaceholder') }]}
             >
-              <Input size="large" placeholder="Please input value" />
+              <Input size="large" placeholder={t('emailPlaceholder')} />
             </Form.Item>
             {title === 'register' && (
               <Form.Item
                 {...formItemLayout}
                 name="nickname"
-                label="Nickname"
-                rules={[
-                  { required: true, message: 'Please input your nickname' },
-                ]}
+                label={t('nicknameLabel')}
+                rules={[{ required: true, message: t('nicknamePlaceholder') }]}
               >
-                <Input size="large" placeholder="Please input your nickname" />
+                <Input size="large" placeholder={t('nicknamePlaceholder')} />
               </Form.Item>
             )}
             <Form.Item
               {...formItemLayout}
               name="password"
-              label="Password"
-              rules={[{ required: true, message: 'Please input value' }]}
+              label={t('passwordLabel')}
+              rules={[{ required: true, message: t('passwordPlaceholder') }]}
             >
               <Input.Password
                 size="large"
-                placeholder="Please input value"
+                placeholder={t('passwordPlaceholder')}
                 onPressEnter={onCheck}
               />
             </Form.Item>
             {title === 'login' && (
               <Form.Item name="remember" valuePropName="checked">
-                <Checkbox> Remember me</Checkbox>
+                <Checkbox> {t('rememberMe')}</Checkbox>
               </Form.Item>
             )}
             <div>
-              {' '}
               {title === 'login' && (
                 <div>
-                  Don’t have an account?
+                  {t('signInTip')}
                   <Button type="link" onClick={changeTitle}>
-                    Sign up
+                    {t('signUp')}
                   </Button>
                 </div>
               )}
               {title === 'register' && (
                 <div>
-                  Already have an account?
+                  {t('signUpTip')}
                   <Button type="link" onClick={changeTitle}>
-                    Sign in
+                    {t('login')}
                   </Button>
                 </div>
               )}
@@ -154,7 +149,7 @@ const Login = () => {
               onClick={onCheck}
               loading={signLoading}
             >
-              {title === 'login' ? 'Sign in' : 'Continue'}
+              {title === 'login' ? t('login') : t('continue')}
             </Button>
             {title === 'login' && (
               <>