@lobehub/chat 0.85.1 → 0.85.3

package/.github/workflows/issue-check-inactive.yml

@@ -18,5 +18,6 @@ jobs:
         uses: actions-cool/issues-helper@v3
         with:
           actions: 'check-inactive'
+          token: ${{ secrets.GH_TOKEN }}
           inactive-label: 'Inactive'
           inactive-day: 30

package/.github/workflows/issue-close-require.yml

@@ -18,6 +18,7 @@ jobs:
         uses: actions-cool/issues-helper@v3
         with:
           actions: 'close-issues'
+          token: ${{ secrets.GH_TOKEN }}
           labels: '✅ Fixed'
           inactive-day: 3
           body: |
@@ -28,6 +29,7 @@ jobs:
         uses: actions-cool/issues-helper@v3
         with:
           actions: 'close-issues'
+          token: ${{ secrets.GH_TOKEN }}
           labels: '🤔 Need Reproduce'
           inactive-day: 3
           body: |
@@ -38,6 +40,7 @@ jobs:
         uses: actions-cool/issues-helper@v3
         with:
           actions: 'close-issues'
+          token: ${{ secrets.GH_TOKEN }}
           labels: "🙅🏻‍♀️ WON'T DO"
           inactive-day: 3
           body: |

package/.github/workflows/issue-remove-inactive.yml

@@ -21,5 +21,6 @@ jobs:
         uses: actions-cool/issues-helper@v3
         with:
           actions: 'remove-labels'
+          token: ${{ secrets.GH_TOKEN }}
           issue-number: ${{ github.event.issue.number }}
           labels: 'Inactive'

package/.github/workflows/pre-welcome.yml

@@ -14,9 +14,10 @@ jobs:
         with:
           token: ${{ secrets.GITHUB_TOKEN }}
           comment: |
-            Great PR @${{ github.event.pull_request.user.login }}. The growth of project is inseparable from user feedback and contribution, thanks for your contribution ❤️
+            🎉 Great PR @${{ github.event.pull_request.user.login }} 🎉
 
-            非常棒的 PR @${{ github.event.pull_request.user.login }}. 项目的成长离不开用户反馈和贡献，感谢您的贡献 ❤️
-          emoji: 'heart'
+            The growth of project is inseparable from user feedback and contribution, thanks for your contribution ❤️
+
+            项目的成长离不开用户反馈和贡献，感谢您的贡献 ❤️
+          emoji: 'hooray'
           pr-emoji: '+1, heart'
-          close: true

package/CHANGELOG.md

@@ -2,6 +2,57 @@
 
 # Changelog
 
