Merge pull request #1001 from utin-francis-peter/latest-srcdoc-as-active

Fix: Set Uploaded/Trained/Latest Source Doc as Selected/Active Source Doc

frontend/src/Navigation.tsx

@@ -27,6 +27,7 @@ import {
   selectConversationId,
   selectModalStateDeleteConv,
   setModalStateDeleteConv,
+  setSourceDocs,
 } from './preferences/preferenceSlice';
 import {
   setConversation,
@@ -34,7 +35,7 @@ import {
 } from './conversation/conversationSlice';
 import { useMediaQuery, useOutsideAlerter } from './hooks';
 import Upload from './upload/Upload';
-import { Doc, getConversations } from './preferences/preferenceApi';
+import { Doc, getConversations, getDocs } from './preferences/preferenceApi';
 import SelectDocsModal from './preferences/SelectDocsModal';
 import ConversationTile from './conversation/ConversationTile';
 import { useDarkTheme } from './hooks';
@@ -124,19 +125,29 @@ export default function Navigation({ navOpen, setNavOpen }: NavigationProps) {
       .catch((error) => console.error(error));
   };
 
-  const handleDeleteClick = (index: number, doc: Doc) => {
+  const handleDeleteClick = (doc: Doc) => {
-    const docPath = 'indexes/' + 'local' + '/' + doc.name;
+    const docPath = `indexes/local/${doc.name}`;
 
     fetch(`${apiHost}/api/delete_old?path=${docPath}`, {
       method: 'GET',
     })
       .then(() => {
         // remove the image element from the DOM
-        const imageElement = document.querySelector(
+        // const imageElement = document.querySelector(
-          `#img-${index}`,
+        //   `#img-${index}`,
-        ) as HTMLElement;
+        // ) as HTMLElement;
-        const parentElement = imageElement.parentNode as HTMLElement;
+        // const parentElement = imageElement.parentNode as HTMLElement;
-        parentElement.parentNode?.removeChild(parentElement);
+        // parentElement.parentNode?.removeChild(parentElement);
+
+        return getDocs();
+      })
+      .then((updatedDocs) => {
+        dispatch(setSourceDocs(updatedDocs));
+        dispatch(
+          setSelectedDocs(
+            updatedDocs?.find((doc) => doc.name.toLowerCase() === 'default'),
+          ),
+        );
       })
       .catch((error) => console.error(error));
   };

frontend/src/components/SourceDropdown.tsx

@@ -90,7 +90,7 @@ function SourceDropdown({
                         id={`img-${index}`}
                         onClick={(event) => {
                           event.stopPropagation();
-                          handleDeleteClick(index, option);
+                          handleDeleteClick(option);
                         }}
                       />
                     )}

frontend/src/locale/zh.json

@@ -9,7 +9,7 @@
   "tagline": "DocsGPT 使用 GenAI, 请使用来源审核关键信息.",
   "sourceDocs": "来源文档",
   "none": "无",
-    "cancel":"取消",
+  "cancel": "取消",
   "demo": [
     {
       "header": "了解 DocsGPT",
@@ -41,13 +41,13 @@
       "deleteAllLabel": "删除所有对话",
       "deleteAllBtn": "删除所有",
       "addNew": "添加新的",
-        "convHistory":"对话历史",
+      "convHistory": "对话历史",
-        "none":"无",
+      "none": "无",
-        "low":"低",
+      "low": "低",
-        "medium":"中",
+      "medium": "中",
-        "high":"高",
+      "high": "高",
-        "unlimited":"无限",
+      "unlimited": "无限",
-        "default":"默认"
+      "default": "默认"
     },
     "documents": {
       "label": "文件",
@@ -105,5 +105,4 @@
       "delete": "删除"
     }
   }
-  }
+}
-  

frontend/src/upload/Upload.tsx

@@ -4,10 +4,11 @@ import { useDropzone } from 'react-dropzone';
 import { useDispatch } from 'react-redux';
 import { ActiveState } from '../models/misc';
 import { getDocs } from '../preferences/preferenceApi';
-import { setSourceDocs } from '../preferences/preferenceSlice';
+import { setSelectedDocs, setSourceDocs } from '../preferences/preferenceSlice';
 import Dropdown from '../components/Dropdown';
 import { useTranslation } from 'react-i18next';
