@lobehub/chat 1.77.16 → 1.77.17

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.77.16",
+  "version": "1.77.17",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",

package/src/app/(backend)/webapi/models/[provider]/pull/route.ts

@@ -0,0 +1,34 @@
+import { checkAuth } from '@/app/(backend)/middleware/auth';
+import { ChatCompletionErrorPayload, PullModelParams } from '@/libs/agent-runtime';
+import { initAgentRuntimeWithUserPayload } from '@/server/modules/AgentRuntime';
+import { ChatErrorType } from '@/types/fetch';
+import { createErrorResponse } from '@/utils/errorResponse';
+
+export const runtime = 'edge';
+
+export const POST = checkAuth(async (req, { params, jwtPayload }) => {
+  const { provider } = await params;
+
+  try {
+    const agentRuntime = await initAgentRuntimeWithUserPayload(provider, jwtPayload);
+
+    const data = (await req.json()) as PullModelParams;
+
+    const res = await agentRuntime.pullModel(data, { signal: req.signal });
+    if (res) return res;
+
+    throw new Error('No response');
+  } catch (e) {
+    const {
+      errorType = ChatErrorType.InternalServerError,
+      error: errorContent,
+      ...res
+    } = e as ChatCompletionErrorPayload;
+
+    const error = errorContent || e;
+    // track the error at server side
+    console.error(`Route: [${provider}] ${errorType}:`, error);
+
+    return createErrorResponse(errorType, { error, ...res, provider });
+  }
+});

package/src/app/(backend)/webapi/{chat/models → models}/[provider]/route.ts

@@ -8,8 +8,7 @@ import { createErrorResponse } from '@/utils/errorResponse';
 
 export const runtime = 'edge';
 
-const noNeedAPIKey = (provider: string) =>
-  [ModelProvider.OpenRouter].includes(provider as any);
+const noNeedAPIKey = (provider: string) => [ModelProvider.OpenRouter].includes(provider as any);
 
 export const GET = checkAuth(async (req, { params, jwtPayload }) => {
   const { provider } = await params;

package/src/app/[variants]/(main)/settings/llm/ProviderList/Ollama/index.tsx

@@ -5,19 +5,12 @@ import { useTranslation } from 'react-i18next';
 import { OllamaProviderCard } from '@/config/modelProviders';
 
 import { ProviderItem } from '../../type';
-import Checker from './Checker';
 
 export const useOllamaProvider = (): ProviderItem => {
   const { t } = useTranslation('modelProvider');
 
   return {
     ...OllamaProviderCard,
-    checkerItem: {
-      children: <Checker />,
-      desc: t('ollama.checker.desc'),
-      label: t('ollama.checker.title'),
-      minWidth: undefined,
-    },
     proxyUrl: {
       desc: t('ollama.endpoint.desc'),
       placeholder: 'http://127.0.0.1:11434',

package/src/app/[variants]/(main)/settings/provider/(detail)/ollama/CheckError.tsx

@@ -13,7 +13,7 @@ const OllamaSetupGuide = dynamic(() => import('@/components/OllamaSetupGuide'),
   ssr: false,
 });
 
-const InvalidModel = dynamic(() => import('./OllamaModelDownloader'), {
+const InvalidModel = dynamic(() => import('@/features/OllamaModelDownloader'), {
   loading,
   ssr: false,
 });

package/src/components/FormAction/index.tsx

@@ -25,7 +25,7 @@ const FormAction = memo<
     animation?: boolean;
     avatar: ReactNode;
     background?: string;
-    description: string;
+    description: ReactNode;
     title: string;
   } & CenterProps
 >(

package/src/database/models/__tests__/aiProvider.test.ts

@@ -372,5 +372,105 @@ describe('AiProviderModel', () => {
         settings: {},
       });
     });
+
+    it('should handle decrypt error gracefully', async () => {
+      const failingDecryptor = vi.fn().mockImplementation(() => {
+        throw new Error('Decryption failed');
+      });
+
+      await serverDB.insert(aiProviders).values({
+        id: 'provider-with-bad-keys',
+        keyVaults: 'invalid-encrypted-data',
+        name: 'Bad Provider',
+        source: 'custom',
+        userId,
+      });
+
+      const config = await aiProviderModel.getAiProviderRuntimeConfig(failingDecryptor);
+
+      expect(config['provider-with-bad-keys'].keyVaults).toEqual({});
+      expect(failingDecryptor).toHaveBeenCalled();
+    });
+
+    it('should handle null keyVaults gracefully', async () => {
+      await serverDB.insert(aiProviders).values({
+        id: 'provider-no-keys',
+        keyVaults: null,
+        name: 'No Keys Provider',
+        source: 'custom',
+        userId,
+      });
+
+      const config = await aiProviderModel.getAiProviderRuntimeConfig();
+
+      expect(config['provider-no-keys'].keyVaults).toEqual({});
+    });
+
+    it('should respect fetchOnClient property', async () => {
+      await serverDB.insert(aiProviders).values([
+        {
+          fetchOnClient: true,
+          id: 'client-provider',
+          name: 'Client Provider',
+          source: 'custom',
+          userId,
+        },
+        {
+          fetchOnClient: false,
+          id: 'server-provider',
+          name: 'Server Provider',
+          source: 'custom',
+          userId,
+        },
+        {
+          id: 'undefined-provider',
+          name: 'Undefined Provider',
+          source: 'custom',
+          userId,
+        },
+      ]);
+
+      const config = await aiProviderModel.getAiProviderRuntimeConfig();
+
+      expect(config['client-provider'].fetchOnClient).toBe(true);
+      expect(config['server-provider'].fetchOnClient).toBe(false);
+      expect(config['undefined-provider'].fetchOnClient).toBeUndefined();
+    });
+
+    it('should use empty object as default for settings', async () => {
+      await serverDB.insert(aiProviders).values({
+        id: 'no-settings-provider',
+        name: 'No Settings Provider',
+        settings: null as any,
+        source: 'custom',
+        userId,
+      });
+
+      const config = await aiProviderModel.getAiProviderRuntimeConfig();
+
+      expect(config['no-settings-provider'].settings).toEqual({});
+    });
+
+    it('should only include providers for the current user', async () => {
+      await serverDB.insert(aiProviders).values([
+        {
+          id: 'user1-provider',
+          name: 'User 1 Provider',
+          source: 'custom',
+          userId,
+        },
+        {
+          id: 'user2-provider',
+          name: 'User 2 Provider',
+          source: 'custom',
+          userId: 'user2',
+        },
+      ]);
+
+      const config = await aiProviderModel.getAiProviderRuntimeConfig();
+
+      expect(config['user1-provider']).toBeDefined();
+      expect(config['user2-provider']).toBeUndefined();
+    });
   });
 });

