@lobehub/lobehub 2.0.0-next.46 → 2.0.0-next.48

package/src/app/market-auth-callback/page.tsx

@@ -0,0 +1,196 @@
+'use client';
+
+import { Icon } from '@lobehub/ui';
+import { Card, Result } from 'antd';
+import { CheckCircle, Clock, ShieldX } from 'lucide-react';
+import { useEffect, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Center } from 'react-layout-kit';
+
+type CallbackStatus = 'loading' | 'success' | 'error';
+
+/**
+ * Market OIDC 授权回调页面
+ * 处理从 OIDC 服务器返回的授权码
+ */
+const MarketAuthCallbackPage = () => {
+  const { t } = useTranslation('marketAuth');
+  const [status, setStatus] = useState<CallbackStatus>('loading');
+  const [message, setMessage] = useState('');
+  const [countdown, setCountdown] = useState(3);
+
+  useEffect(() => {
+    console.log('[MarketAuthCallback] Processing authorization callback');
+
+    const urlParams = new URLSearchParams(window.location.search);
+    const code = urlParams.get('code');
+    const state = urlParams.get('state');
+    const error = urlParams.get('error');
+    const errorDescription = urlParams.get('error_description');
+
+    if (error) {
+      console.error('[MarketAuthCallback] Authorization error:', error, errorDescription);
+      setStatus('error');
+      setMessage(t('callback.messages.authFailed', { error: errorDescription || error }));
+
+      // 向父窗口发送错误消息
+      if (window.opener) {
+        window.opener.postMessage(
+          {
+            error: errorDescription || error,
+            type: 'MARKET_AUTH_ERROR',
+          },
+          window.location.origin,
+        );
+      }
+      return;
+    }
+
+    if (code && state) {
+      console.log('[MarketAuthCallback] Authorization successful, code received');
+      setStatus('success');
+      setMessage(t('callback.messages.successWithRedirect'));
+
+      // 向父窗口发送成功消息
+      if (window.opener) {
+        window.opener.postMessage(
+          {
+            code,
+            state,
+            type: 'MARKET_AUTH_SUCCESS',
+          },
+          window.location.origin,
+        );
+      }
+
+      // 开始倒计时并在3秒后关闭窗口
+      let timeLeft = 3;
+      setCountdown(timeLeft);
+
+      const countdownTimer = setInterval(() => {
+        timeLeft -= 1;
+        setCountdown(timeLeft);
+
+        if (timeLeft <= 0) {
+          clearInterval(countdownTimer);
+          window.close();
+        }
+      }, 1000);
+    } else {
+      console.error('[MarketAuthCallback] Missing code or state parameter');
+      setStatus('error');
+      setMessage(t('callback.messages.missingParams'));
+
+      if (window.opener) {
+        window.opener.postMessage(
+          {
+            error: 'Missing authorization parameters',
+            type: 'MARKET_AUTH_ERROR',
+          },
+          window.location.origin,
+        );
+      }
+    }
+  }, [t]);
+
+  const getStatusIcon = () => {
+    switch (status) {
+      case 'success': {
+        return <Icon icon={CheckCircle} />;
+      }
+      case 'error': {
+        return <Icon icon={ShieldX} />;
+      }
+      default: {
+        return <Icon icon={Clock} />;
+      }
+    }
+  };
+
+  const getResultStatus = () => {
+    switch (status) {
+      case 'success': {
+        return 'success';
+      }
+      case 'error': {
+        return 'error';
+      }
+      default: {
+        return 'info';
+      }
+    }
+  };
+
+  const getTitle = () => {
+    switch (status) {
+      case 'loading': {
+        return t('callback.titles.loading');
+      }
+      case 'success': {
+        return t('callback.titles.success');
+      }
+      case 'error': {
+        return t('callback.titles.error');
+      }
+    }
+  };
+
+  const getSubTitle = () => {
+    if (status === 'loading') {
+      return t('callback.messages.processing');
+    }
+    if (status === 'success') {
+      return t('callback.messages.successWithCountdown', { countdown, message });
+    }
+    return message;
+  };
+
+  const getExtra = () => {
+    if (status === 'error') {
+      return (
+        <button
+          onClick={() => window.close()}
+          style={{
+            backgroundColor: '#ff4d4f',
+            border: 'none',
+            borderRadius: '6px',
+            color: 'white',
+            cursor: 'pointer',
+            fontSize: '14px',
+            padding: '8px 16px',
+          }}
+          type="button"
+        >
+          {t('callback.buttons.close')}
+        </button>
+      );
+    }
+    return undefined;
+  };
+
+  return (
+    <Center height="100vh">
+      <Card
+        style={{
+          alignItems: 'center',
+          display: 'flex',
+          justifyContent: 'center',
+          minHeight: 280,
+          minWidth: 500,
+          width: '100%',
+        }}
+      >
+        <Result
+          extra={getExtra()}
+          icon={getStatusIcon()}
+          status={getResultStatus()}
+          style={{ padding: 0 }}
+          subTitle={getSubTitle()}
+          title={getTitle()}
+        />
+      </Card>
+    </Center>
+  );
+};
+
+export default MarketAuthCallbackPage;

