@lobehub/lobehub 2.0.0-next.236 → 2.0.0-next.238

package/src/app/[variants]/onboarding/features/ResponseLanguageStep.tsx

@@ -4,7 +4,7 @@ import { SendButton } from '@lobehub/editor/react';
 import { Button, Flexbox, Select, Text } from '@lobehub/ui';
 import { cssVar } from 'antd-style';
 import { Undo2Icon } from 'lucide-react';
-import { memo, useCallback, useState } from 'react';
+import { memo, useCallback, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { type Locales, localeOptions, normalizeLocale } from '@/locales/resources';
@@ -24,11 +24,23 @@ const ResponseLanguageStep = memo<ResponseLanguageStepProps>(({ onBack, onNext }
   const setSettings = useUserStore((s) => s.setSettings);
 
   const [value, setValue] = useState<Locales | ''>(normalizeLocale(navigator.language));
+  const [isNavigating, setIsNavigating] = useState(false);
+  const isNavigatingRef = useRef(false);
 
-  const handleNext = () => {
+  const handleNext = useCallback(() => {
+    if (isNavigatingRef.current) return;
+    isNavigatingRef.current = true;
+    setIsNavigating(true);
     setSettings({ general: { responseLanguage: value || '' } });
     onNext();
-  };
+  }, [value, setSettings, onNext]);
+
+  const handleBack = useCallback(() => {
+    if (isNavigatingRef.current) return;
+    isNavigatingRef.current = true;
+    setIsNavigating(true);
+    onBack();
+  }, [onBack]);
 
   const Message = useCallback(
     () => (
@@ -73,6 +85,7 @@ const ResponseLanguageStep = memo<ResponseLanguageStepProps>(({ onBack, onNext }
           value={value}
         />
         <SendButton
+          disabled={isNavigating}
           onClick={handleNext}
           style={{
             zoom: 1.5,
@@ -85,8 +98,9 @@ const ResponseLanguageStep = memo<ResponseLanguageStepProps>(({ onBack, onNext }
       </Text>
       <Flexbox horizontal justify={'flex-start'} style={{ marginTop: 32 }}>
         <Button
+          disabled={isNavigating}
           icon={Undo2Icon}
-          onClick={onBack}
+          onClick={handleBack}
           style={{
             color: cssVar.colorTextDescription,
           }}

package/src/app/[variants]/onboarding/features/TelemetryStep.tsx

@@ -7,7 +7,7 @@ import { LoadingDots } from '@lobehub/ui/chat';
 import { Steps, Switch } from 'antd';
 import { cssVar } from 'antd-style';
 import { BrainIcon, HeartHandshakeIcon, PencilRulerIcon, ShieldCheck } from 'lucide-react';
-import { memo, useCallback, useState } from 'react';
+import { memo, useCallback, useRef, useState } from 'react';
 import { Trans, useTranslation } from 'react-i18next';
 
 import { ProductLogo } from '@/components/Branding';
@@ -21,12 +21,20 @@ interface TelemetryStepProps {
 const TelemetryStep = memo<TelemetryStepProps>(({ onNext }) => {
   const { t } = useTranslation('onboarding');
   const [check, setCheck] = useState(true);
+  const [isNavigating, setIsNavigating] = useState(false);
+  const isNavigatingRef = useRef(false);
   const updateGeneralConfig = useUserStore((s) => s.updateGeneralConfig);
 
-  const handleChoice = (enabled: boolean) => {
-    updateGeneralConfig({ telemetry: enabled });
-    onNext();
-  };
+  const handleChoice = useCallback(
+    (enabled: boolean) => {
+      if (isNavigatingRef.current) return;
+      isNavigatingRef.current = true;
+      setIsNavigating(true);
+      updateGeneralConfig({ telemetry: enabled });
+      onNext();
+    },
+    [updateGeneralConfig, onNext],
+  );
 
   const IconAvatar = useCallback(({ icon }: { icon: IconProps['icon'] }) => {
     return (
@@ -123,6 +131,7 @@ const TelemetryStep = memo<TelemetryStepProps>(({ onNext }) => {
         </Flexbox>
       </Flexbox>
       <Button
+        disabled={isNavigating}
         onClick={() => handleChoice(check)}
         size={'large'}
         style={{

package/src/app/[variants]/onboarding/index.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import { MAX_ONBOARDING_STEPS } from '@lobechat/types';
 import { Flexbox } from '@lobehub/ui';
 import { memo } from 'react';
 
@@ -40,7 +41,7 @@ const OnboardingPage = memo(() => {
       case 4: {
         return <ResponseLanguageStep onBack={goToPreviousStep} onNext={goToNextStep} />;
       }
-      case 5: {
+      case MAX_ONBOARDING_STEPS: {
         return <ProSettingsStep onBack={goToPreviousStep} />;
       }
       default: {

package/src/features/ChatInput/ActionBar/Tools/LobehubSkillServerItem.tsx

@@ -135,13 +135,52 @@ const LobehubSkillServerItem = memo<LobehubSkillServerItemProps>(({ provider, la
     s.togglePlugin,
   ]);
 
+  // Listen for OAuth success message from popup window
+  useEffect(() => {
+    const handleMessage = async (event: MessageEvent) => {
+      // Verify origin for security
+      if (event.origin !== window.location.origin) return;
+
+      if (event.data?.type === 'LOBEHUB_SKILL_AUTH_SUCCESS' && event.data?.provider === provider) {
+        console.log('[LobehubSkill] OAuth success message received for provider:', provider);
+
+        // Cleanup polling/window monitoring
+        cleanup();
+
+        // Refresh status to get the connected state
+        await checkStatus(provider);
+
+        // Auto-enable the plugin after successful OAuth
+        // Need to get the latest server state after checkStatus
+        const latestServer = useToolStore
+          .getState()
+          .lobehubSkillServers?.find((s) => s.identifier === provider);
+        if (latestServer?.status === LobehubSkillStatus.CONNECTED) {
+          const newPluginId = latestServer.identifier;
+          const isAlreadyEnabled = agentSelectors
+            .currentAgentPlugins(useAgentStore.getState())
+            .includes(newPluginId);
+          if (!isAlreadyEnabled) {
+            console.log('[LobehubSkill] Auto-enabling plugin:', newPluginId);
+            togglePlugin(newPluginId);
+          }
+        }
+      }
+    };
+
+    window.addEventListener('message', handleMessage);
+    return () => window.removeEventListener('message', handleMessage);
+  }, [provider, cleanup, checkStatus, togglePlugin]);
+
   const handleConnect = async () => {
     // 只有已连接状态才阻止重新连接
     if (server?.isConnected) return;
 
     setIsConnecting(true);
     try {
-      const { authorizeUrl } = await getAuthorizeUrl(provider);
+      // Use /oauth/callback/success as redirect URI with provider param for auto-enable
+      const redirectUri = `${window.location.origin}/oauth/callback/success?provider=${encodeURIComponent(provider)}`;
+      const { authorizeUrl } = await getAuthorizeUrl(provider, { redirectUri });
       openOAuthWindow(authorizeUrl);
     } catch (error) {
       console.error('[LobehubSkill] Failed to get authorize URL:', error);
@@ -236,7 +275,8 @@ const LobehubSkillServerItem = memo<LobehubSkillServerItemProps>(({ provider, la
             onClick={async (e) => {
               e.stopPropagation();
               try {
-                const { authorizeUrl } = await getAuthorizeUrl(provider);
+                const redirectUri = `${window.location.origin}/oauth/callback/success?provider=${encodeURIComponent(provider)}`;
+                const { authorizeUrl } = await getAuthorizeUrl(provider, { redirectUri });
                 openOAuthWindow(authorizeUrl);
               } catch (error) {
                 console.error('[LobehubSkill] Failed to get authorize URL:', error);

package/src/server/services/search/impls/exa/index.ts

@@ -47,7 +47,7 @@ export class ExaImpl implements SearchServiceImpl {
             };
           })()
         : {}),
-      category: // Exa 只支持 news 类型
+      category: // Exa only supports news type
       params?.searchCategories?.filter((cat) => ['news'].includes(cat))?.[0],
     };
 

package/src/server/services/search/impls/search1api/index.ts

@@ -41,7 +41,7 @@ export class Search1APIImpl implements SearchServiceImpl {
     const { searchEngines } = params;
 
     const defaultQueryParams: Search1APIQueryParams = {
-      crawl_results: 0, // 默认不做抓取
+      crawl_results: 0, // Default is no crawling
       image: false,
       max_results: 15, // Default max results
       query,

package/src/server/services/search/impls/tavily/index.ts

@@ -42,7 +42,7 @@ export class TavilyImpl implements SearchServiceImpl {
         params?.searchTimeRange && params.searchTimeRange !== 'anytime'
           ? params.searchTimeRange
           : undefined,
-      topic: // Tavily 只支持 news 和 general 两种类型
+      topic: // Tavily only supports news and general types
       params?.searchCategories?.filter((cat) => ['news', 'general'].includes(cat))?.[0],
     };
 

package/src/store/tool/slices/klavisStore/action.test.ts

@@ -1,5 +1,5 @@
-import { act, renderHook } from '@testing-library/react';
-import { describe, expect, it, vi } from 'vitest';
+import { act, renderHook, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { lambdaClient, toolsClient } from '@/libs/trpc/client';
 
@@ -8,6 +8,10 @@ import { KlavisServerStatus } from './types';
 
 vi.mock('zustand/traditional');
 
+beforeEach(() => {
+  vi.clearAllMocks();
+});
+
 vi.mock('@/libs/trpc/client', () => ({
   lambdaClient: {
     klavis: {
@@ -509,4 +513,165 @@ describe('klavisStore actions', () => {
       expect(lambdaClient.klavis.getServerInstance.query).toHaveBeenCalled();
     });
   });
+
+  describe('useFetchUserKlavisServers', () => {
+    it('should set isServersInit to true on success with empty data', async () => {
+      act(() => {
+        useToolStore.setState({
+          servers: [],
+          loadingServerIds: new Set(),
+          executingToolIds: new Set(),
+          isServersInit: false,
+        });
+      });
+
+      vi.mocked(lambdaClient.klavis.getKlavisPlugins.query).mockResolvedValue([]);
+
+      renderHook(() => useToolStore.getState().useFetchUserKlavisServers(true));
+
+      await waitFor(() => {
+        expect(useToolStore.getState().isServersInit).toBe(true);
+      });
+    });
+
+    it('should not fetch when disabled', () => {
+      act(() => {
+        useToolStore.setState({
+          servers: [],
+          loadingServerIds: new Set(),
+          executingToolIds: new Set(),
+          isServersInit: false,
+        });
+      });
+
+      vi.mocked(lambdaClient.klavis.getKlavisPlugins.query).mockClear();
+
+      renderHook(() => useToolStore.getState().useFetchUserKlavisServers(false));
+
+      expect(lambdaClient.klavis.getKlavisPlugins.query).not.toHaveBeenCalled();
+      expect(useToolStore.getState().isServersInit).toBe(false);
+    });
+  });
+
+  describe('server deduplication logic', () => {
+    it('should deduplicate servers by identifier when adding new servers', () => {
+      // This tests the deduplication logic used in useFetchUserKlavisServers onSuccess
+      act(() => {
+        useToolStore.setState({
+          servers: [
+            {
+              identifier: 'gmail',
+              serverName: 'Gmail',
+              instanceId: 'existing-inst',
+              serverUrl: 'https://klavis.ai/gmail',
+              status: KlavisServerStatus.CONNECTED,
+              isAuthenticated: true,
+              createdAt: Date.now(),
+            },
+          ],
+          loadingServerIds: new Set(),
+          executingToolIds: new Set(),
+          isServersInit: false,
+        });
+      });
+
+      // Simulate what onSuccess does
+      const incomingServers = [
+        {
+          identifier: 'gmail',
+          serverName: 'Gmail',
+          instanceId: 'new-inst',
+          serverUrl: 'https://klavis.ai/gmail',
+          status: KlavisServerStatus.CONNECTED,
+          isAuthenticated: true,
+          createdAt: Date.now(),
+        },
+        {
+          identifier: 'github',
+          serverName: 'GitHub',
+          instanceId: 'github-inst',
+          serverUrl: 'https://klavis.ai/github',
+          status: KlavisServerStatus.CONNECTED,
+          isAuthenticated: true,
+          createdAt: Date.now(),
+        },
+      ];
+
+      act(() => {
+        const existingServers = useToolStore.getState().servers;
+        const existingIdentifiers = new Set(existingServers.map((s) => s.identifier));
+        const newServers = incomingServers.filter((s) => !existingIdentifiers.has(s.identifier));
+
+        useToolStore.setState({
+          servers: [...existingServers, ...newServers],
+          isServersInit: true,
+        });
+      });
+
+      const finalServers = useToolStore.getState().servers;
+      expect(finalServers).toHaveLength(2);
+      // Existing gmail should keep its original instanceId
+      expect(finalServers.find((s) => s.identifier === 'gmail')?.instanceId).toBe('existing-inst');
+      // New github should be added
+      expect(finalServers.find((s) => s.identifier === 'github')?.instanceId).toBe('github-inst');
+      expect(useToolStore.getState().isServersInit).toBe(true);
+    });
+
+    it('should add all servers when none exist', () => {
+      act(() => {
+        useToolStore.setState({
+          servers: [],
+          loadingServerIds: new Set(),
+          executingToolIds: new Set(),
+          isServersInit: false,
+        });
+      });
+
+      const incomingServers = [
+        {
+          identifier: 'gmail',
+          serverName: 'Gmail',
+          instanceId: 'inst-1',
+          serverUrl: 'https://klavis.ai/gmail',
+          status: KlavisServerStatus.CONNECTED,
+          isAuthenticated: true,
+          createdAt: Date.now(),
+        },
+      ];
+
+      act(() => {
+        const existingServers = useToolStore.getState().servers;
+        const existingIdentifiers = new Set(existingServers.map((s) => s.identifier));
+        const newServers = incomingServers.filter((s) => !existingIdentifiers.has(s.identifier));
+
+        useToolStore.setState({
+          servers: [...existingServers, ...newServers],
+          isServersInit: true,
+        });
+      });
+
+      expect(useToolStore.getState().servers).toHaveLength(1);
+      expect(useToolStore.getState().isServersInit).toBe(true);
+    });
+
+    it('should set isServersInit even when no servers are added', () => {
+      act(() => {
+        useToolStore.setState({
+          servers: [],
+          loadingServerIds: new Set(),
+          executingToolIds: new Set(),
+          isServersInit: false,
+        });
+      });
+
+      // Simulate empty data case
+      act(() => {
+        useToolStore.setState({
+          isServersInit: true,
+        });
+      });
+
+      expect(useToolStore.getState().isServersInit).toBe(true);
+    });
+  });
 });

package/src/store/tool/slices/klavisStore/action.ts

@@ -356,18 +356,19 @@ export const createKlavisStoreSlice: StateCreator<
       {
         fallbackData: [],
         onSuccess: (data) => {
-          if (data.length > 0) {
-            set(
-              produce((draft: KlavisStoreState) => {
+          set(
+            produce((draft: KlavisStoreState) => {
+              if (data.length > 0) {
                 // 使用 identifier 检查是否已存在
                 const existingIdentifiers = new Set(draft.servers.map((s) => s.identifier));
                 const newServers = data.filter((s) => !existingIdentifiers.has(s.identifier));
                 draft.servers = [...draft.servers, ...newServers];
-              }),
-              false,
-              n('useFetchUserKlavisServers'),
-            );
-          }
+              }
+              draft.isServersInit = true;
+            }),
+            false,
+            n('useFetchUserKlavisServers'),
+          );
         },
         revalidateOnFocus: false,
       },

package/src/store/tool/slices/klavisStore/initialState.ts

@@ -9,6 +9,8 @@ import { type KlavisServer } from './types';
 export interface KlavisStoreState {
   /** 正在执行的工具调用 ID 集合 */
   executingToolIds: Set<string>;
+  /** 是否已完成初始化加载 */
+  isServersInit: boolean;
   /** 正在加载的服务器 ID 集合 */
   loadingServerIds: Set<string>;
   /** 已创建的 Klavis Server 列表 */
@@ -20,6 +22,7 @@ export interface KlavisStoreState {
  */
 export const initialKlavisStoreState: KlavisStoreState = {
   executingToolIds: new Set(),
+  isServersInit: false,
   loadingServerIds: new Set(),
   servers: [],
 };

package/src/store/user/slices/auth/action.ts

@@ -41,6 +41,7 @@ const fetchAuthProvidersData = async (): Promise<AuthProvidersData> => {
       accounts
         .filter((account) => account.providerId !== 'credential')
         .map(async (account) => {
+          // In theory, the id_token could be decrypted from the accounts table, but I found that better-auth on GitHub does not save the id_token
           const info = await accountInfo({
             query: { accountId: account.accountId },
           });