@lobehub/chat 1.69.1 → 1.69.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.69.1",
+  "version": "1.69.3",
   "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",
@@ -133,7 +133,7 @@
     "@lobehub/chat-plugins-gateway": "^1.9.0",
     "@lobehub/icons": "^1.73.1",
     "@lobehub/tts": "^1.28.0",
-    "@lobehub/ui": "^1.165.2",
+    "@lobehub/ui": "^1.165.5",
     "@neondatabase/serverless": "^0.10.4",
     "@next/third-parties": "^15.2.0",
     "@react-spring/web": "^9.7.5",
@@ -165,7 +165,7 @@
     "epub2": "^3.0.2",
     "fast-deep-equal": "^3.1.3",
     "file-type": "^20.0.0",
-    "framer-motion": "^11.16.0",
+    "framer-motion": "^12.0.0",
     "gpt-tokenizer": "^2.8.1",
     "html-to-text": "^9.0.5",
     "i18next": "^24.2.1",

package/src/app/[variants]/(auth)/next-auth/signin/AuthSignInBox.tsx

@@ -0,0 +1,161 @@
+'use client';
+
+import { LobeChat } from '@lobehub/ui/brand';
+import { Button, Col, Flex, Row, Skeleton, Typography } from 'antd';
+import { createStyles } from 'antd-style';
+import { AuthError } from 'next-auth';
+import { signIn } from 'next-auth/react';
+import { useRouter, useSearchParams } from 'next/navigation';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import BrandWatermark from '@/components/BrandWatermark';
+import AuthIcons from '@/components/NextAuth/AuthIcons';
+import { DOCUMENTS_REFER_URL, PRIVACY_URL, TERMS_URL } from '@/const/url';
+import { useUserStore } from '@/store/user';
+
+const { Title, Paragraph } = Typography;
+
+const useStyles = createStyles(({ css, token }) => ({
+  button: css`
+    text-transform: capitalize;
+  `,
+  container: css`
+    min-width: 360px;
+    border: 1px solid ${token.colorBorder};
+    border-radius: ${token.borderRadiusLG}px;
+    background: ${token.colorBgContainer};
+  `,
+  contentCard: css`
+    padding-block: 2.5rem;
+    padding-inline: 2rem;
+  `,
+  description: css`
+    margin: 0;
+    color: ${token.colorTextSecondary};
+  `,
+  footer: css`
+    padding: 1rem;
+    border-block-start: 1px solid ${token.colorBorder};
+    border-radius: 0 0 8px 8px;
+
+    color: ${token.colorTextDescription};
+
+    background: ${token.colorBgElevated};
+  `,
+  text: css`
+    text-align: center;
+  `,
+  title: css`
+    margin: 0;
+    color: ${token.colorTextHeading};
+  `,
+}));
+
+const BtnListLoading = memo(() => {
+  return (
+    <Flex gap={'small'} vertical>
+      <Skeleton.Button active style={{ minWidth: 300 }} />
+      <Skeleton.Button active style={{ minWidth: 300 }} />
+      <Skeleton.Button active style={{ minWidth: 300 }} />
+    </Flex>
+  );
+});
+
+/**
+ * Follow the implementation from AuthJS official documentation,
+ * but using client components.
+ * ref: https://authjs.dev/guides/pages/signin
+ */
+export default memo(() => {
+  const { styles } = useStyles();
+  const { t } = useTranslation('clerk');
+  const router = useRouter();
+
+  const oAuthSSOProviders = useUserStore((s) => s.oAuthSSOProviders);
+
+  const searchParams = useSearchParams();
+
+  // Redirect back to the page url
+  const callbackUrl = searchParams.get('callbackUrl') ?? '';
+
+  const handleSignIn = async (provider: string) => {
+    try {
+      await signIn(provider, { redirectTo: callbackUrl });
+    } catch (error) {
+      // Signin can fail for a number of reasons, such as the user
+      // not existing, or the user not having the correct role.
+      // In some cases, you may want to redirect to a custom error
+      if (error instanceof AuthError) {
+        return router.push(`/next-auth/?error=${error.type}`);
+      }
+
+      // Otherwise if a redirects happens Next.js can handle it
+      // so you can just re-thrown the error and let Next.js handle it.
+      // Docs: https://nextjs.org/docs/app/api-reference/functions/redirect#server-component
+      throw error;
+    }
+  };
+
+  const footerBtns = [
+    { href: DOCUMENTS_REFER_URL, id: 0, label: t('footerPageLink__help') },
+    { href: PRIVACY_URL, id: 1, label: t('footerPageLink__privacy') },
+    { href: TERMS_URL, id: 2, label: t('footerPageLink__terms') },
+  ];
+
+  return (
+    <div className={styles.container}>
+      <div className={styles.contentCard}>
+        {/* Card Body */}
+        <Flex gap="large" vertical>
+          {/* Header */}
+          <div className={styles.text}>
+            <Title className={styles.title} level={4}>
+              <div>
+                <LobeChat size={48} />
+              </div>
+              {t('signIn.start.title', { applicationName: 'LobeChat' })}
+            </Title>
+            <Paragraph className={styles.description}>{t('signIn.start.subtitle')}</Paragraph>
+          </div>
+          {/* Content */}
+          <Flex gap="small" vertical>
+            {oAuthSSOProviders ? (
+              oAuthSSOProviders.map((provider) => (
+                <Button
+                  className={styles.button}
+                  icon={AuthIcons(provider, 16)}
+                  key={provider}
+                  onClick={() => handleSignIn(provider)}
+                >
+                  {provider}
+                </Button>
+              ))
+            ) : (
+              <BtnListLoading />
+            )}
+          </Flex>
+        </Flex>
+      </div>
+      <div className={styles.footer}>
+        {/* Footer */}
+        <Row>
+          <Col span={12}>
+            <Flex justify="left" style={{ height: '100%' }}>
+              <BrandWatermark />
+            </Flex>
+          </Col>
+          <Col offset={4} span={8}>
+            <Flex justify="right">
+              {footerBtns.map((btn) => (
+                <Button key={btn.id} onClick={() => router.push(btn.href)} size="small" type="text">
+                  {btn.label}
+                </Button>
+              ))}
+            </Flex>
+          </Col>
+        </Row>
+      </div>
+    </div>
+  );
+});