package/src/database/models/aiProvider.ts

@@ -251,9 +251,19 @@ export class AiProviderModel {
       const builtin = DEFAULT_MODEL_PROVIDER_LIST.find((provider) => provider.id === item.id);
 
       const userSettings = item.settings || {};
+
+      let keyVaults = {};
+      if (!!item.keyVaults) {
+        try {
+          keyVaults = await decrypt(item.keyVaults);
+        } catch {
+          /* empty */
+        }
+      }
+
       runtimeConfig[item.id] = {
         fetchOnClient: typeof item.fetchOnClient === 'boolean' ? item.fetchOnClient : undefined,
-        keyVaults: !!item.keyVaults ? await decrypt(item.keyVaults) : {},
+        keyVaults,
         settings: !!builtin ? merge(builtin.settings, userSettings) : userSettings,
       };
     }

package/src/features/Conversation/Error/OllamaBizError/InvalidOllamaModel.tsx

@@ -0,0 +1,43 @@
+import { Button } from 'antd';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import OllamaModelDownloader from '@/features/OllamaModelDownloader';
+import { useChatStore } from '@/store/chat';
+
+import { ErrorActionContainer } from '../style';
+
+interface InvalidOllamaModelProps {
+  id: string;
+  model: string;
+}
+
+const InvalidOllamaModel = memo<InvalidOllamaModelProps>(({ id, model }) => {
+  const { t } = useTranslation('error');
+
+  const [delAndRegenerateMessage, deleteMessage] = useChatStore((s) => [
+    s.delAndRegenerateMessage,
+    s.deleteMessage,
+  ]);
+  return (
+    <ErrorActionContainer>
+      <OllamaModelDownloader
+        extraAction={
+          <Button
+            onClick={() => {
+              deleteMessage(id);
+            }}
+          >
+            {t('unlock.closeMessage')}
+          </Button>
+        }
+        model={model}
+        onSuccessDownload={() => {
+          delAndRegenerateMessage(id);
+        }}
+      />
+    </ErrorActionContainer>
+  );
+});
+
+export default InvalidOllamaModel;

