@lobehub/chat 1.124.2 → 1.124.4

package/packages/types/src/discover/index.ts

@@ -1,6 +1,3 @@
-import { Locales } from '@/locales/resources';
-import { PageProps } from '@/types/next';
-
 export * from './assistants';
 export * from './mcp';
 export * from './models';
@@ -16,11 +13,6 @@ export enum DiscoverTab {
   Providers = 'provider',
 }
 
-export type DiscoverPageProps<T = string> = PageProps<
-  { slug: T; variants: string },
-  { hl?: Locales }
->;
-
 export type IdentifiersResponse = {
   identifier: string;
   lastModified: string;

package/packages/types/src/index.ts

@@ -6,6 +6,7 @@ export * from './asyncTask';
 export * from './auth';
 export * from './chunk';
 export * from './clientDB';
+export * from './discover';
 export * from './eval';
 export * from './fetch';
 export * from './hotkey';
@@ -17,6 +18,7 @@ export * from './rag';
 export * from './search';
 export * from './serverConfig';
 export * from './session';
+export * from './tool';
 export * from './topic';
 export * from './user';
 export * from './user/settings';

package/packages/types/src/tool/index.ts

@@ -24,3 +24,4 @@ export interface LobeTool {
 export type LobeToolRenderType = LobePluginType | 'builtin';
 
 export * from './builtin';
+export * from './plugin';

package/packages/types/src/tool/tool.ts

@@ -1,4 +1,4 @@
-import { MetaData } from '@/types/meta';
+import { MetaData } from '../meta';
 
 export type LobeToolType = 'builtin' | 'customPlugin' | 'plugin';
 

package/packages/types/src/user/settings/index.ts

@@ -4,13 +4,13 @@ import { UserGeneralConfig } from './general';
 import { UserHotkeyConfig } from './hotkey';
 import { UserKeyVaults } from './keyVaults';
 import { UserModelProviderConfig } from './modelProvider';
-import { UserSyncSettings } from './sync';
 import { UserSystemAgentConfig } from './systemAgent';
 import { UserToolConfig } from './tool';
 import { UserTTSConfig } from './tts';
 
 export type UserDefaultAgent = LobeAgentSettings;
 
+export * from './filesConfig';
 export * from './general';
 export * from './hotkey';
 export * from './keyVaults';
@@ -28,7 +28,6 @@ export interface UserSettings {
   hotkey: UserHotkeyConfig;
   keyVaults: UserKeyVaults;
   languageModel: UserModelProviderConfig;
-  sync?: UserSyncSettings;
   systemAgent: UserSystemAgentConfig;
   tool: UserToolConfig;
   tts: UserTTSConfig;

package/packages/utils/vitest.config.mts

@@ -5,7 +5,6 @@ export default defineConfig({
   test: {
     alias: {
       /* eslint-disable sort-keys-fix/sort-keys-fix */
-      '@/types': resolve(__dirname, '../types/src'),
       '@/const': resolve(__dirname, '../const/src'),
       '@': resolve(__dirname, '../../src'),
       /* eslint-enable */

package/src/app/(backend)/webapi/models/[provider]/pull/route.ts

@@ -5,8 +5,6 @@ import { checkAuth } from '@/app/(backend)/middleware/auth';
 import { initModelRuntimeWithUserPayload } from '@/server/modules/ModelRuntime';
 import { createErrorResponse } from '@/utils/errorResponse';
 
-export const runtime = 'edge';
-
 export const POST = checkAuth(async (req, { params, jwtPayload }) => {
   const { provider } = await params;
 

package/src/app/(backend)/webapi/models/[provider]/route.ts

@@ -6,8 +6,6 @@ import { checkAuth } from '@/app/(backend)/middleware/auth';
 import { initModelRuntimeWithUserPayload } from '@/server/modules/ModelRuntime';
 import { createErrorResponse } from '@/utils/errorResponse';
 
-export const runtime = 'edge';
-
 const noNeedAPIKey = (provider: string) => [ModelProvider.OpenRouter].includes(provider as any);
 
 export const GET = checkAuth(async (req, { params, jwtPayload }) => {

package/src/app/(backend)/webapi/text-to-image/[provider]/route.ts

@@ -6,8 +6,6 @@ import { checkAuth } from '@/app/(backend)/middleware/auth';
 import { initModelRuntimeWithUserPayload } from '@/server/modules/ModelRuntime';
 import { createErrorResponse } from '@/utils/errorResponse';
 
-export const runtime = 'edge';
-
 export const preferredRegion = [
   'arn1',
   'bom1',

package/src/app/(backend)/webapi/trace/route.ts

@@ -4,8 +4,6 @@ import { after } from 'next/server';
 import { TraceClient } from '@/libs/traces';
 import { TraceEventBasePayload, TraceEventPayloads } from '@/types/trace';
 
-export const runtime = 'edge';
-
 export const POST = async (req: Request) => {
   type RequestData = TraceEventPayloads & TraceEventBasePayload;
   const data = (await req.json()) as RequestData;

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/V1Mobile/ActionBar.tsx

@@ -0,0 +1,30 @@
+import { ChatInputActionBar } from '@lobehub/ui/chat';
+import { memo } from 'react';
+
+import { ActionKeys, actionMap } from '@/features/ChatInput/ActionBar/config';
+
+const RenderActionList = ({ dataSource }: { dataSource: ActionKeys[] }) => (
+  <>
+    {dataSource.map((key) => {
+      // @ts-ignore
+      const Render = actionMap[key];
+      return <Render key={key} />;
+    })}
+  </>
+);
+
+export interface ActionBarProps {
+  leftActions: ActionKeys[];
+  padding?: number | string;
+  rightActions: ActionKeys[];
+}
+
+const ActionBar = memo<ActionBarProps>(({ padding = '0 8px', leftActions, rightActions }) => (
+  <ChatInputActionBar
+    leftAddons={<RenderActionList dataSource={leftActions} />}
+    padding={padding}
+    rightAddons={<RenderActionList dataSource={rightActions} />}
+  />
+));
+
+export default ActionBar;

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/V1Mobile/Files/index.tsx

@@ -0,0 +1,32 @@
+import { PreviewGroup } from '@lobehub/ui';
+import isEqual from 'fast-deep-equal';
+import { memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+import FileItem from '@/features/ChatInput/Mobile/FilePreview/FileItem';
+import { filesSelectors, useFileStore } from '@/store/file';
+
+const Files = memo(() => {
+  const list = useFileStore(filesSelectors.chatUploadFileList, isEqual);
+
+  if (!list || list?.length === 0) return null;
+
+  return (
+    <Flexbox paddingBlock={4} style={{ position: 'relative' }}>
+      <Flexbox
+        gap={4}
+        horizontal
+        padding={'4px 8px 8px'}
+        style={{ overflow: 'scroll', width: '100%' }}
+      >
+        <PreviewGroup>
+          {list.map((i) => (
+            <FileItem {...i} key={i.id} loading={i.status === 'pending'} />
+          ))}
+        </PreviewGroup>
+      </Flexbox>
+    </Flexbox>
+  );
+});
+
+export default Files;

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/V1Mobile/InputArea/Container.tsx

@@ -0,0 +1,41 @@
+import { css, cx } from 'antd-style';
+import { FC, ReactNode, memo } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+const container = css`
+  height: inherit;
+  padding-block: 0;
+  padding-inline: 8px;
+`;
+
+interface InnerContainerProps {
+  bottomAddons?: ReactNode;
+  children: ReactNode;
+  expand?: boolean;
+  textAreaLeftAddons?: ReactNode;
+  textAreaRightAddons?: ReactNode;
+  topAddons?: ReactNode;
+}
+
+const InnerContainer: FC<InnerContainerProps> = memo(
+  ({ children, expand, textAreaRightAddons, textAreaLeftAddons, bottomAddons, topAddons }) =>
+    expand ? (
+      <Flexbox className={cx(container)} gap={8}>
+        <Flexbox gap={8} horizontal justify={'flex-end'}>
+          {textAreaLeftAddons}
+          {textAreaRightAddons}
+        </Flexbox>
+        {children}
+        {topAddons}
+        {bottomAddons}
+      </Flexbox>
+    ) : (
+      <Flexbox align={'flex-end'} className={cx(container)} gap={8} horizontal>
+        {textAreaLeftAddons}
+        {children}
+        {textAreaRightAddons}
+      </Flexbox>
+    ),
+);
+
+export default InnerContainer;

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/V1Mobile/InputArea/index.tsx

@@ -0,0 +1,156 @@
+import { ActionIcon, TextArea } from '@lobehub/ui';
+import { SafeArea } from '@lobehub/ui/mobile';
+import { useSize } from 'ahooks';
+import { createStyles } from 'antd-style';
+import { TextAreaRef } from 'antd/es/input/TextArea';
+import { ChevronDown, ChevronUp } from 'lucide-react';
+import { rgba } from 'polished';
+import { CSSProperties, ReactNode, forwardRef, useEffect, useRef, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
+
+import InnerContainer from './Container';
+
+const useStyles = createStyles(({ css, token }) => {
+  return {
+    container: css`
+      flex: none;
+      padding-block: 12px 12px;
+      border-block-start: 1px solid ${rgba(token.colorBorder, 0.25)};
+      background: ${token.colorFillQuaternary};
+    `,
+    expand: css`
+      position: absolute;
+      height: 100%;
+    `,
+    expandButton: css`
+      position: absolute;
+      inset-inline-start: 14px;
+    `,
+    textarea: css`
+      flex: 1;
+      transition: none !important;
+    `,
+  };
+});
+
+export interface MobileChatInputAreaProps {
+  bottomAddons?: ReactNode;
+  className?: string;
+  expand?: boolean;
+  loading?: boolean;
+  onInput?: (value: string) => void;
+  onSend?: () => void;
+  safeArea?: boolean;
+  setExpand?: (expand: boolean) => void;
+  style?: CSSProperties;
+  textAreaLeftAddons?: ReactNode;
+  textAreaRightAddons?: ReactNode;
+  topAddons?: ReactNode;
+  value: string;
+}
+
+const MobileChatInputArea = forwardRef<TextAreaRef, MobileChatInputAreaProps>(
+  (
+    {
+      className,
+      style,
+      topAddons,
+      textAreaLeftAddons,
+      textAreaRightAddons,
+      bottomAddons,
+      expand = false,
+      setExpand,
+      onSend,
+      onInput,
+      loading,
+      value,
+      safeArea,
+    },
+    ref,
+  ) => {
+    const { t } = useTranslation('chat');
+    const isChineseInput = useRef(false);
+    const containerRef = useRef<HTMLDivElement>(null);
+    const { cx, styles } = useStyles();
+    const size = useSize(containerRef);
+    const [showFullscreen, setShowFullscreen] = useState<boolean>(false);
+    const [isFocused, setIsFocused] = useState<boolean>(false);
+
+    useEffect(() => {
+      if (!size?.height) return;
+      setShowFullscreen(size.height > 72);
+    }, [size]);
+
+    const showAddons = !expand && !isFocused;
+
+    return (
+      <Flexbox
+        className={cx(styles.container, expand && styles.expand, className)}
+        gap={12}
+        style={style}
+      >
+        {topAddons && <Flexbox style={showAddons ? {} : { display: 'none' }}>{topAddons}</Flexbox>}
+        <Flexbox
+          className={cx(expand && styles.expand)}
+          ref={containerRef}
+          style={{ position: 'relative' }}
+        >
+          {showFullscreen && (
+            <ActionIcon
+              active
+              className={styles.expandButton}
+              icon={expand ? ChevronDown : ChevronUp}
+              onClick={() => setExpand?.(!expand)}
+              size={{ blockSize: 24, borderRadius: '50%', size: 14 }}
+              style={expand ? { top: 6 } : {}}
+            />
+          )}
+          <InnerContainer
+            bottomAddons={bottomAddons}
+            expand={expand}
+            textAreaLeftAddons={textAreaLeftAddons}
+            textAreaRightAddons={textAreaRightAddons}
+            topAddons={topAddons}
+          >
+            <TextArea
+              autoSize={expand ? false : { maxRows: 6, minRows: 0 }}
+              className={styles.textarea}
+              onBlur={(e) => {
+                onInput?.(e.target.value);
+                setIsFocused(false);
+              }}
+              onChange={(e) => {
+                onInput?.(e.target.value);
+              }}
+              onCompositionEnd={() => {
+                isChineseInput.current = false;
+              }}
+              onCompositionStart={() => {
+                isChineseInput.current = true;
+              }}
+              onFocus={() => setIsFocused(true)}
+              onPressEnter={(e) => {
+                if (!loading && !isChineseInput.current && e.shiftKey) {
+                  e.preventDefault();
+                  onSend?.();
+                }
+              }}
+              placeholder={t('sendPlaceholder')}
+              ref={ref}
+              style={{ height: 36, paddingBlock: 6 }}
+              value={value}
+              variant={expand ? 'borderless' : 'filled'}
+            />
+          </InnerContainer>
+        </Flexbox>
+        {bottomAddons && (
+          <Flexbox style={showAddons ? {} : { display: 'none' }}>{bottomAddons}</Flexbox>
+        )}
+        {safeArea && !isFocused && <SafeArea position={'bottom'} />}
+      </Flexbox>
+    );
+  },
+);
+
+export default MobileChatInputArea;

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/V1Mobile/Send.tsx

@@ -0,0 +1,33 @@
+import { ActionIcon, type ActionIconSize, Button } from '@lobehub/ui';
+import { Loader2, SendHorizontal } from 'lucide-react';
+import { memo } from 'react';
+
+export interface MobileChatSendButtonProps {
+  disabled?: boolean;
+  loading?: boolean;
+  onSend?: () => void;
+  onStop?: () => void;
+}
+
+const MobileChatSendButton = memo<MobileChatSendButtonProps>(
+  ({ loading, onStop, onSend, disabled }) => {
+    const size: ActionIconSize = {
+      blockSize: 36,
+      size: 16,
+    };
+
+    return loading ? (
+      <ActionIcon active icon={Loader2} onClick={onStop} size={size} spin />
+    ) : (
+      <Button
+        disabled={disabled}
+        icon={SendHorizontal}
+        onClick={onSend}
+        style={{ flex: 'none' }}
+        type={'primary'}
+      />
+    );
+  },
+);
+
+export default MobileChatSendButton;

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/V1Mobile/index.tsx

@@ -0,0 +1,89 @@
+'use client';
+
+import { Skeleton } from 'antd';
+import { useTheme } from 'antd-style';
+import { TextAreaRef } from 'antd/es/input/TextArea';
+import { memo, useRef, useState } from 'react';
+import { Flexbox } from 'react-layout-kit';
+
+import { ActionKeys } from '@/features/ChatInput/ActionBar/config';
+import { useInitAgentConfig } from '@/hooks/useInitAgentConfig';
+import { useChatStore } from '@/store/chat';
+import { chatSelectors } from '@/store/chat/selectors';
+
+import ActionBar from './ActionBar';
+import Files from './Files';
+import InputArea from './InputArea';
+import SendButton from './Send';
+import { useSendMessage } from './useSend';
+
+const defaultLeftActions: ActionKeys[] = [
+  'model',
+  'search',
+  'fileUpload',
+  'knowledgeBase',
+  'tools',
+  'params',
+  'mainToken',
+];
+
+const defaultRightActions: ActionKeys[] = ['saveTopic', 'clear'];
+
+const MobileChatInput = memo(() => {
+  const theme = useTheme();
+  const ref = useRef<TextAreaRef>(null);
+  const [expand, setExpand] = useState<boolean>(false);
+  const { send: sendMessage, canSend } = useSendMessage();
+  const { isLoading } = useInitAgentConfig();
+
+  const [loading, value, onInput, onStop] = useChatStore((s) => [
+    chatSelectors.isAIGenerating(s),
+    s.inputMessage,
+    s.updateInputMessage,
+    s.stopGenerateMessage,
+  ]);
+
+  return (
+    <InputArea
+      expand={expand}
+      onInput={onInput}
+      onSend={() => {
+        setExpand(false);
+
+        sendMessage();
+      }}
+      ref={ref}
+      setExpand={setExpand}
+      style={{
+        background: theme.colorBgLayout,
+        top: expand ? 0 : undefined,
+        width: '100%',
+        zIndex: 101,
+      }}
+      textAreaRightAddons={
+        <SendButton disabled={!canSend} loading={loading} onSend={sendMessage} onStop={onStop} />
+      }
+      topAddons={
+        isLoading ? (
+          <Flexbox paddingInline={8}>
+            <Skeleton.Button active block size={'small'} />
+          </Flexbox>
+        ) : (
+          <>
+            <Files />
+            <ActionBar
+              leftActions={defaultLeftActions}
+              padding={'0 8px'}
+              rightActions={defaultRightActions}
+            />
+          </>
+        )
+      }
+      value={value}
+    />
+  );
+});
+
+MobileChatInput.displayName = 'MobileChatInput';
+
+export default MobileChatInput;

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/V1Mobile/useSend.ts

@@ -0,0 +1,102 @@
+import { useAnalytics } from '@lobehub/analytics/react';
+import { useCallback, useMemo } from 'react';
+
+import { useGeminiChineseWarning } from '@/hooks/useGeminiChineseWarning';
+import { getAgentStoreState } from '@/store/agent';
+import { agentSelectors } from '@/store/agent/selectors';
+import { useChatStore } from '@/store/chat';
+import { chatSelectors, topicSelectors } from '@/store/chat/selectors';
+import { fileChatSelectors, useFileStore } from '@/store/file';
+import { getUserStoreState } from '@/store/user';
+import { SendMessageParams } from '@/types/message';
+
+export type UseSendMessageParams = Pick<
+  SendMessageParams,
+  'onlyAddUserMessage' | 'isWelcomeQuestion'
+>;
+
+export const useSendMessage = () => {
+  const [sendMessage, updateInputMessage] = useChatStore((s) => [
+    s.sendMessage,
+    s.updateInputMessage,
+  ]);
+  const { analytics } = useAnalytics();
+  const checkGeminiChineseWarning = useGeminiChineseWarning();
+
+  const clearChatUploadFileList = useFileStore((s) => s.clearChatUploadFileList);
+
+  const isUploadingFiles = useFileStore(fileChatSelectors.isUploadingFiles);
+  const isSendButtonDisabledByMessage = useChatStore(chatSelectors.isSendButtonDisabledByMessage);
+
+  const canSend = !isUploadingFiles && !isSendButtonDisabledByMessage;
+
+  const send = useCallback(async (params: UseSendMessageParams = {}) => {
+    const store = useChatStore.getState();
+    if (chatSelectors.isAIGenerating(store)) return;
+
+    // if uploading file or send button is disabled by message, then we should not send the message
+    const isUploadingFiles = fileChatSelectors.isUploadingFiles(useFileStore.getState());
+    const isSendButtonDisabledByMessage = chatSelectors.isSendButtonDisabledByMessage(
+      useChatStore.getState(),
+    );
+
+    const canSend = !isUploadingFiles && !isSendButtonDisabledByMessage;
+    if (!canSend) return;
+
+    const fileList = fileChatSelectors.chatUploadFileList(useFileStore.getState());
+    // if there is no message and no image, then we should not send the message
+    if (!store.inputMessage && fileList.length === 0) return;
+
+    // Check for Chinese text warning with Gemini model
+    const agentStore = getAgentStoreState();
+    const currentModel = agentSelectors.currentAgentModel(agentStore);
+    const shouldContinue = await checkGeminiChineseWarning({
+      model: currentModel,
+      prompt: store.inputMessage,
+      scenario: 'chat',
+    });
+
+    if (!shouldContinue) return;
+
+    sendMessage({
+      files: fileList,
+      message: store.inputMessage,
+      ...params,
+    });
+
+    updateInputMessage('');
+    clearChatUploadFileList();
+
+    // 获取分析数据
+    const userStore = getUserStoreState();
+
+    // 直接使用现有数据结构判断消息类型
+    const hasImages = fileList.some((file) => file.file?.type?.startsWith('image'));
+    const messageType = fileList.length === 0 ? 'text' : hasImages ? 'image' : 'file';
+
+    analytics?.track({
+      name: 'send_message',
+      properties: {
+        chat_id: store.activeId || 'unknown',
+        current_topic: topicSelectors.currentActiveTopic(store)?.title || null,
+        has_attachments: fileList.length > 0,
+        history_message_count: chatSelectors.activeBaseChats(store).length,
+        message: store.inputMessage,
+        message_length: store.inputMessage.length,
+        message_type: messageType,
+        selected_model: agentSelectors.currentAgentModel(agentStore),
+        session_id: store.activeId || 'inbox', // 当前活跃的会话ID
+        user_id: userStore.user?.id || 'anonymous',
+      },
+    });
+    // const hasSystemRole = agentSelectors.hasSystemRole(useAgentStore.getState());
+    // const agentSetting = useAgentStore.getState().agentSettingInstance;
+
+    // // if there is a system role, then we need to use agent setting instance to autocomplete agent meta
+    // if (hasSystemRole && !!agentSetting) {
+    //   agentSetting.autocompleteAllMeta();
+    // }
+  }, []);
+
+  return useMemo(() => ({ canSend, send }), [canSend]);
+};

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatInput/index.tsx

@@ -1,5 +1,5 @@
 import DesktopChatInput from './Desktop';
-import MobileChatInput from './Mobile';
+import MobileChatInput from './V1Mobile';
 
 const ChatInput = ({ mobile }: { mobile: boolean }) => {
   const Input = mobile ? MobileChatInput : DesktopChatInput;

package/src/app/[variants]/(main)/settings/_layout/Mobile/Header.tsx

@@ -26,10 +26,14 @@ const Header = memo(() => {
   const pathname = usePathname();
   const isProvider = pathname.includes('/settings/provider/');
   const providerName = useProviderName(activeSettingsKey);
+  const isProviderList = pathname === '/settings/provider';
+  const isProviderDetail = isProvider && !isProviderList;
 
   const handleBackClick = () => {
     if (isSessionActive && showMobileWorkspace) {
       router.push('/chat');
+    } else if (isProviderDetail) {
+      router.push('/settings/provider');
     } else {
       router.push(enableAuth ? '/me/settings' : '/me');
     }

package/src/features/ChatInput/ActionBar/SaveTopic/index.tsx

@@ -5,13 +5,14 @@ import { memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
+import { useIsMobile } from '@/hooks/useIsMobile';
 import { useActionSWR } from '@/libs/swr';
 import { useChatStore } from '@/store/chat';
 import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
 import { HotkeyEnum } from '@/types/hotkey';
 
-const SaveTopic = memo<{ mobile?: boolean }>(({ mobile }) => {
+const SaveTopic = memo(() => {
   const { t } = useTranslation('chat');
   const hotkey = useUserStore(settingsSelectors.getHotkeyById(HotkeyEnum.SaveTopic));
   const [hasTopic, openNewTopicOrSaveTopic] = useChatStore((s) => [
@@ -19,6 +20,8 @@ const SaveTopic = memo<{ mobile?: boolean }>(({ mobile }) => {
     s.openNewTopicOrSaveTopic,
   ]);
 
+  const mobile = useIsMobile();
+
   const { mutate, isValidating } = useActionSWR('openNewTopicOrSaveTopic', openNewTopicOrSaveTopic);
 
   const [confirmOpened, setConfirmOpened] = useState(false);

package/packages/const/src/settings/sync.ts

@@ -1,5 +0,0 @@
-import { UserSyncSettings } from '@/types/user/settings';
-
-export const DEFAULT_SYNC_CONFIG: UserSyncSettings = {
-  webrtc: { enabled: false },
-};