🐛 fix: fix connection checker (lobehub#2672)

* 🐛 fix: fix check error * 💄 style: improve bubble loading * ♻️ refactor: add store devtools url control * 🚚 refactor: move settings type folder * ♻️ refactor: rename type * 🐛 fix: fix check error
whyliam · May 26, 2024 · bef8926 · bef8926
1 parent d1cdaa0
commit bef8926
Show file tree

Hide file tree

Showing 58 changed files with 331 additions and 289 deletions.
diff --git a/src/app/(main)/settings/llm/Bedrock/index.tsx b/src/app/(main)/settings/llm/Bedrock/index.tsx
@@ -7,7 +7,7 @@ import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
 import { ModelProvider } from '@/libs/agent-runtime';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import ProviderConfig from '../components/ProviderConfig';
 import { LLMProviderConfigKey } from '../const';

diff --git a/src/app/(main)/settings/llm/components/Checker.tsx b/src/app/(main)/settings/llm/components/Checker.tsx
@@ -50,10 +50,19 @@ const Checker = memo<ConnectionCheckerProps>(({ model, provider }) => {
   const [error, setError] = useState<ChatMessageError | undefined>();
 
   const checkConnection = async () => {
-    const data = await chatService.fetchPresetTaskResult({
+    let isError = false;
+
+    await chatService.fetchPresetTaskResult({
       onError: (_, rawError) => {
         setError(rawError);
         setPass(false);
+        isError = true;
+      },
+      onFinish: async () => {
+        if (!isError) {
+          setError(undefined);
+          setPass(true);
+        }
       },
       onLoadingChange: (loading) => {
         setLoading(loading);
@@ -74,11 +83,6 @@ const Checker = memo<ConnectionCheckerProps>(({ model, provider }) => {
         traceName: TraceNameMap.ConnectivityChecker,
       },
     });
-
-    if (data) {
-      setError(undefined);
-      setPass(true);
-    }
   };
   const isMobile = useIsMobile();
 

diff --git a/src/app/(main)/settings/llm/components/ProviderConfig/index.tsx b/src/app/(main)/settings/llm/components/ProviderConfig/index.tsx
@@ -18,7 +18,7 @@ import {
 import { FORM_STYLE } from '@/const/layoutTokens';
 import { useUserStore } from '@/store/user';
 import { modelConfigSelectors } from '@/store/user/selectors';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import Checker from '../Checker';
 import ProviderModelListSelect from '../ProviderModelList';

diff --git a/src/app/(main)/settings/llm/components/ProviderModelList/CustomModelOption.tsx b/src/app/(main)/settings/llm/components/ProviderModelList/CustomModelOption.tsx
@@ -10,7 +10,7 @@ import ModelIcon from '@/components/ModelIcon';
 import { ModelInfoTags } from '@/components/ModelSelect';
 import { useUserStore } from '@/store/user';
 import { modelConfigSelectors } from '@/store/user/selectors';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 interface CustomModelOptionProps {
   id: string;

diff --git a/src/app/(main)/settings/llm/components/ProviderModelList/ModelFetcher.tsx b/src/app/(main)/settings/llm/components/ProviderModelList/ModelFetcher.tsx
@@ -13,7 +13,7 @@ import {
   modelProviderSelectors,
   settingsSelectors,
 } from '@/store/user/selectors';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 const useStyles = createStyles(({ css, token }) => ({
   hover: css`

diff --git a/src/app/(main)/settings/llm/components/ProviderModelList/Option.tsx b/src/app/(main)/settings/llm/components/ProviderModelList/Option.tsx
@@ -11,7 +11,7 @@ import ModelIcon from '@/components/ModelIcon';
 import { ModelInfoTags } from '@/components/ModelSelect';
 import { useUserStore } from '@/store/user';
 import { modelProviderSelectors } from '@/store/user/selectors';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import CustomModelOption from './CustomModelOption';
 

diff --git a/src/app/(main)/settings/llm/components/ProviderModelList/index.tsx b/src/app/(main)/settings/llm/components/ProviderModelList/index.tsx
@@ -9,7 +9,7 @@ import { Flexbox } from 'react-layout-kit';
 
 import { useUserStore } from '@/store/user';
 import { modelProviderSelectors } from '@/store/user/selectors';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import ModelConfigModal from './ModelConfigModal';
 import ModelFetcher from './ModelFetcher';

diff --git a/src/const/settings/agent.ts b/src/const/settings/agent.ts
@@ -1,7 +1,7 @@
 import { DEFAULT_AGENT_META } from '@/const/meta';
 import { ModelProvider } from '@/libs/agent-runtime';
 import { LobeAgentChatConfig, LobeAgentConfig, LobeAgentTTSConfig } from '@/types/agent';
-import { GlobalDefaultAgent } from '@/types/settings';
+import { UserDefaultAgent } from '@/types/user/settings';
 
 export const DEFAUTT_AGENT_TTS_CONFIG: LobeAgentTTSConfig = {
   showAllLocaleVoice: false,
@@ -34,7 +34,7 @@ export const DEFAULT_AGENT_CONFIG: LobeAgentConfig = {
   tts: DEFAUTT_AGENT_TTS_CONFIG,
 };
 
-export const DEFAULT_AGENT: GlobalDefaultAgent = {
+export const DEFAULT_AGENT: UserDefaultAgent = {
   config: DEFAULT_AGENT_CONFIG,
   meta: DEFAULT_AGENT_META,
 };
diff --git a/src/const/settings/common.ts b/src/const/settings/common.ts
@@ -1,6 +1,6 @@
-import { GlobalBaseSettings } from '@/types/settings';
+import { UserGeneralSettings } from '@/types/user/settings';
 
-export const DEFAULT_COMMON_SETTINGS: GlobalBaseSettings = {
+export const DEFAULT_COMMON_SETTINGS: UserGeneralSettings = {
   fontSize: 14,
   language: 'auto',
   password: '',

diff --git a/src/const/settings/index.ts b/src/const/settings/index.ts
@@ -1,4 +1,4 @@
-import { GlobalSettings } from '@/types/settings';
+import { UserSettings } from '@/types/user/settings';
 
 import { DEFAULT_AGENT } from './agent';
 import { DEFAULT_COMMON_SETTINGS } from './common';
@@ -16,7 +16,7 @@ export * from './systemAgent';
 export * from './tool';
 export * from './tts';
 
-export const DEFAULT_SETTINGS: GlobalSettings = {
+export const DEFAULT_SETTINGS: UserSettings = {
   defaultAgent: DEFAULT_AGENT,
   languageModel: DEFAULT_LLM_CONFIG,
   sync: DEFAULT_SYNC_CONFIG,

diff --git a/src/const/settings/llm.ts b/src/const/settings/llm.ts
@@ -17,9 +17,9 @@ import {
   filterEnabledModels,
 } from '@/config/modelProviders';
 import { ModelProvider } from '@/libs/agent-runtime';
-import { GlobalLLMConfig } from '@/types/settings';
+import { UserModelProviderConfig } from '@/types/user/settings';
 
-export const DEFAULT_LLM_CONFIG: GlobalLLMConfig = {
+export const DEFAULT_LLM_CONFIG: UserModelProviderConfig = {
   anthropic: {
     apiKey: '',
     enabled: false,

diff --git a/src/const/settings/sync.ts b/src/const/settings/sync.ts
@@ -1,5 +1,5 @@
-import { GlobalSyncSettings } from '@/types/settings';
+import { UserSyncSettings } from '@/types/user/settings';
 
-export const DEFAULT_SYNC_CONFIG: GlobalSyncSettings = {
+export const DEFAULT_SYNC_CONFIG: UserSyncSettings = {
   webrtc: { enabled: false },
 };
diff --git a/src/const/settings/systemAgent.ts b/src/const/settings/systemAgent.ts
@@ -1,4 +1,4 @@
-import { GlobalSystemAgentConfig, GlobalTranslationConfig } from '@/types/settings';
+import { UserSystemAgentConfig, GlobalTranslationConfig } from '@/types/user/settings';
 
 import { DEFAULT_MODEL, DEFAULT_PROVIDER } from './llm';
 
@@ -7,6 +7,6 @@ export const DEFAULT_TRANSLATION_CONFIG: GlobalTranslationConfig = {
   provider: DEFAULT_PROVIDER,
 };
 
-export const DEFAULT_SYSTEM_AGENT_CONFIG: GlobalSystemAgentConfig = {
+export const DEFAULT_SYSTEM_AGENT_CONFIG: UserSystemAgentConfig = {
   translation: DEFAULT_TRANSLATION_CONFIG,
 };
diff --git a/src/const/settings/tts.ts b/src/const/settings/tts.ts
@@ -1,6 +1,6 @@
-import { GlobalTTSConfig } from '@/types/settings';
+import { UserTTSConfig } from '@/types/user/settings';
 
-export const DEFAULT_TTS_CONFIG: GlobalTTSConfig = {
+export const DEFAULT_TTS_CONFIG: UserTTSConfig = {
   openAI: {
     sttModel: 'whisper-1',
     ttsModel: 'tts-1',

diff --git a/src/database/client/core/migrations/migrateSettingsToUser/type.ts b/src/database/client/core/migrations/migrateSettingsToUser/type.ts
@@ -3,7 +3,7 @@ import type { ThemeMode } from 'antd-style';
 import { LobeAgentTTSConfig } from '@/types/agent';
 import { FewShots, LLMParams } from '@/types/llm';
 import { MetaData } from '@/types/meta';
-import { STTServer } from '@/types/settings';
+import { STTServer } from '@/types/user/settings';
 
 interface V4LobeAgentConfig {
   autoCreateTopicThreshold: number;

diff --git a/src/database/client/models/__tests__/user.test.ts b/src/database/client/models/__tests__/user.test.ts
@@ -1,6 +1,6 @@
 import { afterEach, beforeEach, describe, expect, it } from 'vitest';
 
-import { GlobalSettings } from '@/types/settings';
+import { UserSettings } from '@/types/user/settings';
 
 import { UserModel } from '../user';
 

diff --git a/src/database/client/models/user.ts b/src/database/client/models/user.ts
@@ -2,7 +2,7 @@ import { DeepPartial } from 'utility-types';
 
 import { BaseModel } from '@/database/client/core';
 import { LobeAgentConfig } from '@/types/agent';
-import { GlobalSettings } from '@/types/settings';
+import { UserSettings } from '@/types/user/settings';
 import { uuid } from '@/utils/uuid';
 
 import { DB_User, DB_UserSchema } from '../schemas/user';
@@ -42,7 +42,7 @@ class _UserModel extends BaseModel {
 
   // **************** Update *************** //
 
-  async updateSettings(settings: DeepPartial<GlobalSettings>) {
+  async updateSettings(settings: DeepPartial<UserSettings>) {
     const user = await this.getUser();
 
     return this.update(user.id, { settings: settings as any });

diff --git a/src/features/Conversation/Error/APIKeyForm/ProviderApiKeyForm.tsx b/src/features/Conversation/Error/APIKeyForm/ProviderApiKeyForm.tsx
@@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next';
 
 import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import { FormAction } from '../style';
 

diff --git a/src/features/Conversation/Error/APIKeyForm/index.tsx b/src/features/Conversation/Error/APIKeyForm/index.tsx
@@ -5,7 +5,7 @@ import { Center, Flexbox } from 'react-layout-kit';
 
 import { ModelProvider } from '@/libs/agent-runtime';
 import { useChatStore } from '@/store/chat';
-import { GlobalLLMProviderKey } from '@/types/settings';
+import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import BedrockForm from './Bedrock';
 import ProviderApiKeyForm from './ProviderApiKeyForm';

diff --git a/src/features/Conversation/components/BubblesLoading.tsx b/src/features/Conversation/components/BubblesLoading.tsx
@@ -1,52 +1,60 @@
-import { useTheme } from 'antd-style';
+import { css, cx, useTheme } from 'antd-style';
+import { Center } from 'react-layout-kit';
+
+const container = css`
+  circle {
+    animation: bubble 1.5s cubic-bezier(0.05, 0.2, 0.35, 1) infinite;
+  }
+
+  circle:nth-child(2) {
+    animation-delay: 0.3s;
+  }
+
+  circle:nth-child(3) {
+    animation-delay: 0.6s;
+  }
+
+  @keyframes bubble {
+    0% {
+      opacity: 1;
+
+      /* transform: translateY(0); */
+    }
+
+    25% {
+      opacity: 0.5;
+
+      /* transform: translateY(-4px); */
+    }
+
+    75% {
+      opacity: 0.25;
+
+      /* transform: translateY(4px); */
+    }
+
+    to {
+      opacity: 1;
+
+      /* transform: translateY(0); */
+    }
+  }
+`;
 
 const Svg = () => (
-  <svg viewBox="0 0 32 24" xmlns="http://www.w3.org/2000/svg">
-    <circle cx="0" cy="12" r="0" transform="translate(8 0)">
-      <animate
-        attributeName="r"
-        begin="0"
-        calcMode="spline"
-        dur="1.2s"
-        keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.6 0.4 0.8"
-        keyTimes="0;0.2;0.7;1"
-        repeatCount="indefinite"
-        values="0; 4; 0; 0"
-      />
-    </circle>
-    <circle cx="0" cy="12" r="0" transform="translate(16 0)">
-      <animate
-        attributeName="r"
-        begin="0.3"
-        calcMode="spline"
-        dur="1.2s"
-        keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.6 0.4 0.8"
-        keyTimes="0;0.2;0.7;1"
-        repeatCount="indefinite"
-        values="0; 4; 0; 0"
-      />
-    </circle>
-    <circle cx="0" cy="12" r="0" transform="translate(24 0)">
-      <animate
-        attributeName="r"
-        begin="0.6"
-        calcMode="spline"
-        dur="1.2s"
-        keySplines="0.2 0.2 0.4 0.8;0.2 0.6 0.4 0.8;0.2 0.6 0.4 0.8"
-        keyTimes="0;0.2;0.7;1"
-        repeatCount="indefinite"
-        values="0; 4; 0; 0"
-      />
-    </circle>
+  <svg className={cx(container)} viewBox="0 0 60 32" xmlns="http://www.w3.org/2000/svg">
+    <circle cx="7" cy="16" r="6"></circle>
+    <circle cx="30" cy="16" r="6"></circle>
+    <circle cx="53" cy="16" r="6"></circle>
   </svg>
 );
 
 const BubblesLoading = () => {
-  const { colorTextTertiary } = useTheme();
+  const theme = useTheme();
   return (
-    <div style={{ fill: colorTextTertiary, height: 24, width: 32 }}>
+    <Center style={{ fill: theme.colorTextSecondary, height: 24, width: 32 }}>
       <Svg />
-    </div>
+    </Center>
   );
 };
 

diff --git a/src/services/__tests__/share.test.ts b/src/services/__tests__/share.test.ts
@@ -2,8 +2,8 @@ import { DeepPartial } from 'utility-types';
 import { Mock, afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { LOBE_URL_IMPORT_NAME } from '@/const/url';
-import { GlobalSettings } from '@/types/settings';
 import { ShareGPTConversation } from '@/types/share';
+import { UserSettings } from '@/types/user/settings';
 import { parseMarkdown } from '@/utils/parseMarkdown';
 
 import { SHARE_GPT_URL, shareService } from '../share';
@@ -91,7 +91,7 @@ describe('ShareGPTService', () => {
 describe('ShareViaUrl', () => {
   describe('createShareSettingsUrl', () => {
     it('should create a share settings URL with the provided settings', () => {
-      const settings: DeepPartial<GlobalSettings> = {
+      const settings: DeepPartial<UserSettings> = {
         languageModel: {
           openai: {
             apiKey: 'user-key',

diff --git a/src/services/_auth.test.ts b/src/services/_auth.test.ts
@@ -3,7 +3,7 @@ import { describe, expect, it, vi } from 'vitest';
 
 import { ModelProvider } from '@/libs/agent-runtime';
 import { useUserStore } from '@/store/user';
-import { GlobalLLMConfig, GlobalLLMProviderKey } from '@/types/settings';
+import { UserModelProviderConfig, GlobalLLMProviderKey } from '@/types/user/settings';
 
 import { getProviderAuthPayload } from './_auth';
 
@@ -21,7 +21,7 @@ vi.mock('zustand/traditional');
 
 const setModelProviderConfig = <T extends GlobalLLMProviderKey>(
   provider: T,
-  config: Partial<GlobalLLMConfig[T]>,
+  config: Partial<UserModelProviderConfig[T]>,
 ) => {
   useUserStore.setState({
     settings: { languageModel: { [provider]: config } },

diff --git a/src/services/config.ts b/src/services/config.ts
@@ -8,8 +8,8 @@ import { settingsSelectors } from '@/store/user/selectors';
 import { ConfigFile } from '@/types/exportConfig';
 import { ChatMessage } from '@/types/message';
 import { LobeSessions, SessionGroupItem } from '@/types/session';
-import { GlobalSettings } from '@/types/settings';
 import { ChatTopic } from '@/types/topic';
+import { UserSettings } from '@/types/user/settings';
 import { createConfigFile, exportConfigFile } from '@/utils/config';
 
 export interface ImportResult {
@@ -35,7 +35,7 @@ class ConfigService {
   importMessages = async (messages: ChatMessage[]) => {
     return messageService.batchCreateMessages(messages);
   };
-  importSettings = async (settings: GlobalSettings) => {
+  importSettings = async (settings: UserSettings) => {
     useUserStore.getState().importAppSettings(settings);
   };
   importTopics = async (topics: ChatTopic[]) => {