+### [Version 0.85.3](https://github.com/lobehub/lobe-chat/compare/v0.85.2...v0.85.3)
+
+<sup>Released on **2023-10-10**</sup>
+
+#### 💄 Styles
+
+- **misc**: Add new components, modify display properties, and update settings feature, Replace 100vh with 100% to fix mobile scroll problem.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Styles
+
+- **misc**: Add new components, modify display properties, and update settings feature ([87a4a46](https://github.com/lobehub/lobe-chat/commit/87a4a46))
+- **misc**: Replace 100vh with 100% to fix mobile scroll problem ([2ef3c94](https://github.com/lobehub/lobe-chat/commit/2ef3c94))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
+### [Version 0.85.2](https://github.com/lobehub/lobe-chat/compare/v0.85.1...v0.85.2)
+
+<sup>Released on **2023-10-10**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Add apikey form when there is no default api key in env.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Add apikey form when there is no default api key in env, closes [#290](https://github.com/lobehub/lobe-chat/issues/290) ([2c907e9](https://github.com/lobehub/lobe-chat/commit/2c907e9))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 0.85.1](https://github.com/lobehub/lobe-chat/compare/v0.85.0...v0.85.1)
 
 <sup>Released on **2023-10-10**</sup>

package/locales/en_US/error.json

@@ -25,12 +25,13 @@
     "PluginApiNotFound": "Sorry, the API does not exist in the plugin's manifest. Please check if your request method matches the plugin manifest API",
     "PluginApiParamsError": "Sorry, the input parameter validation for the plugin request failed. Please check if the input parameters match the API description",
     "PluginSettingsInvalid": "This plugin needs to be correctly configured before it can be used. Please check if your configuration is correct",
-    "PluginServerError": "Plugin server request returned an error. Please check your plugin manifest file, plugin configuration, or server implementation based on the error information below"
+    "PluginServerError": "Plugin server request returned an error. Please check your plugin manifest file, plugin configuration, or server implementation based on the error information below",
+    "NoAPIKey": "OpenAI API Key is empty, please add a custom OpenAI API Key"
   },
   "unlock": {
     "apikey": {
-      "description": "Enter your OpenAI API Key to bypass password verification. The application will not record your API Key.",
-      "title": "Use Custom API Key"
+      "title": "Use Custom API Key",
+      "description": "Enter your OpenAI API Key to start the conversation. The application will not record your API Key."
     },
     "confirm": "Confirm and Retry",
     "password": {

package/locales/ja_JP/error.json

@@ -25,12 +25,13 @@
     "PluginMarketIndexInvalid": "申し訳ありませんが、プラグインのインデックスの検証に失敗しました。インデックスファイルの形式が正しいかどうかを確認してください",
     "PluginManifestNotFound": "申し訳ありませんが、サーバーでプラグインのマニフェストファイル (manifest.json) が見つかりませんでした。プラグインのマニフェストファイルのアドレスが正しいかどうかを確認してください",
     "PluginManifestInvalid": "申し訳ありませんが、このプラグインのマニフェストの検証に失敗しました。マニフェストの形式が正しいかどうかを確認してください",
-    "PluginApiNotFound": "申し訳ありませんが、プラグインのマニフェストに指定されたAPIが見つかりませんでした。リクエストメソッドとプラグインのマニフェストのAPIが一致しているかどうかを確認してください"
+    "PluginApiNotFound": "申し訳ありませんが、プラグインのマニフェストに指定されたAPIが見つかりませんでした。リクエストメソッドとプラグインのマニフェストのAPIが一致しているかどうかを確認してください",
+    "NoAPIKey": "OpenAI APIキーが空です。カスタムOpenAI APIキーを追加してください。"
   },
   "unlock": {
     "apikey": {
-      "description": "OpenAI APIキーを入力すると、パスワード認証をバイパスできます。アプリはAPIキーを記録しません",
-      "title": "カスタムAPIキーの使用"
+      "title": "カスタムAPIキーの使用",
+      "description": "OpenAI APIキーを入力すると、会話を開始できます。アプリはあなたのAPIキーを記録しません。"
     },
     "closeMessage": "ヒントを閉じる",
     "confirm": "確認して再試行",

package/locales/ko_KR/error.json

@@ -25,12 +25,13 @@
     "PluginSettingsInvalid": "플러그인을 사용하려면 올바른 구성이 필요합니다. 구성이 올바른지 확인해주세요.",
     "PluginServerError": "플러그인 서버 요청이 오류로 반환되었습니다. 플러그인 설명 파일, 플러그인 구성 또는 서버 구현을 확인해주세요.",
     "InvalidAccessCode": "암호가 올바르지 않거나 비어 있습니다. 올바른 액세스 암호를 입력하거나 사용자 지정 OpenAI API 키를 추가해주세요.",
-    "OpenAIBizError": "OpenAI 서비스 요청 중 오류가 발생했습니다. 아래 정보를 확인하고 문제를 해결하거나 다시 시도해주세요."
+    "OpenAIBizError": "OpenAI 서비스 요청 중 오류가 발생했습니다. 아래 정보를 확인하고 문제를 해결하거나 다시 시도해주세요.",
+    "NoAPIKey": "OpenAI API 키가 비어 있습니다. 사용자 정의 OpenAI API 키를 추가해주세요."
   },
   "unlock": {
     "apikey": {
-      "description": "OpenAI API 키를 입력하여 암호 확인을 우회할 수 있습니다. 애플리케이션은 API 키를 기록하지 않습니다.",
-      "title": "사용자 정의 API 키 사용"
+      "title": "사용자 정의 API 키 사용",
+      "description": "OpenAI API 키를 입력하면 대화를 시작할 수 있습니다. 애플리케이션은 API 키를 기록하지 않습니다."
     },
     "closeMessage": "알림 닫기",
     "confirm": "확인 및 다시 시도",

package/locales/ru_RU/error.json

@@ -25,12 +25,13 @@
     "PluginApiNotFound": "К сожалению, API не существует в манифесте плагина. Пожалуйста, проверьте, соответствует ли ваш метод запроса API манифеста плагина",
     "PluginApiParamsError": "К сожалению, проверка входных параметров для запроса плагина не удалась. Пожалуйста, проверьте, соответствуют ли входные параметры описанию API",
     "PluginSettingsInvalid": "Этот плагин необходимо правильно настроить, прежде чем его можно будет использовать. Пожалуйста, проверьте правильность вашей конфигурации",
-    "PluginServerError": "Запрос сервера плагина возвратил ошибку. Проверьте файл манифеста плагина, конфигурацию плагина или реализацию сервера на основе информации об ошибке ниже"
+    "PluginServerError": "Запрос сервера плагина возвратил ошибку. Проверьте файл манифеста плагина, конфигурацию плагина или реализацию сервера на основе информации об ошибке ниже",
+    "NoAPIKey": "Ключ OpenAI API пуст, пожалуйста, добавьте свой собственный ключ OpenAI API"
   },
   "unlock": {
     "apikey": {
-      "description": "Введите свой ключ API OpenAI, чтобы обойти проверку пароля. Приложение не будет записывать ваш ключ API.",
-      "title": "Использовать собственный ключ API"
+      "title": "Использовать собственный ключ API",
+      "description": "Введите свой ключ API OpenAI, чтобы начать сеанс. Приложение не будет сохранять ваш ключ API."
     },
     "confirm": "Подтвердить и повторить попытку",
     "password": {

package/locales/zh_CN/error.json

@@ -25,11 +25,12 @@
     "PluginSettingsInvalid": "该插件需要正确配置后才可以使用，请检查你的配置是否正确",
     "PluginServerError": "插件服务端请求返回出错，请检查根据下面的报错信息检查你的插件描述文件、插件配置或服务端实现",
     "InvalidAccessCode": "密码不正确或为空，请输入正确的访问密码，或者添加自定义 OpenAI API Key",
-    "OpenAIBizError": "请求 OpenAI 服务出错，请根据以下信息排查或重试"
+    "OpenAIBizError": "请求 OpenAI 服务出错，请根据以下信息排查或重试",
+    "NoAPIKey": "OpenAI API Key 为空，请添加自定义 OpenAI API Key"
   },
   "unlock": {
     "apikey": {
-      "description": "输入你的 OpenAI API Key 即可绕过密码验证。应用不会记录你的 API Key",
+      "description": "输入你的 OpenAI API Key 即可开始会话。应用不会记录你的 API Key",
       "title": "使用自定义 API Key"
     },
     "closeMessage": "关闭提示",

package/locales/zh_TW/error.json

@@ -25,12 +25,13 @@
     "PluginApiNotFound": "抱歉，外掛描述檔案中不存在該 API。請檢查您的請求方法與外掛清單 API 是否相符",
     "PluginApiParamsError": "抱歉，該外掛請求的輸入參數驗證失敗。請檢查輸入參數與 API 描述資訊是否相符",
     "PluginSettingsInvalid": "該外掛需要正確設定後才可以使用。請檢查您的設定是否正確",
-    "PluginServerError": "外掛伺服器請求回傳錯誤。請根據下面的錯誤資訊檢查您的外掛描述檔案、外掛設定或伺服器實作"
+    "PluginServerError": "外掛伺服器請求回傳錯誤。請根據下面的錯誤資訊檢查您的外掛描述檔案、外掛設定或伺服器實作",
+    "NoAPIKey": "OpenAI API 金鑰為空，請添加自訂 OpenAI API 金鑰"
   },
   "unlock": {
     "apikey": {
-      "description": "輸入您的 OpenAI API Key 以繞過密碼驗證。應用程式不會記錄您的 API Key。",
-      "title": "使用自定義 API Key"
+      "title": "使用自定義 API Key",
+      "description": "輸入你的 OpenAI API Key 即可開始會話。應用程式不會記錄你的 API Key"
     },
     "confirm": "確認並重試",
     "password": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "0.85.1",
+  "version": "0.85.3",
   "description": "An open-source, extensible (Function Calling), high-performance chatbot framework. It supports one-click free deployment of your private ChatGPT/LLM web application",
   "keywords": [
     "chatbot",
@@ -128,6 +128,7 @@
     "@testing-library/jest-dom": "^6",
     "@testing-library/react": "^14",
     "@types/chroma-js": "^2",
+    "@types/lodash": "^4",
     "@types/lodash-es": "^4",
     "@types/mixpanel-browser": "^2",
     "@types/node": "^20",
@@ -146,6 +147,7 @@
     "husky": "^8",
     "jsdom": "^22",
     "lint-staged": "^14",
+    "lodash": "^4",
     "next-pwa": "^5",
     "node-fetch": "^3",
     "prettier": "^3",

package/public/manifest.json

@@ -1,7 +1,7 @@
 {
   "background_color": "#000000",
   "description": "An open-source, extensible (Function Calling), high-performance chatbot framework. It supports one-click free deployment of your private ChatGPT/LLM web application",
-  "display": "fullscreen",
+  "display": "standalone",
   "icons": [
     {
       "src": "/icons/icon-192x192.png",

package/scripts/i18nWorkflow/genDiff.ts

@@ -1,5 +1,6 @@
 import { consola } from 'consola';
 import { colors } from 'consola/utils';
+import { unset } from 'lodash';
 import { existsSync } from 'node:fs';
 
 import {
@@ -8,7 +9,7 @@ import {
   localesResourcesFilepath,
   outputLocaleJsonFilepath,
 } from './const';
-import { diff, readJSON, tagWhite, tagYellow, unset, writeJSON } from './utils';
+import { diff, readJSON, tagWhite, tagYellow, writeJSON } from './utils';
 
 export const genDiff = () => {
   consola.start(`Diff between Dev/Prod local...`);

package/scripts/i18nWorkflow/utils.ts

@@ -1,6 +1,7 @@
 import { consola } from 'consola';
 import { colors } from 'consola/utils';
 import { tocForResources } from 'i18next-resources-for-ts';
+import { isObject } from 'lodash';
 import { readFileSync, writeFileSync } from 'node:fs';
 import { resolve } from 'node:path';
 
@@ -58,8 +59,8 @@ export const diff = (obj1: any, obj2: any, prefix: string = ''): string[] => {
   let result: string[] = [];
   for (const key in obj1) {
     if (!obj2[key]) continue;
-    if (typeof obj1[key] === 'object' && obj1[key] !== null && obj2[key]) {
-      result = result.concat(diff(obj1[key], obj2[key], `${key}.`));
+    if (isObject(obj1[key]) && isObject(obj2[key])) {
+      result = [...result, ...diff(obj1[key], obj2[key], `${prefix}${key}.`)];
     } else if (obj1[key] !== obj2[key]) {
       result.push(`${prefix}${key}`);
     }
@@ -67,13 +68,6 @@ export const diff = (obj1: any, obj2: any, prefix: string = ''): string[] => {
   return result;
 };
 
-export const unset = (obj: any, key: string) => {
-  const keys = key.split('.');
-  const lastKey = keys.pop();
-  const lastObj = keys.reduce((obj, key) => (obj[key] = obj[key] || {}), obj);
-  if (lastKey) delete lastObj[lastKey];
-};
-
 export const tagBlue = (text: string) => colors.bgBlueBright(colors.black(` ${text} `));
 export const tagYellow = (text: string) => colors.bgYellowBright(colors.black(` ${text} `));
 export const tagGreen = (text: string) => colors.bgGreenBright(colors.black(` ${text} `));

package/src/app/api/auth.ts

@@ -9,12 +9,12 @@ interface AuthConfig {
 export const checkAuth = ({ apiKey, accessCode }: AuthConfig) => {
   const { ACCESS_CODE } = getServerConfig();
 
-  // 如果存在 apiKey
+  // if apiKey exist
   if (apiKey) {
     return { auth: true };
   }
 
-  // 如果不存在，则检查 accessCode
+  // if accessCode doesn't exist
   if (!ACCESS_CODE) return { auth: true };
 
   if (accessCode !== ACCESS_CODE) {

package/src/app/api/openai/chat/route.ts

@@ -2,7 +2,7 @@ import OpenAI from 'openai';
 
 import { getServerConfig } from '@/config/server';
 import { getOpenAIAuthFromRequest } from '@/const/fetch';
-import { ErrorType } from '@/types/fetch';
+import { ChatErrorType, ErrorType } from '@/types/fetch';
 import { OpenAIStreamPayload } from '@/types/openai';
 
 import { checkAuth } from '../../auth';
@@ -29,10 +29,24 @@ export const POST = async (req: Request) => {
   const { USE_AZURE_OPENAI } = getServerConfig();
   const useAzureOpenAI = useAzure || USE_AZURE_OPENAI;
 
-  if (useAzureOpenAI) {
-    openai = createAzureOpenai({ apiVersion, endpoint, model: payload.model, userApiKey: apiKey });
-  } else {
-    openai = createOpenai(apiKey, endpoint);
+  try {
+    if (useAzureOpenAI) {
+      openai = createAzureOpenai({
+        apiVersion,
+        endpoint,
+        model: payload.model,
+        userApiKey: apiKey,
+      });
+    } else {
+      openai = createOpenai(apiKey, endpoint);
+    }
+  } catch (error) {
+    if ((error as Error).cause === ChatErrorType.NoAPIKey) {
+      return createErrorResponse(ChatErrorType.NoAPIKey);
+    }
+
+    console.error(error); // log error to trace it
+    return createErrorResponse(ChatErrorType.InternalServerError);
   }
 
   return createChatCompletion({ openai, payload });

package/src/app/api/openai/createAzureOpenai.ts

@@ -2,6 +2,7 @@ import OpenAI, { ClientOptions } from 'openai';
 import urlJoin from 'url-join';
 
 import { getServerConfig } from '@/config/server';
+import { ChatErrorType } from '@/types/fetch';
 
 // 创建 Azure OpenAI 实例
 export const createAzureOpenai = (params: {
@@ -17,7 +18,9 @@ export const createAzureOpenai = (params: {
 
   const defaultApiVersion = AZURE_API_VERSION || '2023-08-01-preview';
   const apiVersion = !params.apiVersion ? defaultApiVersion : params.apiVersion;
-  const apiKey = !params.userApiKey ? AZURE_API_KEY ?? '' : params.userApiKey;
+  const apiKey = !params.userApiKey ? AZURE_API_KEY : params.userApiKey;
+
+  if (!apiKey) throw new Error('AZURE_API_KEY is empty', { cause: ChatErrorType.NoAPIKey });
 
   const config: ClientOptions = {
     apiKey,

package/src/app/api/openai/createOpenai.ts

@@ -1,6 +1,7 @@
-import OpenAI, { ClientOptions } from 'openai';
+import OpenAI from 'openai';
 
 import { getServerConfig } from '@/config/server';
+import { ChatErrorType } from '@/types/fetch';
 
 // 创建 OpenAI 实例
 export const createOpenai = (userApiKey: string | null, endpoint?: string | null) => {
@@ -8,10 +9,9 @@ export const createOpenai = (userApiKey: string | null, endpoint?: string | null
 
   const baseURL = endpoint ? endpoint : OPENAI_PROXY_URL ? OPENAI_PROXY_URL : undefined;
 
-  const config: ClientOptions = {
-    apiKey: !userApiKey ? OPENAI_API_KEY : userApiKey,
-    baseURL,
-  };
+  const apiKey = !userApiKey ? OPENAI_API_KEY : userApiKey;
 
-  return new OpenAI(config);
+  if (!apiKey) throw new Error('OPENAI_API_KEY is empty', { cause: ChatErrorType.NoAPIKey });
+
+  return new OpenAI({ apiKey, baseURL });
 };

package/src/app/api/openai/errorResponse.ts

@@ -2,6 +2,7 @@ import { ChatErrorType, ErrorResponse, ErrorType } from '@/types/fetch';
 
 const getStatus = (errorType: ErrorType) => {
   switch (errorType) {
+    case ChatErrorType.NoAPIKey:
     case ChatErrorType.InvalidAccessCode: {
       return 401;
     }

package/src/app/chat/(desktop)/index.tsx

@@ -18,7 +18,7 @@ const DesktopPage = memo(() => (
     <Layout>
       <PageTitle />
       <ChatHeader />
-      <Flexbox flex={1} height={'calc(100vh - 64px)'} horizontal>
+      <Flexbox flex={1} height={'calc(100% - 64px)'} horizontal>
         <Conversation chatInput={<ChatInput />} />
         <SideBar />
       </Flexbox>

package/src/app/chat/(desktop)/layout.desktop.tsx

@@ -16,7 +16,7 @@ export default memo(({ children }: PropsWithChildren) => {
       <ResponsiveSessionList />
       <Flexbox
         flex={1}
-        height={'100vh'}
+        height={'100%'}
         id={'lobe-conversion-container'}
         style={{ position: 'relative' }}
       >

package/src/app/chat/(mobile)/mobile/index.tsx

@@ -10,7 +10,7 @@ import Layout from './layout.mobile';
 
 const Chat = memo(() => (
   <Layout>
-    <Flexbox height={'calc(100vh - 44px)'} horizontal>
+    <Flexbox height={'calc(100% - 44px)'} horizontal>
       <Conversation chatInput={<ChatInput />} mobile />
       <TopicList />
     </Flexbox>

package/src/app/chat/features/Conversation/ChatList/Error/OpenAPIKey.tsx

@@ -0,0 +1,12 @@
+import { memo } from 'react';
+
+import APIKeyForm from './ApiKeyForm';
+import { ErrorActionContainer } from './style';
+
+const OpenAPIKey = memo<{ id: string }>(({ id }) => (
+  <ErrorActionContainer>
+    <APIKeyForm id={id} />
+  </ErrorActionContainer>
+));
+
+export default OpenAPIKey;

package/src/app/chat/features/Conversation/ChatList/Error/OpenAiBizError.tsx

@@ -2,8 +2,8 @@ import { Highlighter } from '@lobehub/ui';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
-import APIKeyForm from './ApiKeyForm';
-import { ErrorActionContainer, useStyles } from './style';
+import OpenAPIKey from './OpenAPIKey';
+import { useStyles } from './style';
 
 interface OpenAIError {
   code: 'invalid_api_key' | string;
@@ -21,13 +21,8 @@ const OpenAiBizError = memo<{ content: OpenAIErrorResponse; id: string }>(({ con
 
   const errorCode = content.error?.code;
 
-  if (errorCode === 'invalid_api_key') {
-    return (
-      <ErrorActionContainer>
-        <APIKeyForm id={id} />
-      </ErrorActionContainer>
-    );
-  }
+  if (errorCode === 'invalid_api_key') return <OpenAPIKey id={id} />;
+
   return (
     <Flexbox className={styles.container} style={{ maxWidth: 600 }}>
       <Highlighter language={'json'}>{JSON.stringify(content, null, 2)}</Highlighter>

package/src/app/chat/features/Conversation/ChatList/Error/index.tsx

@@ -5,6 +5,7 @@ import { ChatMessage } from '@/types/chatMessage';
 import { ChatErrorType, ErrorType } from '@/types/fetch';
 
 import InvalidAccess from './InvalidAccess';
+import OpenAPIKey from './OpenAPIKey';
 import OpenAiBizError from './OpenAiBizError';
 import PluginError from './Plugin/PluginError';
 import PluginSettings from './Plugin/PluginSettings';
@@ -36,6 +37,10 @@ export const renderErrorMessage: RenderErrorMessage = (error, message: ChatMessa
       return <InvalidAccess id={message.id} />;
     }
 
+    case ChatErrorType.NoAPIKey: {
+      return <OpenAPIKey id={message.id} />;
+    }
+
     case ChatErrorType.OpenAIBizError: {
       return <OpenAiBizError content={(error as any).body} id={message.id} />;
     }

package/src/app/chat/features/SessionListContent/Inbox/index.tsx

@@ -37,6 +37,7 @@ const Inbox = memo(() => {
 
   return (
     <Link
+      aria-label={INBOX_SESSION_ID}
       href={SESSION_CHAT_URL(INBOX_SESSION_ID, mobile)}
       onClick={(e) => {
         e.preventDefault();

package/src/app/chat/features/SessionListContent/List/index.tsx

@@ -24,6 +24,7 @@ const SessionList = memo(() => {
   ) : list.length > 0 ? (
     list.map(({ id }) => (
       <Link
+        aria-label={id}
         href={SESSION_CHAT_URL(id, mobile)}
         key={id}
         onClick={(e) => {

package/src/app/home/index.tsx

@@ -9,7 +9,7 @@ const Loading = () => {
   const { t } = useTranslation();
 
   return (
-    <Flexbox height={'100vh'} width={'100%'}>
+    <Flexbox height={'100%'} width={'100%'}>
       <Center flex={1} gap={12} width={'100%'}>
         <Logo extra={'Chat'} size={48} type={'combine'} />
         <Center gap={16} horizontal>

package/src/app/market/(desktop)/features/AgentDetail.tsx

@@ -53,7 +53,7 @@ const SideBar = memo(() => {
       <DraggablePanelContainer
         style={{
           flex: 'none',
-          height: '100vh',
+          height: '100%',
           minWidth: MARKET_SIDEBAR_WIDTH,
         }}
       >

package/src/app/market/(desktop)/features/Header.tsx

@@ -22,7 +22,7 @@ const Header = memo(() => {
   return (
     <ChatHeader
       left={
-        <Link href={'/'}>
+        <Link aria-label={'home'} href={'/'}>
           <Logo className={styles.logo} extra={'Discover'} size={36} type={'text'} />
         </Link>
       }

package/src/app/market/(desktop)/layout.desktop.tsx

@@ -34,12 +34,12 @@ const MarketLayout = memo<PropsWithChildren>(({ children }) => {
     <AppLayoutDesktop>
       <Flexbox
         flex={1}
-        height={'100vh'}
+        height={'100%'}
         id={'lobe-market-container'}
         style={{ position: 'relative' }}
       >
         <Header />
-        <Flexbox flex={1} height={'calc(100vh - 64px)'} horizontal>
+        <Flexbox flex={1} height={'calc(100% - 64px)'} horizontal>
           <Flexbox align={'center'} flex={1} style={{ overflow: 'auto', padding: 16 }}>
             <SafeSpacing />
 

package/src/app/market/features/AgentCard/AgentCardBanner.tsx

@@ -50,6 +50,7 @@ const AgentCardBanner = memo<AgentCardBannerProps>(
         {...props}
       >
         <Avatar
+          alt={'banner'}
           avatar={meta.avatar}
           background={meta.backgroundColor || theme.colorBgContainer}
           className={styles.bannerImg}

package/src/app/market/features/AgentDetailContent/AgentInfo/Header.tsx

@@ -47,7 +47,7 @@ const Header = memo(() => {
         ))}
       </Center>
       <div className={styles.desc}>{description}</div>
-      <Link className={styles.author} href={homepage} target={'_blank'}>
+      <Link aria-label={author} className={styles.author} href={homepage} target={'_blank'}>
         @{author}
       </Link>
       <Button

package/src/app/settings/(desktop)/layout.desktop.tsx

@@ -14,7 +14,7 @@ export default memo(({ children }: PropsWithChildren) => {
   return (
     <AppLayoutDesktop>
       <SideBar />
-      <Flexbox flex={1} height={'100vh'} style={{ position: 'relative' }}>
+      <Flexbox flex={1} height={'100%'} style={{ position: 'relative' }}>
         <Header />
         <Flexbox align={'center'} flex={1} padding={24} style={{ overflow: 'auto' }}>
           <SafeSpacing />

package/src/app/settings/common/index.tsx

@@ -4,20 +4,24 @@ import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import PageTitle from '@/components/PageTitle';
+import { CURRENT_VERSION } from '@/const/version';
 import { useSwitchSideBarOnInit } from '@/store/global/hooks/useSwitchSettingsOnInit';
 import { SettingsTabs } from '@/store/global/initialState';
 import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
 
+import Footer from '../features/Footer';
 import Common from './Common';
 
 export default memo(() => {
   useSwitchSideBarOnInit(SettingsTabs.Common);
   const { t } = useTranslation('setting');
   const pageTitle = genSiteHeadTitle(t('tab.common'));
+
   return (
     <>
       <PageTitle title={pageTitle} />
       <Common />
+      <Footer>LobeChat v{CURRENT_VERSION}</Footer>
     </>
   );
 });

package/src/app/settings/features/Footer.tsx

@@ -0,0 +1,24 @@
+import { Divider } from 'antd';
+import { createStyles } from 'antd-style';
+import { PropsWithChildren, memo } from 'react';
+import { Center } from 'react-layout-kit';
+
+const useStyles = createStyles(
+  ({ css, token }) => css`
+    font-size: 14px;
+    color: ${token.colorTextDescription};
+  `,
+);
+
+const Footer = memo<PropsWithChildren>(({ children }) => {
+  const { styles } = useStyles();
+  return (
+    <Center style={{ maxWidth: 600, width: '100%' }}>
+      <Divider>
+        <span className={styles}>{children}</span>
+      </Divider>
+    </Center>
+  );
+});
+
+export default Footer;

package/src/app/settings/features/SideBar/List.tsx

@@ -22,6 +22,7 @@ const List = memo(() => {
 
   return items.map(({ value, icon, label }) => (
     <Link
+      aria-label={label}
       href={`/settings/${value}`}
       key={value}
       onClick={() => {

package/src/app/settings/features/SideBar/index.tsx

@@ -27,7 +27,7 @@ const SideBar = memo(() => {
       <DraggablePanelBody className={styles.body} style={{ padding: 0 }}>
         <Flexbox className={styles.top} padding={16}>
           <div>
-            <Logo className={styles.logo} size={36} type={'text'} />
+            <Logo className={styles.logo} extra={'Settings'} size={36} type={'text'} />
           </div>
         </Flexbox>
         <UpgradeAlert />

package/src/app/settings/features/UpgradeAlert.tsx

@@ -14,7 +14,7 @@ const UpgradeAlert = memo(() => {
     hasNewVersion && (
       <Alert
         action={
-          <Link href={MANUAL_UPGRADE_URL} target={'_blank'}>
+          <Link aria-label={t('upgradeVersion.action')} href={MANUAL_UPGRADE_URL} target={'_blank'}>
             <Button size={'small'} type={'primary'}>
               {t('upgradeVersion.action')}
             </Button>

package/src/app/settings/llm/LLM/index.tsx

@@ -3,10 +3,8 @@ import { Form as AntForm, AutoComplete, Input, Switch } from 'antd';
 import { createStyles } from 'antd-style';
 import { debounce } from 'lodash-es';
 import { Webhook } from 'lucide-react';
-import Link from 'next/link';
 import { memo } from 'react';
-import { Trans, useTranslation } from 'react-i18next';
-import { Flexbox } from 'react-layout-kit';
+import { useTranslation } from 'react-i18next';
 
 import { FORM_STYLE } from '@/const/layoutTokens';
 import { settingsSelectors, useEffectAfterGlobalHydrated, useGlobalStore } from '@/store/global';
@@ -24,9 +22,6 @@ const useStyles = createStyles(({ css, token }) => ({
       color: ${token.colorTextDescription} !important;
     }
   `,
-  plan: css`
-    color: ${token.colorTextDescription};
-  `,
   tip: css`
     font-size: 12px;
     color: ${token.colorTextDescription};
@@ -139,25 +134,12 @@ const LLM = memo(() => {
   };
 
   return (
-    <Flexbox align={'center'} gap={24} width={'100%'}>
-      <Form
-        form={form}
-        items={[openAI]}
-        onValuesChange={debounce(setSettings, 100)}
-        {...FORM_STYLE}
-      />
-      <Flexbox align={'center'} className={styles.plan}>
-        <div>
-          <Trans i18nKey="llm.waitingForMore" ns={'setting'}>
-            更多模型正在
-            <Link href="https://github.com/lobehub/lobe-chat/issues/151" target="_blank">
-              计划接入
-            </Link>
-            中 ，敬请期待 ✨
-          </Trans>
-        </div>
-      </Flexbox>
-    </Flexbox>
+    <Form
+      form={form}
+      items={[openAI]}
+      onValuesChange={debounce(setSettings, 100)}
+      {...FORM_STYLE}
+    />
   );
 });
 

package/src/app/settings/llm/index.tsx

@@ -1,8 +1,10 @@
 'use client';
 
+import Link from 'next/link';
 import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
+import { Trans, useTranslation } from 'react-i18next';
 
+import Footer from '@/app/settings/features/Footer';
 import PageTitle from '@/components/PageTitle';
 import { useSwitchSideBarOnInit } from '@/store/global/hooks/useSwitchSettingsOnInit';
 import { SettingsTabs } from '@/store/global/initialState';
@@ -18,6 +20,19 @@ export default memo(() => {
     <>
       <PageTitle title={pageTitle} />
       <LLM />
+      <Footer>
+        <Trans i18nKey="llm.waitingForMore" ns={'setting'}>
+          更多模型正在
+          <Link
+            aria-label={'todo'}
+            href="https://github.com/lobehub/lobe-chat/issues/151"
+            target="_blank"
+          >
+            计划接入
+          </Link>
+          中 ，敬请期待 ✨
+        </Trans>
+      </Footer>
     </>
   );
 });

package/src/app/welcome/(desktop)/features/Showcase.tsx

@@ -10,7 +10,7 @@ const Showcase = memo(() => (
   <Flexbox
     flex={1}
     justify={'center'}
-    style={{ height: '100vh', position: 'relative', width: '100%' }}
+    style={{ height: '100%', position: 'relative', width: '100%' }}
   >
     <GridShowcase>
       <Banner />

package/src/app/welcome/(desktop)/layout.desktop.tsx

@@ -13,7 +13,7 @@ const Desktop = memo<PropsWithChildren>(({ children }) => {
       <Center
         className={styles.layout}
         flex={1}
-        height={'100vh'}
+        height={'100%'}
         horizontal
         style={{ position: 'relative' }}
       >

package/src/app/welcome/(mobile)/features/Showcase.tsx

@@ -4,7 +4,7 @@ import { Center, Flexbox } from 'react-layout-kit';
 import Banner from '@/app/welcome/features/Banner';
 
 const Showcase = memo(() => (
-  <Flexbox align={'center'} justify={'center'} style={{ height: 'calc(100vh - 44px)' }}>
+  <Flexbox align={'center'} justify={'center'} style={{ height: 'calc(100% - 44px)' }}>
     <Center gap={16}>
       <Banner mobile />
     </Center>

package/src/app/welcome/(mobile)/layout.mobile.tsx

@@ -12,7 +12,7 @@ const MobileLayout = memo<PropsWithChildren>(({ children }) => {
 
   return (
     <AppLayoutMobile navBar={<Header />} showTabBar style={{ background: theme.colorBgLayout }}>
-      <div style={{ paddingInline: 16 }}>{children}</div>
+      <div style={{ height: '100%', paddingInline: 16 }}>{children}</div>
     </AppLayoutMobile>
   );
 });

package/src/app/welcome/features/Banner/style.ts

@@ -60,7 +60,7 @@ export const useStyles = createStyles(({ css, token, stylish, cx, prefixCls }) =
         overflow-y: auto;
 
         max-width: 1024px;
-        height: 100vh;
+        height: 100%;
         padding: 32px 16px;
       `,
     ),

package/src/features/FolderPanel/index.tsx

@@ -8,7 +8,7 @@ import { useGlobalStore } from '@/store/global';
 
 export const useStyles = createStyles(({ css, token }) => ({
   panel: css`
-    height: 100vh;
+    height: 100%;
     color: ${token.colorTextSecondary};
     background: ${token.colorBgContainer};
   `,
@@ -48,7 +48,7 @@ const FolderPanel = memo<PropsWithChildren>(({ children }) => {
         updatePreference({ sessionsWidth: nextWidth });
       }}
       placement="left"
-      size={{ height: '100vh', width: sessionsWidth }}
+      size={{ height: '100%', width: sessionsWidth }}
     >
       <DraggablePanelContainer style={{ flex: 'none', height: '100%', minWidth: FOLDER_WIDTH }}>
         {children}

package/src/features/SideBar/index.tsx

@@ -14,7 +14,7 @@ export default memo(() => {
     <SideNav
       avatar={<AvatarWithUpload id={'avatar'} />}
       bottomActions={<BottomActions setTab={setTab} tab={tab} />}
-      style={{ height: '100vh' }}
+      style={{ height: '100%' }}
       topActions={<TopActions setTab={setTab} tab={tab} />}
     />
   );

package/src/layout/AppLayout.desktop.tsx

@@ -10,6 +10,7 @@ const AppLayoutDesktop = memo<PropsWithChildren>(({ children }) => {
   const theme = useTheme();
   return (
     <Flexbox
+      height={'100%'}
       horizontal
       style={isPWA ? { borderTop: `1px solid ${theme.colorBorder}` } : {}}
       width={'100%'}

package/src/layout/AppLayout.mobile.tsx

@@ -16,7 +16,7 @@ const useStyles = createStyles(({ css, cx, stylish }) => ({
       overflow-y: auto;
 
       width: 100vw;
-      height: 100vh;
+      height: 100%;
     `,
   ),
   mobileNavBar: css`
@@ -62,7 +62,6 @@ const AppLayoutMobile = memo<AppMobileLayoutProps>(
             <MobileTabBar className={styles.mobileTabBar} />
           </>
         )}
-        <SafeSpacing mobile position={'bottom'} />
       </Flexbox>
     );
   },

package/src/layout/GlobalLayout/LocaleLoading.tsx

@@ -7,7 +7,7 @@ const Loading = memo(() => (
   <div
     style={{
       backdropFilter: 'blur(3px)',
-      height: '100vh',
+      height: '100%',
       width: '100vw',
       zIndex: 100,
     }}

package/src/locales/default/error.ts

@@ -32,11 +32,12 @@ export default {
 
     InvalidAccessCode: '密码不正确或为空，请输入正确的访问密码，或者添加自定义 OpenAI API Key',
     OpenAIBizError: '请求 OpenAI 服务出错，请根据以下信息排查或重试',
+    NoAPIKey: 'OpenAI API Key 为空，请添加自定义 OpenAI API Key',
     /* eslint-enable */
   },
   unlock: {
     apikey: {
-      description: '输入你的 OpenAI API Key 即可绕过密码验证。应用不会记录你的 API Key',
+      description: '输入你的 OpenAI API Key 即可开始会话。应用不会记录你的 API Key',
       title: '使用自定义 API Key',
     },
     closeMessage: '关闭提示',

package/src/styles/global.ts

@@ -3,20 +3,20 @@ import { css } from 'antd-style';
 export default ({ prefixCls }: { prefixCls: string }) => css`
   html,
   body,
+  #__next,
   .${prefixCls}-app {
-    overflow: hidden;
+    position: relative;
     overscroll-behavior: none;
+    height: 100% !important;
+    min-height: 100% !important;
 
     ::-webkit-scrollbar {
+      display: none;
       width: 0;
       height: 0;
     }
   }
 
-  #__next {
-    height: 100%;
-  }
-
   p {
     margin-bottom: 0;
   }
@@ -24,6 +24,7 @@ export default ({ prefixCls }: { prefixCls: string }) => css`
   @media (max-width: 575px) {
     * {
       ::-webkit-scrollbar {
+        display: none;
         width: 0;
         height: 0;
       }

package/src/types/fetch.ts

@@ -2,10 +2,9 @@
 export const ChatErrorType = {
   // ******* 业务错误语义 ******* //
 
-  // 密码无效
-  InvalidAccessCode: 'InvalidAccessCode',
-  // OpenAI 返回的业务错误
-  OpenAIBizError: 'OpenAIBizError',
+  InvalidAccessCode: 'InvalidAccessCode', // 密码无效
+  OpenAIBizError: 'OpenAIBizError', // OpenAI 返回的业务错误
+  NoAPIKey: 'NoAPIKey',
 
   // ******* 客户端错误 ******* //
   BadRequest: 400,