package/src/features/Conversation/Error/OllamaDesktopSetupGuide/index.tsx

@@ -0,0 +1,61 @@
+import { Ollama } from '@lobehub/icons';
+import { Button } from 'antd';
+import { useTheme } from 'antd-style';
+import Link from 'next/link';
+import { memo } from 'react';
+import { Trans, useTranslation } from 'react-i18next';
+import { Center } from 'react-layout-kit';
+
+import FormAction from '@/components/FormAction';
+import { useChatStore } from '@/store/chat';
+
+import { ErrorActionContainer } from '../style';
+
+const OllamaDesktopSetupGuide = memo<{ id: string }>(({ id }) => {
+  const theme = useTheme();
+  const { t } = useTranslation('components');
+
+  const [delAndRegenerateMessage, deleteMessage] = useChatStore((s) => [
+    s.delAndRegenerateMessage,
+    s.deleteMessage,
+  ]);
+
+  return (
+    <ErrorActionContainer style={{ paddingBlock: 0 }}>
+      <Center gap={16} paddingBlock={32} style={{ maxWidth: 300, width: '100%' }}>
+        <FormAction
+          avatar={<Ollama color={theme.colorPrimary} size={64} />}
+          description={
+            <span>
+              <Trans i18nKey={'OllamaSetupGuide.install.description'} ns={'components'}>
+                请确认你已经开启 Ollama ，如果没有安装 Ollama ，请前往官网
+                <Link href={'https://ollama.com/download'}>下载</Link>
+              </Trans>
+            </span>
+          }
+          title={t('OllamaSetupGuide.install.title')}
+        />
+        <Button
+          block
+          onClick={() => {
+            delAndRegenerateMessage(id);
+          }}
+          style={{ marginTop: 8 }}
+          type={'primary'}
+        >
+          {t('OllamaSetupGuide.action.start')}
+        </Button>
+        <Button
+          block
+          onClick={() => {
+            deleteMessage(id);
+          }}
+        >
+          {t('OllamaSetupGuide.action.close')}
+        </Button>
+      </Center>
+    </ErrorActionContainer>
+  );
+});
+
+export default OllamaDesktopSetupGuide;

package/src/features/Conversation/Error/index.tsx

