@lobehub/chat 1.47.5 → 1.47.7

package/CHANGELOG.md

@@ -2,6 +2,56 @@
 
 # Changelog
 
+### [Version 1.47.7](https://github.com/lobehub/lobe-chat/compare/v1.47.6...v1.47.7)
+
+<sup>Released on **2025-01-20**</sup>
+
+#### ♻ Code Refactoring
+
+- **misc**: Remove redundant payload remapping in client-fetch.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Code refactoring
+
+- **misc**: Remove redundant payload remapping in client-fetch, closes [#5267](https://github.com/lobehub/lobe-chat/issues/5267) ([0c7dd82](https://github.com/lobehub/lobe-chat/commit/0c7dd82))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
+### [Version 1.47.6](https://github.com/lobehub/lobe-chat/compare/v1.47.5...v1.47.6)
+
+<sup>Released on **2025-01-20**</sup>
+
+#### ♻ Code Refactoring
+
+- **misc**: Refactor provider code.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Code refactoring
+
+- **misc**: Refactor provider code, closes [#5516](https://github.com/lobehub/lobe-chat/issues/5516) ([fa1a07f](https://github.com/lobehub/lobe-chat/commit/fa1a07f))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.47.5](https://github.com/lobehub/lobe-chat/compare/v1.47.4...v1.47.5)
 
 <sup>Released on **2025-01-20**</sup>

package/changelog/v1.json

@@ -1,4 +1,22 @@
 [
+  {
+    "children": {
+      "improvements": [
+        "Remove redundant payload remapping in client-fetch."
+      ]
+    },
+    "date": "2025-01-20",
+    "version": "1.47.7"
+  },
+  {
+    "children": {
+      "improvements": [
+        "Refactor provider code."
+      ]
+    },
+    "date": "2025-01-20",
+    "version": "1.47.6"
+  },
   {
     "children": {
       "improvements": [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.47.5",
+  "version": "1.47.7",
   "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/(main)/settings/provider/(detail)/[id]/index.tsx

@@ -6,10 +6,16 @@ import { Flexbox } from 'react-layout-kit';
 import ModelList from '../../features/ModelList';
 import ProviderConfig, { ProviderConfigProps } from '../../features/ProviderConfig';
 
-const ProviderDetail = memo<ProviderConfigProps>((card) => {
+interface ProviderDetailProps extends ProviderConfigProps {
+  showConfig?: boolean;
+}
+const ProviderDetail = memo<ProviderDetailProps>(({ showConfig = true, ...card }) => {
   return (
     <Flexbox gap={24} paddingBlock={8}>
-      <ProviderConfig {...card} />
+      {/* ↓ cloud slot ↓ */}
+
+      {/* ↑ cloud slot ↑ */}
+      {showConfig && <ProviderConfig {...card} />}
       <ModelList id={card.id} />
     </Flexbox>
   );

package/src/app/(main)/settings/provider/(list)/ProviderGrid/Card.tsx

@@ -1,7 +1,6 @@
 import { ProviderCombine, ProviderIcon } from '@lobehub/icons';
 import { Avatar } from '@lobehub/ui';
 import { Divider, Skeleton, Typography } from 'antd';
-import { createStyles } from 'antd-style';
 import Link from 'next/link';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -11,56 +10,9 @@ import InstantSwitch from '@/components/InstantSwitch';
 import { useAiInfraStore } from '@/store/aiInfra';
 import { AiProviderListItem } from '@/types/aiProvider';
 
-const { Paragraph } = Typography;
-
-const useStyles = createStyles(({ css, token, isDarkMode }) => ({
-  banner: css`
-    opacity: ${isDarkMode ? 0.9 : 0.4};
-  `,
-  container: css`
-    position: relative;
-
-    overflow: hidden;
-
-    height: 100%;
-    border-radius: 12px;
-
-    background: ${token.colorBgContainer};
-    box-shadow: 0 0 1px 1px ${isDarkMode ? token.colorFillQuaternary : token.colorFillSecondary}
-      inset;
+import { useStyles } from './style';
 
-    transition: box-shadow 0.2s ${token.motionEaseInOut};
-
-    &:hover {
-      box-shadow: 0 0 1px 1px ${isDarkMode ? token.colorFillSecondary : token.colorFill} inset;
-    }
-  `,
-  desc: css`
-    min-height: 44px;
-    margin-block-end: 0 !important;
-    color: ${token.colorTextDescription};
-  `,
-  tagBlue: css`
-    color: ${token.geekblue};
-    background: ${token.geekblue1};
-  `,
-  tagGreen: css`
-    color: ${token.green};
-    background: ${token.green1};
-  `,
-  time: css`
-    color: ${token.colorTextDescription};
-  `,
-  title: css`
-    zoom: 1.2;
-    margin-block-end: 0 !important;
-    font-size: 18px !important;
-    font-weight: bold;
-  `,
-  token: css`
-    font-family: ${token.fontFamilyCode};
-  `,
-}));
+const { Paragraph } = Typography;
 
 interface ProviderCardProps extends AiProviderListItem {
   loading?: boolean;
@@ -78,6 +30,10 @@ const ProviderCard = memo<ProviderCardProps>(
         </Flexbox>
       );
 
+    /* ↓ cloud slot ↓ */
+
+    /* ↑ cloud slot ↑ */
+
     return (
       <Flexbox className={cx(styles.container)} gap={24}>
         <Flexbox gap={12} padding={16} width={'100%'}>

package/src/app/(main)/settings/provider/(list)/ProviderGrid/style.ts

@@ -0,0 +1,50 @@
+import { createStyles } from 'antd-style';
+
+export const useStyles = createStyles(({ css, token, isDarkMode }) => ({
+  banner: css`
+    opacity: ${isDarkMode ? 0.9 : 0.4};
+  `,
+  container: css`
+    position: relative;
+
+    overflow: hidden;
+
+    height: 100%;
+    border-radius: 12px;
+
+    background: ${token.colorBgContainer};
+    box-shadow: 0 0 1px 1px ${isDarkMode ? token.colorFillQuaternary : token.colorFillSecondary}
+      inset;
+
+    transition: box-shadow 0.2s ${token.motionEaseInOut};
+
+    &:hover {
+      box-shadow: 0 0 1px 1px ${isDarkMode ? token.colorFillSecondary : token.colorFill} inset;
+    }
+  `,
+  desc: css`
+    min-height: 44px;
+    margin-block-end: 0 !important;
+    color: ${token.colorTextDescription};
+  `,
+  tagBlue: css`
+    color: ${token.geekblue};
+    background: ${token.geekblue1};
+  `,
+  tagGreen: css`
+    color: ${token.green};
+    background: ${token.green1};
+  `,
+  time: css`
+    color: ${token.colorTextDescription};
+  `,
+  title: css`
+    zoom: 1.2;
+    margin-block-end: 0 !important;
+    font-size: 18px !important;
+    font-weight: bold;
+  `,
+  token: css`
+    font-family: ${token.fontFamilyCode};
+  `,
+}));

package/src/services/__tests__/_auth.test.ts

@@ -92,6 +92,11 @@ describe('getProviderAuthPayload', () => {
       awsAccessKeyId: mockBedrockConfig.accessKeyId,
       awsRegion: mockBedrockConfig.region,
       awsSecretAccessKey: mockBedrockConfig.secretAccessKey,
+      accessKeyId: mockBedrockConfig.accessKeyId,
+      accessKeySecret: mockBedrockConfig.secretAccessKey,
+      awsSessionToken: undefined,
+      region: mockBedrockConfig.region,
+      sessionToken: undefined,
     });
   });
 
@@ -107,6 +112,7 @@ describe('getProviderAuthPayload', () => {
     expect(payload).toEqual({
       apiKey: mockAzureConfig.apiKey,
       azureApiVersion: mockAzureConfig.apiVersion,
+      apiVersion: mockAzureConfig.apiVersion,
       baseURL: mockAzureConfig.endpoint,
     });
   });
@@ -151,6 +157,24 @@ describe('getProviderAuthPayload', () => {
     });
   });
 
+  it('should return correct payload for Cloudflare provider', () => {
+    // 假设的 Cloudflare 配置
+    const mockCloudflareConfig = {
+      apiKey: 'cloudflare-api-key',
+      baseURLOrAccountID: 'cloudflare-base-url-or-account-id',
+    };
+    act(() => {
+      setModelProviderConfig('cloudflare', mockCloudflareConfig);
+    });
+
+    const payload = getProviderAuthPayload(ModelProvider.Cloudflare, mockCloudflareConfig);
+    expect(payload).toEqual({
+      apiKey: mockCloudflareConfig.apiKey,
+      baseURLOrAccountID: mockCloudflareConfig.baseURLOrAccountID,
+      cloudflareBaseURLOrAccountID: mockCloudflareConfig.baseURLOrAccountID,
+    });
+  });
+
   it('should return an empty object or throw an error for an unknown provider', () => {
     const payload = getProviderAuthPayload('UnknownProvider', {});
     expect(payload).toEqual({});

package/src/services/_auth.ts

@@ -31,11 +31,19 @@ export const getProviderAuthPayload = (
       const apiKey = (awsSecretAccessKey || '') + (awsAccessKeyId || '');
 
       return {
+        accessKeyId,
+        accessKeySecret: awsSecretAccessKey,
         apiKey,
+        /** @deprecated */
         awsAccessKeyId,
+        /** @deprecated */
         awsRegion: region,
+        /** @deprecated */
         awsSecretAccessKey,
+        /** @deprecated */
         awsSessionToken: sessionToken,
+        region,
+        sessionToken,
       };
     }
 
@@ -54,7 +62,10 @@ export const getProviderAuthPayload = (
     case ModelProvider.Azure: {
       return {
         apiKey: keyVaults.apiKey,
-        azureApiVersion: keyVaults.apiVersion,
+        
+        apiVersion: keyVaults.apiVersion,
+        /** @deprecated */
+azureApiVersion: keyVaults.apiVersion,
         baseURL: keyVaults.baseURL || keyVaults.endpoint,
       };
     }
@@ -66,7 +77,10 @@ export const getProviderAuthPayload = (
     case ModelProvider.Cloudflare: {
       return {
         apiKey: keyVaults?.apiKey,
-        cloudflareBaseURLOrAccountID: keyVaults?.baseURLOrAccountID,
+        
+        baseURLOrAccountID: keyVaults?.baseURLOrAccountID,
+        /** @deprecated */
+cloudflareBaseURLOrAccountID: keyVaults?.baseURLOrAccountID,
       };
     }
 

package/src/services/chat.ts

@@ -124,90 +124,25 @@ interface CreateAssistantMessageStream extends FetchSSEOptions {
  * **Note**: if you try to fetch directly, use `fetchOnClient` instead.
  */
 export function initializeWithClientStore(provider: string, payload: any) {
-  // add auth payload
+  /**
+   * Since #5267, we map parameters for client-fetch in function `getProviderAuthPayload`
+   * which called by `createPayloadWithKeyVaults` below.
+   * @see https://github.com/lobehub/lobe-chat/pull/5267
+   * @file src/services/_auth.ts
+   */
   const providerAuthPayload = { ...payload, ...createPayloadWithKeyVaults(provider) };
   const commonOptions = {
-    // Some provider base openai sdk, so enable it run on browser
+    // Allow OpenAI SDK and Anthropic SDK run on browser
     dangerouslyAllowBrowser: true,
   };
-  let providerOptions = {};
-
-  switch (provider) {
-    default:
-    case ModelProvider.OpenAI: {
-      providerOptions = {
-        baseURL: providerAuthPayload?.baseURL,
-      };
-      break;
-    }
-    case ModelProvider.Azure: {
-      providerOptions = {
-        apiKey: providerAuthPayload?.apiKey,
-        apiVersion: providerAuthPayload?.azureApiVersion,
-      };
-      break;
-    }
-    case ModelProvider.Google: {
-      providerOptions = {
-        baseURL: providerAuthPayload?.baseURL,
-      };
-      break;
-    }
-    case ModelProvider.Bedrock: {
-      if (providerAuthPayload?.apiKey) {
-        providerOptions = {
-          accessKeyId: providerAuthPayload?.awsAccessKeyId,
-          accessKeySecret: providerAuthPayload?.awsSecretAccessKey,
-          region: providerAuthPayload?.awsRegion,
-          sessionToken: providerAuthPayload?.awsSessionToken,
-        };
-      }
-      break;
-    }
-    case ModelProvider.Ollama: {
-      providerOptions = {
-        baseURL: providerAuthPayload?.baseURL,
-      };
-      break;
-    }
-    case ModelProvider.Perplexity: {
-      providerOptions = {
-        apikey: providerAuthPayload?.apiKey,
-        baseURL: providerAuthPayload?.baseURL,
-      };
-      break;
-    }
-    case ModelProvider.Anthropic: {
-      providerOptions = {
-        baseURL: providerAuthPayload?.baseURL,
-      };
-      break;
-    }
-    case ModelProvider.Groq: {
-      providerOptions = {
-        apikey: providerAuthPayload?.apiKey,
-        baseURL: providerAuthPayload?.baseURL,
-      };
-      break;
-    }
-    case ModelProvider.Cloudflare: {
-      providerOptions = {
-        apikey: providerAuthPayload?.apiKey,
-        baseURLOrAccountID: providerAuthPayload?.cloudflareBaseURLOrAccountID,
-      };
-      break;
-    }
-  }
-
   /**
    * Configuration override order:
-   * payload -> providerOptions -> providerAuthPayload -> commonOptions
+   * payload -> providerAuthPayload -> commonOptions
    */
   return AgentRuntime.initializeWithProviderOptions(provider, {
     [provider]: {
       ...commonOptions,
       ...providerAuthPayload,
-      ...providerOptions,
       ...payload,
     },
   });

package/src/types/llm.ts

@@ -119,13 +119,15 @@ export interface ModelProviderCard {
    * @deprecated
    */
   showApiKey?: boolean;
-
   /**
    * whether show checker in the provider config
    * @deprecated
    */
   showChecker?: boolean;
-
+  /**
+   * whether to show the provider config
+   */
+  showConfig?: boolean;
   /**
    * whether to smoothing the output
    * @deprecated