-export default function Upload({
+
+function Upload({
   modalState,
   setModalState,
 }: {
@@ -24,25 +25,28 @@ export default function Upload({
     search_queries: [''],
     number_posts: 10,
   });
+  const [activeTab, setActiveTab] = useState<string>('file');
+  const [files, setfiles] = useState<File[]>([]);
+  const [progress, setProgress] = useState<{
+    type: 'UPLOAD' | 'TRAINIING';
+    percentage: number;
+    taskId?: string;
+    failed?: boolean;
+  }>();
+
   const { t } = useTranslation();
+
   const urlOptions: { label: string; value: string }[] = [
     { label: 'Crawler', value: 'crawler' },
     // { label: 'Sitemap', value: 'sitemap' },
     { label: 'Link', value: 'url' },
     { label: 'Reddit', value: 'reddit' },
   ];
+
   const [urlType, setUrlType] = useState<{ label: string; value: string }>({
     label: 'Link',
     value: 'url',
   });
-  const [activeTab, setActiveTab] = useState<string>('file');
-  const [files, setfiles] = useState<File[]>([]);
-  const [progress, setProgress] = useState<{
-    type: 'UPLOAD' | 'TRAINIING';
-    percentage: number;
-    taskId?: string;
-    failed?: boolean;
-  }>();
 
   function Progress({
     title,
@@ -93,16 +97,26 @@ export default function Upload({
 
   function TrainingProgress() {
     const dispatch = useDispatch();
+
     useEffect(() => {
-      (progress?.percentage ?? 0) < 100 &&
+      let timeoutID: number | undefined;
-        setTimeout(() => {
+
+      if ((progress?.percentage ?? 0) < 100) {
+        timeoutID = setTimeout(() => {
           const apiHost = import.meta.env.VITE_API_HOST;
           fetch(`${apiHost}/api/task_status?task_id=${progress?.taskId}`)
             .then((data) => data.json())
             .then((data) => {
               if (data.status == 'SUCCESS') {
                 if (data.result.limited === true) {
-                  getDocs().then((data) => dispatch(setSourceDocs(data)));
+                  getDocs().then((data) => {
+                    dispatch(setSourceDocs(data));
+                    dispatch(
+                      setSelectedDocs(
+                        data?.find((d) => d.location.toLowerCase() === 'local'),
+                      ),
+                    );
+                  });
                   setProgress(
                     (progress) =>
                       progress && {
@@ -112,7 +126,14 @@ export default function Upload({
                       },
                   );
                 } else {
-                  getDocs().then((data) => dispatch(setSourceDocs(data)));
+                  getDocs().then((data) => {
+                    dispatch(setSourceDocs(data));
+                    dispatch(
+                      setSelectedDocs(
+                        data?.find((d) => d.location.toLowerCase() === 'local'),
+                      ),
+                    );
+                  });
                   setProgress(
                     (progress) =>
                       progress && {
@@ -133,6 +154,14 @@ export default function Upload({
               }
             });
         }, 5000);
+      }
+
+      // cleanup
+      return () => {
+        if (timeoutID !== undefined) {
+          clearTimeout(timeoutID);
+        }
+      };
     }, [progress, dispatch]);
     return (
       <Progress
@@ -217,6 +246,7 @@ export default function Upload({
         ['.docx'],
     },
   });
+
   const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const { name, value } = e.target;
     if (name === 'search_queries' && value.length > 0) {
@@ -230,7 +260,9 @@ export default function Upload({
         [name]: value,
       });
   };
+
   let view;
+
   if (progress?.type === 'UPLOAD') {
     view = <UploadProgress></UploadProgress>;
   } else if (progress?.type === 'TRAINIING') {
@@ -263,6 +295,7 @@ export default function Upload({
             {t('modals.uploadDoc.remote')}
           </button>
         </div>
+
         {activeTab === 'file' && (
           <>
             <input
@@ -411,6 +444,7 @@ export default function Upload({
             )}
           </>
         )}
+
         <div className="flex flex-row-reverse">
           {activeTab === 'file' ? (
             <button
@@ -462,3 +496,5 @@ export default function Upload({
     </article>
   );
 }
+
+export default Upload;