@@ -5,6 +5,7 @@ import dynamic from 'next/dynamic';
 import { Suspense, memo, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 
+import { isDesktop } from '@/const/version';
 import { useProviderName } from '@/hooks/useProviderName';
 import { AgentRuntimeErrorType, ILobeAgentRuntimeErrorType } from '@/libs/agent-runtime';
 import { ChatErrorType, ErrorType } from '@/types/fetch';
@@ -23,6 +24,10 @@ const OllamaSetupGuide = dynamic(() => import('./OllamaBizError/SetupGuide'), {
   loading,
   ssr: false,
 });
+const OllamaDesktopSetupGuide = dynamic(() => import('./OllamaDesktopSetupGuide'), {
+  loading,
+  ssr: false,
+});
 
 // Config for the errorMessage display
 const getErrorAlertConfig = (
@@ -92,6 +97,8 @@ const ErrorMessageExtra = memo<{ data: ChatMessage }>(({ data }) => {
   switch (error.type) {
     // TODO: 优化 Ollama setup 的流程，isDesktop 模式下可以直接做到端到端检测
     case AgentRuntimeErrorType.OllamaServiceUnavailable: {
+      if (isDesktop) return <OllamaDesktopSetupGuide id={data.id} />;
+
       return <OllamaSetupGuide />;
     }
 

package/src/features/DevPanel/SystemInspector/ServerConfig.tsx

@@ -2,10 +2,26 @@ import { useServerConfigStore } from '@/store/serverConfig';
 
 import JsonViewer from './JsonViewer';
 
-const ServerConfig = () => {
+export const ServerConfig = () => {
   const serverConfig = useServerConfigStore((s) => s.serverConfig);
 
   return <JsonViewer data={serverConfig} />;
 };
 
-export default ServerConfig;
+export const SystemAgent = () => {
+  const serverConfig = useServerConfigStore((s) => s.serverConfig);
+
+  return <JsonViewer data={serverConfig.systemAgent || {}} />;
+};
+
+export const DefaultAgentConfig = () => {
+  const serverConfig = useServerConfigStore((s) => s.serverConfig);
+
+  return <JsonViewer data={serverConfig.defaultAgent || {}} />;
+};
+
+export const AIProvider = () => {
+  const serverConfig = useServerConfigStore((s) => s.serverConfig);
+
+  return <JsonViewer data={serverConfig.aiProvider || {}} />;
+};

package/src/features/DevPanel/SystemInspector/index.tsx

@@ -5,11 +5,14 @@ import { useState } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
 import AiProviderRuntimeConfig from './AiProviderRuntimeConfig';
-import ServerConfig from './ServerConfig';
+import { AIProvider, DefaultAgentConfig, ServerConfig, SystemAgent } from './ServerConfig';
 
 enum TabKey {
+  AIProvider = 'aiProvider',
   AiProviderRuntimeConfig = 'aiProviderRuntimeConfig',
+  DefaultAgentConfig = 'defaultAgentConfig',
   ServerConfig = 'serverConfig',
+  SystemAgent = 'systemAgent',
 }
 
 const SystemInspector = () => {
@@ -20,21 +23,37 @@ const SystemInspector = () => {
       <TabsNav
         activeKey={activeTab}
         items={[
-          {
-            key: TabKey.ServerConfig,
-            label: 'Server Config',
-          },
           {
             key: TabKey.AiProviderRuntimeConfig,
             label: 'Ai Provider Runtime Config',
           },
+          {
+            key: TabKey.AIProvider,
+            label: 'AI Provider Config',
+          },
+
+          {
+            key: TabKey.DefaultAgentConfig,
+            label: 'Default Agent Config',
+          },
+          {
+            key: TabKey.SystemAgent,
+            label: 'System Agent',
+          },
+          {
+            key: TabKey.ServerConfig,
+            label: 'Server Config',
+          },
         ]}
         onChange={(activeTab) => setActiveTab(activeTab as TabKey)}
         variant={'compact'}
       />
 
-      {activeTab === TabKey.ServerConfig && <ServerConfig />}
       {activeTab === TabKey.AiProviderRuntimeConfig && <AiProviderRuntimeConfig />}
+      {activeTab === TabKey.DefaultAgentConfig && <DefaultAgentConfig />}
+      {activeTab === TabKey.SystemAgent && <SystemAgent />}
+      {activeTab === TabKey.AIProvider && <AIProvider />}
+      {activeTab === TabKey.ServerConfig && <ServerConfig />}
     </Flexbox>
   );
 };

package/src/features/OllamaModelDownloader/index.tsx

@@ -0,0 +1,149 @@
+import { Ollama } from '@lobehub/icons';
+import { Alert } from '@lobehub/ui';
+import { Button, Input, Progress } from 'antd';
+import { useTheme } from 'antd-style';
+import { ReactNode, memo, useCallback, useMemo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Center, Flexbox } from 'react-layout-kit';
+
+import FormAction from '@/components/FormAction';
+import { useActionSWR } from '@/libs/swr';
+import { ModelProgressInfo, modelsService } from '@/services/models';
+import { formatSize } from '@/utils/format';
+
+import { useDownloadMonitor } from './useDownloadMonitor';
+
+interface OllamaModelDownloaderProps {
+  extraAction?: ReactNode;
+  model: string;
+  onSuccessDownload?: () => void;
+}
+
+const OllamaModelDownloader = memo<OllamaModelDownloaderProps>(
+  ({ model, onSuccessDownload, extraAction }) => {
+    const { t } = useTranslation(['modelProvider', 'error']);
+
+    const [modelToPull, setModelToPull] = useState(model);
+    const [completed, setCompleted] = useState(0);
+    const [total, setTotal] = useState(0);
+    const { remainingTime, downloadSpeed } = useDownloadMonitor(total, completed);
+    const percent = useMemo(() => {
+      return total ? Number(((completed / total) * 100).toFixed(1)) : 0;
+    }, [completed, total]);
+
+    const theme = useTheme();
+
+    // 定义进度回调函数
+    const handleProgress = useCallback((progress: ModelProgressInfo) => {
+      if (progress.completed) setCompleted(progress.completed);
+      if (progress.total) setTotal(progress.total);
+    }, []);
+
+    const {
+      mutate,
+      isValidating: isDownloading,
+      error,
+    } = useActionSWR(
+      [modelToPull],
+      async ([model]) => {
+        await modelsService.downloadModel(
+          { model, provider: 'ollama' },
+          { onProgress: handleProgress },
+        );
+
+        return true;
+      },
+      {
+        onSuccess: onSuccessDownload,
+      },
+    );
+
+    return (
+      <Center gap={16} paddingBlock={32} style={{ width: '100%' }}>
+        <FormAction
+          avatar={<Ollama color={theme.colorPrimary} size={64} />}
+          description={isDownloading ? t('ollama.download.desc') : t('ollama.unlock.description')}
+          title={
+            isDownloading
+              ? t('ollama.download.title', { model: modelToPull })
+              : t('ollama.unlock.title')
+          }
+        >
+          {!isDownloading && (
+            <Input
+              onChange={(e) => {
+                setModelToPull(e.target.value);
+              }}
+              value={modelToPull}
+            />
+          )}
+        </FormAction>
+        {isDownloading && (
+          <Flexbox flex={1} gap={8} style={{ maxWidth: 300 }} width={'100%'}>
+            <Progress
+              percent={percent}
+              showInfo
+              strokeColor={theme.colorSuccess}
+              trailColor={theme.colorSuccessBg}
+            />
+            <Flexbox
+              distribution={'space-between'}
+              horizontal
+              style={{ color: theme.colorTextDescription, fontSize: 12 }}
+            >
+              <span>
+                {t('ollama.download.remainingTime')}: {remainingTime}
+              </span>
+              <span>
+                {t('ollama.download.speed')}: {downloadSpeed}
+              </span>
+            </Flexbox>
+          </Flexbox>
+        )}
+        <Flexbox gap={12} style={{ maxWidth: 300 }} width={'100%'}>
+          {error?.message && (
+            <Alert
+              closable
+              description={error.message}
+              message={t('ollama.download.failed')}
+              showIcon={false}
+              type={'error'}
+            />
+          )}
+          <Button
+            block
+            loading={isDownloading}
+            onClick={() => {
+              mutate();
+            }}
+            style={{ marginTop: 8 }}
+            type={'primary'}
+          >
+            {!isDownloading
+              ? t('ollama.unlock.confirm')
+              : // if total is 0, show starting, else show downloaded
+                !total
+                ? t('ollama.unlock.starting')
+                : t('ollama.unlock.downloaded', {
+                    completed: formatSize(completed, 2),
+                    total: formatSize(total, 2),
+                  })}
+          </Button>
+          {isDownloading ? (
+            <Button
+              onClick={() => {
+                modelsService.abortPull();
+              }}
+            >
+              {t('ollama.unlock.cancel')}
+            </Button>
+          ) : (
+            extraAction
+          )}
+        </Flexbox>
+      </Center>
+    );
+  },
+);
+
+export default OllamaModelDownloader;

package/src/libs/agent-runtime/AgentRuntime.ts

@@ -12,6 +12,8 @@ import {
   ChatStreamPayload,
   EmbeddingsOptions,
   EmbeddingsPayload,
+  ModelRequestOptions,
+  PullModelParams,
   TextToImagePayload,
   TextToSpeechPayload,
 } from './types';
@@ -77,6 +79,10 @@ class AgentRuntime {
     return this._runtime.textToSpeech?.(payload, options);
   }
 
+  async pullModel(params: PullModelParams, options?: ModelRequestOptions) {
+    return this._runtime.pullModel?.(params, options);
+  }
+
   /**
    * @description Initialize the runtime with the provider and the options
    * @param provider choose a model provider

package/src/libs/agent-runtime/BaseAI.ts

@@ -8,11 +8,14 @@ import {
   Embeddings,
   EmbeddingsOptions,
   EmbeddingsPayload,
+  ModelRequestOptions,
+  PullModelParams,
   TextToImagePayload,
   TextToSpeechOptions,
   TextToSpeechPayload,
 } from './types';
 
+/* eslint-disable sort-keys-fix/sort-keys-fix , typescript-sort-keys/interface */
 export interface LobeRuntimeAI {
   baseURL?: string;
   chat(payload: ChatStreamPayload, options?: ChatCompetitionOptions): Promise<Response>;
@@ -27,7 +30,11 @@ export interface LobeRuntimeAI {
     payload: TextToSpeechPayload,
     options?: TextToSpeechOptions,
   ) => Promise<ArrayBuffer>;
+
+  // 模型管理相关接口
+  pullModel?(params: PullModelParams, options?: ModelRequestOptions): Promise<Response>;
 }
+/* eslint-enabled */
 
 export abstract class LobeOpenAICompatibleRuntime {
   abstract baseURL: string;