package/src/envs/app.ts

@@ -18,7 +18,9 @@ const APP_URL = process.env.APP_URL
   ? process.env.APP_URL
   : isInVercel
     ? vercelUrl
-    : 'http://localhost:3010';
+    : process.env.NODE_ENV === 'development'
+      ? 'http://localhost:3010'
+      : 'http://localhost:3210';
 
 // INTERNAL_APP_URL is used for server-to-server calls to bypass CDN/proxy
 // Falls back to APP_URL if not set
@@ -37,7 +39,6 @@ export const getAppConfig = () => {
     },
     server: {
       ACCESS_CODES: z.any(z.string()).optional(),
-
       AGENTS_INDEX_URL: z.string().url(),
 
       DEFAULT_AGENT_CONFIG: z.string(),
@@ -46,7 +47,7 @@ export const getAppConfig = () => {
       PLUGINS_INDEX_URL: z.string().url(),
       PLUGIN_SETTINGS: z.string().optional(),
 
-      APP_URL: z.string().optional(),
+      APP_URL: z.string(),
       INTERNAL_APP_URL: z.string().optional(),
       VERCEL_EDGE_CONFIG: z.string().optional(),
       MIDDLEWARE_REWRITE_THROUGH_LOCAL: z.boolean().optional(),

package/src/features/AgentSetting/AgentPrompt/TokenTag.tsx

@@ -1,9 +1,9 @@
 import { Tag } from '@lobehub/ui';
-import { memo } from 'react';
+import React, { memo } from 'react';
 
 import { useTokenCount } from '@/hooks/useTokenCount';
 
-const Tokens = memo<{ value: string }>(({ value }) => {
+const Tokens = memo<{ style?: React.CSSProperties, value: string; }>(({ value, style }) => {
   const systemTokenCount = useTokenCount(value);
   if (!value || !systemTokenCount) return;
 
@@ -12,6 +12,7 @@ const Tokens = memo<{ value: string }>(({ value }) => {
       style={{
         marginTop: 24,
         width: 'fit-content',
+        ...style,
       }}
     >
       Token: {systemTokenCount}

package/src/features/AgentSetting/AgentTTS/SelectWithTTSPreview.tsx

@@ -1,3 +1,4 @@
+import { getMessageError } from '@lobechat/fetch-sse';
 import { ChatMessageError } from '@lobechat/types';
 import { AudioPlayer } from '@lobehub/tts/react';
 import { Alert, Button, Highlighter, Select, SelectProps } from '@lobehub/ui';
@@ -9,7 +10,6 @@ import { Flexbox } from 'react-layout-kit';
 
 import { useTTS } from '@/hooks/useTTS';
 import { TTSServer } from '@/types/agent';
-import { getMessageError } from '@/utils/fetch';
 
 interface SelectWithTTSPreviewProps extends SelectProps {
   server: TTSServer;

package/src/features/AgentSetting/store/action.ts

@@ -1,3 +1,4 @@
+import { MessageTextChunk } from '@lobechat/fetch-sse';
 import {
   chainPickEmoji,
   chainSummaryAgentName,
@@ -16,7 +17,6 @@ import { systemAgentSelectors } from '@/store/user/slices/settings/selectors';
 import { LobeAgentChatConfig, LobeAgentConfig } from '@/types/agent';
 import { MetaData } from '@/types/meta';
 import { SystemAgentItem } from '@/types/user/settings';
-import { MessageTextChunk } from '@/utils/fetch';
 import { merge } from '@/utils/merge';
 import { setNamespace } from '@/utils/storeDebug';
 

package/src/features/ChatInput/ActionBar/STT/browser.tsx

@@ -1,3 +1,4 @@
+import { getMessageError } from '@lobechat/fetch-sse';
 import { ChatMessageError } from '@lobechat/types';
 import { SpeechRecognitionOptions, useSpeechRecognition } from '@lobehub/tts/react';
 import isEqual from 'fast-deep-equal';
@@ -13,7 +14,6 @@ import { useGlobalStore } from '@/store/global';
 import { globalGeneralSelectors } from '@/store/global/selectors';
 import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
-import { getMessageError } from '@/utils/fetch';
 
 import CommonSTT from './common';
 

package/src/features/ChatInput/ActionBar/STT/openai.tsx

@@ -1,3 +1,4 @@
+import { getMessageError } from '@lobechat/fetch-sse';
 import { ChatMessageError } from '@lobechat/types';
 import { getRecordMineType } from '@lobehub/tts';
 import { OpenAISTTOptions, useOpenAISTT } from '@lobehub/tts/react';
@@ -16,7 +17,6 @@ import { useGlobalStore } from '@/store/global';
 import { globalGeneralSelectors } from '@/store/global/selectors';
 import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
-import { getMessageError } from '@/utils/fetch';
 
 import CommonSTT from './common';
 

package/src/features/Conversation/components/Extras/TTS/InitPlayer.tsx

@@ -1,3 +1,4 @@
+import { getMessageError } from '@lobechat/fetch-sse';
 import { ChatMessageError, ChatTTS } from '@lobechat/types';
 import { memo, useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -5,7 +6,6 @@ import { useTranslation } from 'react-i18next';
 import { useTTS } from '@/hooks/useTTS';
 import { useChatStore } from '@/store/chat';
 import { useFileStore } from '@/store/file';
-import { getMessageError } from '@/utils/fetch';
 
 import Player from './Player';
 

package/src/features/Conversation/components/VirtualizedList/index.tsx

@@ -1,5 +1,6 @@
 'use client';
 
+import isEqual from 'fast-deep-equal';
 import {
   ReactNode,
   forwardRef,
@@ -132,6 +133,6 @@ const VirtualizedList = memo<VirtualizedListProps>(({ mobile, dataSource, itemCo
       </WideScreenContainer>
     </VirtuosoContext>
   );
-});
+}, isEqual);
 
 export default VirtualizedList;

package/src/features/PluginTag/PluginStatus.tsx

@@ -54,7 +54,7 @@ const PluginStatus = memo<PluginStatusProps>(({ title, id, deprecated }) => {
   }, [status]);
 
   const tag =
-    // 废弃标签
+    // 拒绝标签
     deprecated ? (
       <Tag bordered={false} color={'red'} style={{ marginRight: 0 }}>
         {t('list.item.deprecated.title', { ns: 'plugin' })}

package/src/features/PluginsUI/Render/MCPType/index.tsx

@@ -1,4 +1,4 @@
-import { Markdown } from '@lobehub/ui';
+import { Image, Markdown } from '@lobehub/ui';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
@@ -21,14 +21,22 @@ const MCPType = memo<MCPTypeProps>(({ pluginState, arguments: args }) => {
 
   const { content } = pluginState;
 
+  const hasImage = content.some((item) => item.type === 'image');
   return (
-    <Flexbox gap={8} style={{ maxHeight: 400, overflow: 'scroll', padding: 8, width: '100%' }}>
-      <div>
-        <Arguments arguments={args} />
-      </div>
+    <Flexbox
+      gap={8}
+      style={
+        !hasImage ? { maxHeight: 400, overflow: 'scroll', padding: 8, width: '100%' } : undefined
+      }
+    >
+      {args && (
+        <div>
+          <Arguments arguments={args} />
+        </div>
+      )}
       <Flexbox>
         <Flexbox>
-          {content.map((item) => {
+          {content.map((item, index) => {
             switch (item.type) {
               case 'text': {
                 return (
@@ -38,6 +46,18 @@ const MCPType = memo<MCPTypeProps>(({ pluginState, arguments: args }) => {
                 );
               }
 
+              case 'image': {
+                return (
+                  <Image
+                    alt="MCP content"
+                    height={'auto'}
+                    key={`image-${index}`}
+                    src={item.data}
+                    width={'100%'}
+                  />
+                );
+              }
+
               default: {
                 return null;
               }

package/src/hooks/useAgentOwnershipCheck.ts

@@ -0,0 +1,143 @@
+import { useEffect, useState } from 'react';
+
+import { useMarketAuth } from '@/layout/AuthProvider/MarketAuth';
+import { MarketAuthContextType } from '@/layout/AuthProvider/MarketAuth/types';
+import { marketApiService } from '@/services/marketApi';
+
+interface AgentOwnershipResult {
+  // null = loading, true = 是用户的, false = 不是用户的
+  error?: string;
+  isOwnAgent: boolean | null;
+}
+
+// 简单的缓存机制避免重复 API 调用
+const agentOwnershipCache = new Map<string, { result: boolean; timestamp: number }>();
+const CACHE_DURATION = 5 * 60 * 1000; // 5分钟缓存
+
+const buildCacheKey = (marketIdentifier: string, accountId?: string | number | null) =>
+  `${marketIdentifier}::${accountId ?? 'unknown'}`;
+
+/**
+ * 获取当前用户 ID
+ */
+function getCurrentAccountId(marketAuth: MarketAuthContextType): string | number | null {
+  try {
+    // 首先尝试从 marketAuth 中获取用户信息
+    const userInfo = marketAuth.getCurrentUserInfo?.();
+    if (userInfo?.accountId !== null) {
+      console.log('[useAgentOwnershipCheck] User ID from userInfo:', userInfo?.accountId);
+      return userInfo?.accountId ?? null;
+    }
+
+    // 如果没有，尝试从 sessionStorage 中获取
+    const userInfoData = sessionStorage.getItem('market_user_info');
+    if (userInfoData) {
+      const parsedUserInfo = JSON.parse(userInfoData);
+      console.log(
+        '[useAgentOwnershipCheck] User ID from sessionStorage:',
+        parsedUserInfo.accountId,
+      );
+      return parsedUserInfo.accountId ?? parsedUserInfo.sub ?? null;
+    }
+
+    console.warn('[useAgentOwnershipCheck] No user ID found');
+    return null;
+  } catch (error) {
+    console.error('[useAgentOwnershipCheck] Failed to get current user ID:', error);
+    return null;
+  }
+}
+
+interface CheckOwnershipParams {
+  accessToken?: string;
+  accountId?: string | number | null;
+  marketIdentifier?: string;
+  skipCache?: boolean;
+}
+
+/**
+ * 校验当前账号是否为指定 agent 的 owner
+ */
+export const checkOwnership = async ({
+  accountId,
+  accessToken,
+  marketIdentifier,
+  skipCache = false,
+}: CheckOwnershipParams): Promise<boolean> => {
+  if (!marketIdentifier || !accountId || !accessToken) {
+    console.warn('[checkOwnership] Missing required parameters', {
+      accessToken: Boolean(accessToken),
+      accountId,
+      marketIdentifier,
+    });
+    return false;
+  }
+
+  const cacheKey = buildCacheKey(marketIdentifier, accountId);
+  const cached = agentOwnershipCache.get(cacheKey);
+  if (!skipCache && cached && Date.now() - cached.timestamp < CACHE_DURATION) {
+    console.log('[checkOwnership] Using cached result:', cached.result);
+    return cached.result;
+  }
+
+  marketApiService.setAccessToken(accessToken);
+  const agentDetail = await marketApiService.getAgentDetail(marketIdentifier);
+  console.log('[checkOwnership] Agent detail:', agentDetail);
+
+  const isOwner = `${agentDetail?.ownerId ?? ''}` === `${accountId}`;
+  agentOwnershipCache.set(cacheKey, {
+    result: isOwner,
+    timestamp: Date.now(),
+  });
+
+  return isOwner;
+};
+
+/**
+ * 检查当前用户是否拥有指定的 agent
+ */
+export const useAgentOwnershipCheck = (marketIdentifier?: string): AgentOwnershipResult => {
+  const [result, setResult] = useState<AgentOwnershipResult>({ isOwnAgent: null });
+  const marketAuth = useMarketAuth();
+  const { session, isAuthenticated } = marketAuth;
+
+  useEffect(() => {
+    if (!marketIdentifier || !isAuthenticated || !session) {
+      setResult({ isOwnAgent: false });
+      return;
+    }
+
+    const runOwnershipCheck = async () => {
+      try {
+        console.log('[useAgentOwnershipCheck] Checking ownership for:', marketIdentifier);
+
+        // 获取当前用户 ID
+        const currentAccountId = getCurrentAccountId(marketAuth);
+        console.log('[useAgentOwnershipCheck] Current user ID:', currentAccountId);
+
+        if (!currentAccountId) {
+          console.warn('[useAgentOwnershipCheck] Could not get current user ID');
+          setResult({ isOwnAgent: false });
+          return;
+        }
+
+        const isOwner = await checkOwnership({
+          accessToken: session.accessToken,
+          accountId: currentAccountId,
+          marketIdentifier,
+        });
+
+        setResult({ isOwnAgent: isOwner });
+      } catch (error) {
+        setResult({
+          error: error instanceof Error ? error.message : 'Unknown error',
+          isOwnAgent: false,
+        });
+      }
+    };
+
+    runOwnershipCheck();
+  }, [marketIdentifier, isAuthenticated, session, marketAuth]);
+
+  return result;
+};

package/src/instrumentation.node.ts

@@ -1,4 +1,5 @@
-import { register } from '@lobechat/observability-otel/node'
+import { register } from '@lobechat/observability-otel/node';
+
 import { version } from '../package.json';
 
-register({ version })
+register({ version });