package/src/app/[variants]/(auth)/next-auth/signin/page.tsx

@@ -0,0 +1,11 @@
+import { Suspense } from 'react';
+
+import Loading from '@/components/Loading/BrandTextLoading';
+
+import AuthSignInBox from './AuthSignInBox';
+
+export default () => (
+  <Suspense fallback={<Loading />}>
+    <AuthSignInBox />
+  </Suspense>
+);

package/src/app/[variants]/(main)/profile/(home)/features/SSOProvidersList/index.tsx

@@ -10,7 +10,7 @@ import { userService } from '@/services/user';
 import { useUserStore } from '@/store/user';
 import { userProfileSelectors } from '@/store/user/selectors';
 
-import AuthIcons from './AuthIcons';
+import AuthIcons from '@/components/NextAuth/AuthIcons';
 
 const { Item } = List;
 

package/src/{app/[variants]/(main)/profile/(home)/features/SSOProvidersList → components/NextAuth}/AuthIcons.tsx

@@ -12,10 +12,6 @@ import {
 } from '@lobehub/ui/icons';
 import React from 'react';
 
-const iconProps = {
-  size: 32,
-};
-
 const iconComponents: { [key: string]: React.ElementType } = {
   'auth0': Auth0,
   'authelia': Authelia.Color,
@@ -29,9 +25,15 @@ const iconComponents: { [key: string]: React.ElementType } = {
   'zitadel': Zitadel.Color,
 };
 
-const AuthIcons = (id: string) => {
+/**
+ * Get the auth icons component for the given id
+ * @param id 
+ * @param size default is 36
+ * @returns 
+ */
+const AuthIcons = (id: string, size = 36) => {
   const IconComponent = iconComponents[id] || iconComponents.default;
-  return <IconComponent {...iconProps} />;
+  return <IconComponent size={size}/>;
 };
 
 export default AuthIcons;

package/src/libs/agent-runtime/UniformRuntime/index.ts

@@ -0,0 +1,114 @@
+import { LobeRuntimeAI } from '../BaseAI';
+import { LobeOpenAI } from '../openai';
+import { providerRuntimeMap } from '../runtimeMap';
+import {
+  ChatCompetitionOptions,
+  type ChatCompletionErrorPayload,
+  ChatStreamPayload,
+  EmbeddingsOptions,
+  EmbeddingsPayload,
+  TextToImagePayload,
+  TextToSpeechPayload,
+} from '../types';
+
+export interface RuntimeItem {
+  id: string;
+  models?: string[];
+  runtime: LobeRuntimeAI;
+}
+
+interface ProviderInitParams extends Record<string, any> {
+  accessKeyId?: string;
+  accessKeySecret?: string;
+  apiKey?: string;
+  apiVersion?: string;
+  baseURL?: string;
+  baseURLOrAccountID?: string;
+  dangerouslyAllowBrowser?: boolean;
+  region?: string;
+  sessionToken?: string;
+}
+
+interface ProviderInstance {
+  apiType: keyof typeof providerRuntimeMap;
+  models?: string[];
+  params: ProviderInitParams;
+  runtime?: typeof LobeOpenAI;
+}
+
+interface UniformRuntimeOptions {
+  chat?: {
+    handleError?: (error: any) => Omit<ChatCompletionErrorPayload, 'provider'> | undefined;
+  };
+}
+
+class UniformRuntime {
+  private _runtimes: RuntimeItem[];
+  private _options: UniformRuntimeOptions;
+
+  constructor(id: string, providers: ProviderInstance[], options: UniformRuntimeOptions) {
+    if (providers.length === 0) {
+      throw new Error('empty providers');
+    }
+
+    this._runtimes = providers.map((options) => {
+      const providerAI = options.runtime ?? providerRuntimeMap[options.apiType] ?? LobeOpenAI;
+      const runtime: LobeRuntimeAI = new providerAI({ ...options.params, id });
+
+      return { id: options.apiType, models: options.models, runtime };
+    });
+
+    this._options = options;
+  }
+
+  // 检查下是否能匹配到特定模型，否则默认使用第一个 runtime
+  getRuntimeByModel(model: string) {
+    const runtimeItem =
+      this._runtimes.find((runtime) => runtime.models && runtime.models.includes(model)) ||
+      this._runtimes[0];
+
+    return runtimeItem.runtime;
+  }
+
+  async chat(payload: ChatStreamPayload, options?: ChatCompetitionOptions) {
+    try {
+      const runtime = this.getRuntimeByModel(payload.model);
+
+      return await runtime.chat(payload, options);
+    } catch (e) {
+      if (this._options.chat?.handleError) {
+        const error = this._options.chat.handleError(e);
+
+        if (error) {
+          throw error;
+        }
+      }
+
+      throw e;
+    }
+  }
+
+  async textToImage(payload: TextToImagePayload) {
+    const runtime = this.getRuntimeByModel(payload.model);
+
+    return runtime.textToImage?.(payload);
+  }
+
+  async models() {
+    return this._runtimes[0].runtime.models?.();
+  }
+
+  async embeddings(payload: EmbeddingsPayload, options?: EmbeddingsOptions) {
+    const runtime = this.getRuntimeByModel(payload.model);
+
+    return runtime.embeddings?.(payload, options);
+  }
+
+  async textToSpeech(payload: TextToSpeechPayload, options?: EmbeddingsOptions) {
+    const runtime = this.getRuntimeByModel(payload.model);
+
+    return runtime.textToSpeech?.(payload, options);
+  }
+}
+
+export default UniformRuntime;

package/src/libs/agent-runtime/anthropic/handleAnthropicError.ts

@@ -0,0 +1,15 @@
+export const handleAnthropicError = (error: any) => {
+  let errorResult: any = error;
+
+  if (error.error) {
+    errorResult = error.error;
+
+    if ('error' in errorResult) {
+      errorResult = errorResult.error;
+    }
+  } else {
+    errorResult = { headers: error.headers, stack: error.stack, status: error.status };
+  }
+
+  return { errorResult };
+};

package/src/libs/agent-runtime/anthropic/index.test.ts

@@ -44,6 +44,15 @@ describe('LobeAnthropicAI', () => {
       expect(instance).toBeInstanceOf(LobeAnthropicAI);
       expect(instance.baseURL).toBe('https://api.anthropic.proxy');
     });
+
+    it('should correctly initialize with different id', async () => {
+      const instance = new LobeAnthropicAI({
+        apiKey: 'test_api_key',
+        id: 'abc',
+      });
+      expect(instance).toBeInstanceOf(LobeAnthropicAI);
+      expect(instance['id']).toBe('abc');
+    });
   });
 
   describe('chat', () => {
@@ -347,7 +356,7 @@ describe('LobeAnthropicAI', () => {
           // Assert
           expect(e).toEqual({
             endpoint: 'https://api.anthropic.com',
-            error: apiError,
+            error: apiError.error.error,
             errorType: bizErrorType,
             provider,
           });

package/src/libs/agent-runtime/anthropic/index.ts

@@ -2,18 +2,23 @@
 import '@anthropic-ai/sdk/shims/web';
 import Anthropic from '@anthropic-ai/sdk';
 import { ClientOptions } from 'openai';
+import type { ChatModelCard } from '@/types/llm';
 
 import { LobeRuntimeAI } from '../BaseAI';
 import { AgentRuntimeErrorType } from '../error';
-import { ChatCompetitionOptions, ChatStreamPayload, ModelProvider } from '../types';
+import {
+  ChatCompetitionOptions,
+  type ChatCompletionErrorPayload,
+  ChatStreamPayload,
+  ModelProvider,
+} from '../types';
 import { AgentRuntimeError } from '../utils/createError';
 import { debugStream } from '../utils/debugStream';
 import { desensitizeUrl } from '../utils/desensitizeUrl';
 import { buildAnthropicMessages, buildAnthropicTools } from '../utils/anthropicHelpers';
 import { StreamingResponse } from '../utils/response';
 import { AnthropicStream } from '../utils/streams';
-
-import type { ChatModelCard } from '@/types/llm';
+import { handleAnthropicError } from './handleAnthropicError';
 
 export interface AnthropicModelCard {
   display_name: string;
@@ -22,18 +27,24 @@ export interface AnthropicModelCard {
 
 const DEFAULT_BASE_URL = 'https://api.anthropic.com';
 
+interface AnthropicAIParams extends ClientOptions {
+  id?: string;
+}
+
 export class LobeAnthropicAI implements LobeRuntimeAI {
   private client: Anthropic;
 
   baseURL: string;
   apiKey?: string;
+  private id: string;
 
-  constructor({ apiKey, baseURL = DEFAULT_BASE_URL, ...res }: ClientOptions = {}) {
+  constructor({ apiKey, baseURL = DEFAULT_BASE_URL, id, ...res }: AnthropicAIParams = {}) {
     if (!apiKey) throw AgentRuntimeError.createError(AgentRuntimeErrorType.InvalidProviderAPIKey);
 
     this.client = new Anthropic({ apiKey, baseURL, ...res });
     this.baseURL = this.client.baseURL;
     this.apiKey = apiKey;
+    this.id = id || ModelProvider.Anthropic;
   }
 
   async chat(payload: ChatStreamPayload, options?: ChatCompetitionOptions) {
@@ -57,42 +68,7 @@ export class LobeAnthropicAI implements LobeRuntimeAI {
         headers: options?.headers,
       });
     } catch (error) {
-      let desensitizedEndpoint = this.baseURL;
-
-      if (this.baseURL !== DEFAULT_BASE_URL) {
-        desensitizedEndpoint = desensitizeUrl(this.baseURL);
-      }
-
-      if ('status' in (error as any)) {
-        switch ((error as Response).status) {
-          case 401: {
-            throw AgentRuntimeError.chat({
-              endpoint: desensitizedEndpoint,
-              error: error as any,
-              errorType: AgentRuntimeErrorType.InvalidProviderAPIKey,
-              provider: ModelProvider.Anthropic,
-            });
-          }
-
-          case 403: {
-            throw AgentRuntimeError.chat({
-              endpoint: desensitizedEndpoint,
-              error: error as any,
-              errorType: AgentRuntimeErrorType.LocationNotSupportError,
-              provider: ModelProvider.Anthropic,
-            });
-          }
-          default: {
-            break;
-          }
-        }
-      }
-      throw AgentRuntimeError.chat({
-        endpoint: desensitizedEndpoint,
-        error: error as any,
-        errorType: AgentRuntimeErrorType.ProviderBizError,
-        provider: ModelProvider.Anthropic,
-      });
+      throw this.handleError(error);
     }
   }
 
@@ -191,6 +167,48 @@ export class LobeAnthropicAI implements LobeRuntimeAI {
       })
       .filter(Boolean) as ChatModelCard[];
   }
+
+  private handleError(error: any): ChatCompletionErrorPayload {
+    let desensitizedEndpoint = this.baseURL;
+
+    if (this.baseURL !== DEFAULT_BASE_URL) {
+      desensitizedEndpoint = desensitizeUrl(this.baseURL);
+    }
+
+    if ('status' in (error as any)) {
+      switch ((error as Response).status) {
+        case 401: {
+          throw AgentRuntimeError.chat({
+            endpoint: desensitizedEndpoint,
+            error: error as any,
+            errorType: AgentRuntimeErrorType.InvalidProviderAPIKey,
+            provider: this.id,
+          });
+        }
+
+        case 403: {
+          throw AgentRuntimeError.chat({
+            endpoint: desensitizedEndpoint,
+            error: error as any,
+            errorType: AgentRuntimeErrorType.LocationNotSupportError,
+            provider: this.id,
+          });
+        }
+        default: {
+          break;
+        }
+      }
+    }
+
+    const { errorResult } = handleAnthropicError(error);
+
+    throw AgentRuntimeError.chat({
+      endpoint: desensitizedEndpoint,
+      error: errorResult,
+      errorType: AgentRuntimeErrorType.ProviderBizError,
+      provider: this.id,
+    });
+  }
 }
 
 export default LobeAnthropicAI;

package/src/libs/agent-runtime/azureai/index.ts

@@ -13,10 +13,16 @@ import { transformResponseToStream } from '../utils/openaiCompatibleFactory';
 import { StreamingResponse } from '../utils/response';
 import { OpenAIStream, createSSEDataExtractor } from '../utils/streams';
 
+interface AzureAIParams {
+  apiKey?: string;
+  apiVersion?: string;
+  baseURL?: string;
+}
+
 export class LobeAzureAI implements LobeRuntimeAI {
   client: ModelClient;
 
-  constructor(params?: { apiKey?: string; apiVersion?: string; baseURL?: string }) {
+  constructor(params?: AzureAIParams) {
     if (!params?.apiKey || !params?.baseURL)
       throw AgentRuntimeError.createError(AgentRuntimeErrorType.InvalidProviderAPIKey);
 

package/src/libs/agent-runtime/github/index.ts

@@ -1,9 +1,9 @@
+import type { ChatModelCard } from '@/types/llm';
+
 import { AgentRuntimeErrorType } from '../error';
-import { pruneReasoningPayload } from '../openai';
 import { ModelProvider } from '../types';
 import { LobeOpenAICompatibleFactory } from '../utils/openaiCompatibleFactory';
-
-import type { ChatModelCard } from '@/types/llm';
+import { pruneReasoningPayload } from '../utils/openaiHelpers';
 
 export interface GithubModelCard {
   description: string;
@@ -39,27 +39,20 @@ export const LobeGithubAI = LobeOpenAICompatibleFactory({
   models: async ({ client }) => {
     const { LOBE_DEFAULT_MODEL_LIST } = await import('@/config/aiModels');
 
-    const functionCallKeywords = [
-      'function',
-      'tool',
-    ];
+    const functionCallKeywords = ['function', 'tool'];
 
-    const visionKeywords = [
-      'vision',
-    ];
+    const visionKeywords = ['vision'];
 
-    const reasoningKeywords = [
-      'deepseek-r1',
-      'o1',
-      'o3',
-    ];
+    const reasoningKeywords = ['deepseek-r1', 'o1', 'o3'];
 
     const modelsPage = (await client.models.list()) as any;
     const modelList: GithubModelCard[] = modelsPage.body;
 
     return modelList
       .map((model) => {
-        const knownModel = LOBE_DEFAULT_MODEL_LIST.find((m) => model.name.toLowerCase() === m.id.toLowerCase());
+        const knownModel = LOBE_DEFAULT_MODEL_LIST.find(
+          (m) => model.name.toLowerCase() === m.id.toLowerCase(),
+        );
 
         return {
           contextWindowTokens: knownModel?.contextWindowTokens ?? undefined,
@@ -67,18 +60,20 @@ export const LobeGithubAI = LobeOpenAICompatibleFactory({
           displayName: model.friendly_name,
           enabled: knownModel?.enabled || false,
           functionCall:
-            functionCallKeywords.some(keyword => model.description.toLowerCase().includes(keyword))
-            || knownModel?.abilities?.functionCall
-            || false,
+            functionCallKeywords.some((keyword) =>
+              model.description.toLowerCase().includes(keyword),
+            ) ||
+            knownModel?.abilities?.functionCall ||
+            false,
           id: model.name,
           reasoning:
-            reasoningKeywords.some(keyword => model.name.toLowerCase().includes(keyword))
-            || knownModel?.abilities?.reasoning
-            || false,
+            reasoningKeywords.some((keyword) => model.name.toLowerCase().includes(keyword)) ||
+            knownModel?.abilities?.reasoning ||
+            false,
           vision:
-            visionKeywords.some(keyword => model.description.toLowerCase().includes(keyword))
-            || knownModel?.abilities?.vision
-            || false,
+            visionKeywords.some((keyword) => model.description.toLowerCase().includes(keyword)) ||
+            knownModel?.abilities?.vision ||
+            false,
         };
       })
       .filter(Boolean) as ChatModelCard[];

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

@@ -19,6 +19,8 @@ export { LobeQwenAI } from './qwen';
 export { LobeTogetherAI } from './togetherai';
 export * from './types';
 export { AgentRuntimeError } from './utils/createError';
+export { LobeOpenAICompatibleFactory } from './utils/openaiCompatibleFactory';
+export { pruneReasoningPayload } from './utils/openaiHelpers';
 export { LobeVolcengineAI } from './volcengine';
 export { LobeZeroOneAI } from './zeroone';
 export { LobeZhipuAI } from './zhipu';

package/src/libs/agent-runtime/openai/index.ts

@@ -1,33 +1,13 @@
-import { disableStreamModels, systemToUserModels } from '@/const/models';
 import type { ChatModelCard } from '@/types/llm';
 
-import { ChatStreamPayload, ModelProvider, OpenAIChatMessage } from '../types';
+import { ModelProvider } from '../types';
 import { LobeOpenAICompatibleFactory } from '../utils/openaiCompatibleFactory';
+import { pruneReasoningPayload } from '../utils/openaiHelpers';
 
 export interface OpenAIModelCard {
   id: string;
 }
 
-export const pruneReasoningPayload = (payload: ChatStreamPayload) => {
-  return {
-    ...payload,
-    frequency_penalty: 0,
-    messages: payload.messages.map((message: OpenAIChatMessage) => ({
-      ...message,
-      role:
-        message.role === 'system'
-          ? systemToUserModels.has(payload.model)
-            ? 'user'
-            : 'developer'
-          : message.role,
-    })),
-    presence_penalty: 0,
-    stream: !disableStreamModels.has(payload.model),
-    temperature: 1,
-    top_p: 1,
-  };
-};
-
 export const LobeOpenAI = LobeOpenAICompatibleFactory({
   baseURL: 'https://api.openai.com/v1',
   chatCompletion: {