fix: delete the added model infiniflow#503

web/.umirc.ts

@@ -27,7 +27,7 @@ export default defineConfig({
   devtool: 'source-map',
   proxy: {
     '/v1': {
-      target: 'http://123.60.95.134:9380/',
+      target: '',
       changeOrigin: true,
       // pathRewrite: { '^/v1': '/v1' },
     },

web/src/components/pdf-previewer/index.tsx

@@ -34,7 +34,7 @@ const HighlightPopup = ({
   ) : null;
 
 const DocumentPreviewer = ({ chunk, documentId, visible }: IProps) => {
-  const url = useGetDocumentUrl(documentId);
+  const getDocumentUrl = useGetDocumentUrl(documentId);
   const { highlights: state, setWidthAndHeight } = useGetChunkHighlights(chunk);
   const ref = useRef<(highlight: IHighlight) => void>(() => {});
   const [loaded, setLoaded] = useState(false);
@@ -55,7 +55,7 @@ const DocumentPreviewer = ({ chunk, documentId, visible }: IProps) => {
   return (
     <div className={styles.documentContainer}>
       <PdfLoader
-        url={url}
+        url={getDocumentUrl()}
         beforeLoad={<Skeleton active />}
         workerSrc="/pdfjs-dist/pdf.worker.min.js"
       >

web/src/constants/common.ts

@@ -69,6 +69,8 @@ export const FileMimeTypeMap = {
   mp4: 'video/mp4',
 };
 
+export const Domain = 'demo.ragflow.io';
+
 //#region file preview
 export const Images = [
   'jpg',

web/src/hooks/llmHooks.ts

@@ -4,7 +4,10 @@ import {
   IMyLlmValue,
   IThirdOAIModelCollection,
 } from '@/interfaces/database/llm';
-import { IAddLlmRequestBody } from '@/interfaces/request/llm';
+import {
+  IAddLlmRequestBody,
+  IDeleteLlmRequestBody,
+} from '@/interfaces/request/llm';
 import { sortLLmFactoryListBySpecifiedOrder } from '@/utils/commonUtil';
 import { useCallback, useEffect, useMemo } from 'react';
 import { useDispatch, useSelector } from 'umi';
@@ -211,7 +214,7 @@ export const useSaveTenantInfo = () => {
 export const useAddLlm = () => {
   const dispatch = useDispatch();
 
-  const saveTenantInfo = useCallback(
+  const addLlm = useCallback(
     (requestBody: IAddLlmRequestBody) => {
       return dispatch<any>({
         type: 'settingModel/add_llm',
@@ -221,5 +224,21 @@ export const useAddLlm = () => {
     [dispatch],
   );
 
-  return saveTenantInfo;
+  return addLlm;
+};
+
+export const useDeleteLlm = () => {
+  const dispatch = useDispatch();
+
+  const deleteLlm = useCallback(
+    (requestBody: IDeleteLlmRequestBody) => {
+      return dispatch<any>({
+        type: 'settingModel/delete_llm',
+        payload: requestBody,
+      });
+    },
+    [dispatch],
+  );
+
+  return deleteLlm;
 };

web/src/interfaces/request/llm.ts

@@ -4,3 +4,8 @@ export interface IAddLlmRequestBody {
   model_type: string;
   api_base?: string; // chat|embedding|speech2text|image2text
 }
+
+export interface IDeleteLlmRequestBody {
+  llm_factory: string; // Ollama
+  llm_name: string;
+}

web/src/pages/chat/chat-overview-modal/index.tsx

@@ -1,4 +1,5 @@
 import LineChart from '@/components/line-chart';
+import { Domain } from '@/constants/common';
 import { useSetModalState, useTranslate } from '@/hooks/commonHooks';
 import { IModalProps } from '@/interfaces/common';
 import { IDialog, IStats } from '@/interfaces/database/chat';
@@ -80,7 +81,9 @@ const ChatOverviewModal = ({
             <Flex gap={8} vertical>
               {t('serviceApiEndpoint')}
               <Paragraph copyable className={styles.linkText}>
-                https://demo.ragflow.io/v1/api/
+                https://
+                {location.hostname === Domain ? Domain : '<YOUR_MACHINE_IP>'}
+                /v1/api/
               </Paragraph>
             </Flex>
             <Space size={'middle'}>

web/src/pages/chat/embed-modal/index.tsx

@@ -1,5 +1,6 @@
 import CopyToClipboard from '@/components/copy-to-clipboard';
 import HightLightMarkdown from '@/components/highlight-markdown';
+import { Domain } from '@/constants/common';
 import { useTranslate } from '@/hooks/commonHooks';
 import { IModalProps } from '@/interfaces/common';
 import { Card, Modal, Tabs, TabsProps } from 'antd';
@@ -15,7 +16,7 @@ const EmbedModal = ({
   const text = `
   ~~~ html
   <iframe
-  src="https://demo.ragflow.io/chat/share?shared_id=${token}"
+  src="https://${Domain}/chat/share?shared_id=${token}"
   style="width: 100%; height: 100%; min-height: 600px"
   frameborder="0"
 >

web/src/pages/login/index.tsx

@@ -7,6 +7,7 @@ import { useTranslation } from 'react-i18next';
 import { Icon, useNavigate } from 'umi';
 import RightPanel from './right-panel';
 
+import { Domain } from '@/constants/common';
 import styles from './index.less';
 
 const Login = () => {
@@ -167,7 +168,7 @@ const Login = () => {
                     Sign in with Google
                   </div>
                 </Button> */}
-                {location.host === 'demo.ragflow.io' && (
+                {location.host === Domain && (
                   <Button
                     block
                     size="large"

web/src/pages/user-setting/model.ts

@@ -167,6 +167,17 @@ const model: DvaModel<SettingModelState> = {
       }
       return retcode;
     },
+    *delete_llm({ payload = {} }, { call, put }) {
+      const { data } = yield call(userService.delete_llm, payload);
+      const { retcode } = data;
+      if (retcode === 0) {
+        message.success(i18n.t('message.deleted'));
+
+        yield put({ type: 'my_llm' });
+        yield put({ type: 'factories_list' });
+      }
+      return retcode;
+    },
   },
 };
 export default model;

web/src/pages/user-setting/setting-model/hooks.ts

@@ -1,8 +1,9 @@
-import { useSetModalState } from '@/hooks/commonHooks';
+import { useSetModalState, useShowDeleteConfirm } from '@/hooks/commonHooks';
 import {
   IApiKeySavingParams,
   ISystemModelSettingSavingParams,
   useAddLlm,
+  useDeleteLlm,
   useFetchLlmList,
   useSaveApiKey,
   useSaveTenantInfo,
@@ -164,3 +165,18 @@ export const useSubmitOllama = () => {
     selectedLlmFactory,
   };
 };
+
+export const useHandleDeleteLlm = (llmFactory: string) => {
+  const deleteLlm = useDeleteLlm();
+  const showDeleteConfirm = useShowDeleteConfirm();
+
+  const handleDeleteLlm = (name: string) => () => {
+    showDeleteConfirm({
+      onOk: async () => {
+        deleteLlm({ llm_factory: llmFactory, llm_name: name });
+      },
+    });
+  };
+
+  return { handleDeleteLlm };
+};

web/src/pages/user-setting/setting-model/index.tsx

@@ -6,7 +6,11 @@ import {
   useFetchLlmFactoryListOnMount,
   useFetchMyLlmListOnMount,
 } from '@/hooks/llmHooks';
-import { SettingOutlined, UserOutlined } from '@ant-design/icons';
+import {
+  CloseCircleOutlined,
+  SettingOutlined,
+  UserOutlined,
+} from '@ant-design/icons';
 import {
   Avatar,
   Button,
@@ -21,13 +25,15 @@ import {
   Space,
   Spin,
   Tag,
+  Tooltip,
   Typography,
 } from 'antd';
 import { useCallback } from 'react';
 import SettingTitle from '../components/setting-title';
 import { isLocalLlmFactory } from '../utils';
 import ApiKeyModal from './api-key-modal';
 import {
+  useHandleDeleteLlm,
   useSelectModelProvidersLoading,
   useSubmitApiKey,
   useSubmitOllama,
@@ -67,6 +73,7 @@ interface IModelCardProps {
 const ModelCard = ({ item, clickApiKey }: IModelCardProps) => {
   const { visible, switchVisible } = useSetModalState();
   const { t } = useTranslate('setting');
+  const { handleDeleteLlm } = useHandleDeleteLlm(item.name);
 
   const handleApiKeyClick = () => {
     clickApiKey(item.name);
@@ -113,6 +120,11 @@ const ModelCard = ({ item, clickApiKey }: IModelCardProps) => {
               <List.Item>
                 <Space>
                   {item.name} <Tag color="#b8b8b8">{item.type}</Tag>
+                  <Tooltip title={t('delete', { keyPrefix: 'common' })}>
+                    <Button type={'text'} onClick={handleDeleteLlm(item.name)}>
+                      <CloseCircleOutlined style={{ color: '#D92D20' }} />
+                    </Button>
+                  </Tooltip>
                 </Space>
               </List.Item>
             )}

web/src/services/userService.ts

@@ -15,6 +15,7 @@ const {
   set_api_key,
   set_tenant_info,
   add_llm,
+  delete_llm,
 } = api;
 
 const methods = {
@@ -66,6 +67,10 @@ const methods = {
     url: add_llm,
     method: 'post',
   },
+  delete_llm: {
+    url: delete_llm,
+    method: 'post',
+  },
 } as const;
 
 const userService = registerServer<keyof typeof methods>(methods, request);

web/src/utils/api.ts

@@ -18,6 +18,7 @@ export default {
   my_llm: `${api_host}/llm/my_llms`,
   set_api_key: `${api_host}/llm/set_api_key`,
   add_llm: `${api_host}/llm/add_llm`,
+  delete_llm: `${api_host}/llm/delete_llm`,
 
   // knowledge base
   kb_list: `${api_host}/kb/list`,