@lobehub/chat 0.118.10 → 0.119.0

package/src/database/models/message.ts

@@ -168,6 +168,41 @@ class _MessageModel extends BaseModel {
     return this.table.where('sessionId').equals(sessionId).toArray();
   }
 
+  queryByTopicId = async (topicId: string) => {
+    const dbMessages = await this.table.where('topicId').equals(topicId).toArray();
+
+    return dbMessages.map((message) => this.mapToChatMessage(message));
+  };
+
+  async duplicateMessages(messages: ChatMessage[]): Promise<ChatMessage[]> {
+    const duplicatedMessages = await this.createDuplicateMessages(messages);
+    // 批量添加复制后的消息到数据库
+    await this.batchCreate(duplicatedMessages);
+    return duplicatedMessages;
+  }
+
+  async createDuplicateMessages(messages: ChatMessage[]): Promise<ChatMessage[]> {
+    // 创建一个映射来存储原始消息ID和复制消息ID之间的关系
+    const idMapping = new Map<string, string>();
+
+    // 首先复制所有消息，并为每个复制的消息生成新的ID
+    const duplicatedMessages = messages.map((originalMessage) => {
+      const newId = nanoid();
+      idMapping.set(originalMessage.id, newId);
+
+      return { ...originalMessage, id: newId };
+    });
+
+    // 更新 parentId 为复制后的新ID
+    for (const duplicatedMessage of duplicatedMessages) {
+      if (duplicatedMessage.parentId && idMapping.has(duplicatedMessage.parentId)) {
+        duplicatedMessage.parentId = idMapping.get(duplicatedMessage.parentId);
+      }
+    }
+
+    return duplicatedMessages;
+  }
+
   private mapChatMessageToDBMessage(message: ChatMessage): DB_Message {
     const { extra, ...messageData } = message;
 

package/src/database/models/session.ts

@@ -2,6 +2,7 @@ import { DeepPartial } from 'utility-types';
 
 import { DEFAULT_AGENT_LOBE_SESSION } from '@/const/session';
 import { BaseModel } from '@/database/core';
+import { DBModel } from '@/database/core/types/db';
 import { DB_Session, DB_SessionSchema } from '@/database/schemas/session';
 import { LobeAgentConfig } from '@/types/agent';
 import { LobeAgentSession, LobeSessions, SessionGroupKey } from '@/types/session';
@@ -79,7 +80,7 @@ class _SessionModel extends BaseModel {
     return this.table.clear();
   }
 
-  async findById(id: string) {
+  async findById(id: string): Promise<DBModel<DB_Session>> {
     return this.table.get(id);
   }
 
@@ -155,6 +156,15 @@ class _SessionModel extends BaseModel {
     console.timeEnd('queryByKeyword');
     return data;
   }
+
+  async duplicate(id: string, newTitle?: string) {
+    const session = await this.findById(id);
+    if (!session) return;
+
+    const newSession = merge(session, { meta: { title: newTitle } });
+
+    return this._add(newSession, uuid());
+  }
 }
 
 export const SessionModel = new _SessionModel();

package/src/database/models/topic.ts

@@ -1,4 +1,6 @@
 import { BaseModel } from '@/database/core';
+import { DBModel } from '@/database/core/types/db';
+import { MessageModel } from '@/database/models/message';
 import { DB_Topic, DB_TopicSchema } from '@/database/schemas/topic';
 import { ChatTopic } from '@/types/topic';
 import { nanoid } from '@/utils/uuid';
@@ -53,14 +55,14 @@ class _TopicModel extends BaseModel {
     // handle pageSize
     const pagedTopics = sortedTopics.slice(offset, offset + pageSize);
 
-    return pagedTopics.map((i) => ({ ...i, favorite: !!i.favorite }));
+    return pagedTopics.map((i) => this.mapToChatTopic(i));
   }
 
   async findBySessionId(sessionId: string) {
     return this.table.where({ sessionId }).toArray();
   }
 
-  async findById(id: string) {
+  async findById(id: string): Promise<DBModel<DB_Topic>> {
     return this.table.get(id);
   }
 
@@ -198,6 +200,36 @@ class _TopicModel extends BaseModel {
     console.timeEnd('queryTopicsByKeyword');
     return uniqueTopics.map((i) => ({ ...i, favorite: !!i.favorite }));
   }
+
+  async duplicateTopic(topicId: string, newTitle?: string) {
+    return this.db.transaction('rw', this.db.topics, this.db.messages, async () => {
+      // Step 1: get DB_Topic
+      const topic = await this.findById(topicId);
+
+      if (!topic) {
+        throw new Error(`Topic with id ${topicId} not found`);
+      }
+
+      // Step 3: 查询与 `topic` 关联的 `messages`
+      const originalMessages = await MessageModel.queryByTopicId(topicId);
+
+      const duplicateMessages = await MessageModel.duplicateMessages(originalMessages);
+
+      const { id } = await this.create({
+        ...this.mapToChatTopic(topic),
+        messages: duplicateMessages.map((m) => m.id),
+        sessionId: topic.sessionId!,
+        title: newTitle || topic.title,
+      });
+
+      return id;
+    });
+  }
+
+  private mapToChatTopic = (dbTopic: DBModel<DB_Topic>): ChatTopic => ({
+    ...dbTopic,
+    favorite: !!dbTopic.favorite,
+  });
 }
 
 export const TopicModel = new _TopicModel();

package/src/features/ChatInput/ActionBar/Clear.tsx

@@ -2,7 +2,6 @@ import { ActionIcon } from '@lobehub/ui';
 import { Popconfirm } from 'antd';
 import { Eraser } from 'lucide-react';
 import { memo, useCallback } from 'react';
-import { useHotkeys } from 'react-hotkeys-hook';
 import { useTranslation } from 'react-i18next';
 
 import HotKeys from '@/components/HotKeys';
@@ -21,11 +20,6 @@ const Clear = memo(() => {
     clearImageList();
   }, []);
 
-  useHotkeys(hotkeys, resetConversation, {
-    enableOnFormTags: true,
-    preventDefault: true,
-  });
-
   return (
     <Popconfirm
       cancelText={t('cancel', { ns: 'common' })}

package/src/features/Conversation/Actions/Assistant.tsx

@@ -1,21 +1,32 @@
 import { ActionIconGroup } from '@lobehub/ui';
 import { memo } from 'react';
 
-import { RenderAction } from '../components/ChatList';
 import { useChatListActionsBar } from '../hooks/useChatListActionsBar';
+import { RenderAction } from '../types';
 import { ErrorActionsBar } from './Error';
 import { useCustomActions } from './customAction';
 
-export const AssistantActionsBar: RenderAction = memo(({ text, id, onActionClick, error }) => {
-  const { regenerate, edit, copy, divider, del } = useChatListActionsBar(text);
+export const AssistantActionsBar: RenderAction = memo(({ id, onActionClick, error }) => {
+  const { regenerate, edit, delAndRegenerate, copy, divider, del } = useChatListActionsBar();
   const { translate, tts } = useCustomActions();
+
   if (id === 'default') return;
 
-  if (error) return <ErrorActionsBar onActionClick={onActionClick} text={text} />;
+  if (error) return <ErrorActionsBar onActionClick={onActionClick} />;
 
   return (
     <ActionIconGroup
-      dropdownMenu={[edit, copy, regenerate, divider, tts, translate, divider, del]}
+      dropdownMenu={[
+        edit,
+        copy,
+        regenerate,
+        divider,
+        tts,
+        translate,
+        divider,
+        delAndRegenerate,
+        del,
+      ]}
       items={[regenerate, copy]}
       onActionClick={onActionClick}
       type="ghost"

package/src/features/Conversation/Actions/Error.tsx

@@ -4,8 +4,8 @@ import { memo } from 'react';
 
 import { useChatListActionsBar } from '../hooks/useChatListActionsBar';
 
-export const ErrorActionsBar = memo<ActionsBarProps>(({ text, onActionClick }) => {
-  const { regenerate, del } = useChatListActionsBar(text);
+export const ErrorActionsBar = memo<ActionsBarProps>(({ onActionClick }) => {
+  const { regenerate, del } = useChatListActionsBar();
 
   return <ActionIconGroup items={[regenerate, del]} onActionClick={onActionClick} type="ghost" />;
 });

package/src/features/Conversation/Actions/Fallback.tsx

@@ -1,11 +1,12 @@
 import { ActionIconGroup } from '@lobehub/ui';
 import { memo } from 'react';
 
-import { RenderAction } from '../components/ChatList';
 import { useChatListActionsBar } from '../hooks/useChatListActionsBar';
+import { RenderAction } from '../types';
+
+export const DefaultActionsBar: RenderAction = memo(({ onActionClick }) => {
+  const { del } = useChatListActionsBar();
 
-export const DefaultActionsBar: RenderAction = memo(({ text, onActionClick }) => {
-  const { del } = useChatListActionsBar(text);
   return (
     <ActionIconGroup dropdownMenu={[del]} items={[]} onActionClick={onActionClick} type="ghost" />
   );

package/src/features/Conversation/Actions/Function.tsx

@@ -1,11 +1,11 @@
 import { ActionIconGroup } from '@lobehub/ui';
 import { memo } from 'react';
 
-import { RenderAction } from '../components/ChatList';
 import { useChatListActionsBar } from '../hooks/useChatListActionsBar';
+import { RenderAction } from '../types';
 
-export const FunctionActionsBar: RenderAction = memo(({ text, onActionClick }) => {
-  const { regenerate, divider, del } = useChatListActionsBar(text);
+export const FunctionActionsBar: RenderAction = memo(({ onActionClick }) => {
+  const { regenerate, divider, del } = useChatListActionsBar();
   return (
     <ActionIconGroup
       dropdownMenu={[regenerate, divider, del]}

package/src/features/Conversation/Actions/User.tsx

@@ -1,12 +1,12 @@
 import { ActionIconGroup } from '@lobehub/ui';
 import { memo } from 'react';
 
-import { RenderAction } from '../components/ChatList';
 import { useChatListActionsBar } from '../hooks/useChatListActionsBar';
+import { RenderAction } from '../types';
 import { useCustomActions } from './customAction';
 
-export const UserActionsBar: RenderAction = memo(({ text, onActionClick }) => {
-  const { regenerate, edit, copy, divider, del } = useChatListActionsBar(text);
+export const UserActionsBar: RenderAction = memo(({ onActionClick }) => {
+  const { regenerate, edit, copy, divider, del } = useChatListActionsBar();
   const { translate, tts } = useCustomActions();
 
   return (

package/src/features/Conversation/Actions/customAction.ts

@@ -1,5 +1,6 @@
 import { ActionIconGroupItems } from '@lobehub/ui/es/ActionIconGroup';
 import { LanguagesIcon, Play } from 'lucide-react';
+import { useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { localeOptions } from '@/locales/resources';
@@ -23,8 +24,5 @@ export const useCustomActions = () => {
     label: t('tts.action'),
   } as ActionIconGroupItems;
 
-  return {
-    translate,
-    tts,
-  };
+  return useMemo(() => ({ translate, tts }), []);
 };

package/src/features/Conversation/Actions/index.ts

@@ -1,67 +1,72 @@
+import { copyToClipboard } from '@lobehub/ui';
+import { App } from 'antd';
+import { useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
+
 import { useChatStore } from '@/store/chat';
+import { LLMRoleType } from '@/types/llm';
 
-import { ChatListProps } from '../components/ChatList';
+import { OnActionsClick, RenderAction } from '../types';
 import { AssistantActionsBar } from './Assistant';
 import { DefaultActionsBar } from './Fallback';
 import { FunctionActionsBar } from './Function';
 import { UserActionsBar } from './User';
 
-export const renderActions: ChatListProps['renderActions'] = {
+export const renderActions: Record<LLMRoleType, RenderAction> = {
   assistant: AssistantActionsBar,
   function: FunctionActionsBar,
   system: DefaultActionsBar,
   user: UserActionsBar,
 };
 
-interface ActionsClick {
-  onClick: () => void;
-  trigger: boolean;
-}
-
-export const useActionsClick = (): ChatListProps['onActionsClick'] => {
+export const useActionsClick = (): OnActionsClick => {
+  const { t } = useTranslation('common');
   const [deleteMessage, resendMessage, translateMessage, ttsMessage] = useChatStore((s) => [
     s.deleteMessage,
     s.resendMessage,
     s.translateMessage,
     s.ttsMessage,
   ]);
+  const { message } = App.useApp();
+
+  return useCallback<OnActionsClick>(async (action, { id, content, error }) => {
+    switch (action.key) {
+      case 'copy': {
+        await copyToClipboard(content);
+        message.success(t('copySuccess', { defaultValue: 'Copy Success' }));
+        break;
+      }
+
+      case 'del': {
+        deleteMessage(id);
+        break;
+      }
+
+      case 'regenerate': {
+        resendMessage(id);
+        // if this message is an error message, we need to delete it
+        if (error) deleteMessage(id);
+        break;
+      }
+
+      case 'delAndRegenerate': {
+        resendMessage(id);
+        deleteMessage(id);
+        break;
+      }
 
-  return (action, { id, error }) => {
-    const actionsClick: ActionsClick[] = [
-      {
-        onClick: () => {
-          deleteMessage(id);
-        },
-        trigger: action.key === 'del',
-      },
-      {
-        onClick: () => {
-          resendMessage(id);
-          // if this message is an error message, we need to delete it
-          if (error) deleteMessage(id);
-        },
-        trigger: action.key === 'regenerate',
-      },
-      {
-        onClick: () => {
-          ttsMessage(id);
-        },
-        trigger: action.key === 'tts',
-      },
-      {
-        onClick: () => {
-          /**
-           * @description Click the menu item with translate item, the result is:
-           * @key 'en-US'
-           * @keyPath ['en-US','translate']
-           */
-          const lang = action.keyPath[0];
-          translateMessage(id, lang);
-        },
-        trigger: action.keyPath.at(-1) === 'translate',
-      },
-    ];
+      case 'tts': {
+        ttsMessage(id);
+        break;
+      }
+    }
 
-    actionsClick.find((item) => item.trigger)?.onClick();
-  };
+    if (action.keyPath.at(-1) === 'translate') {
+      // click the menu item with translate item, the result is:
+      // key: 'en-US'
+      // keyPath: ['en-US','translate']
+      const lang = action.keyPath[0];
+      translateMessage(id, lang);
+    }
+  }, []);
 };

package/src/features/Conversation/Error/InvalidAccess.tsx

@@ -8,7 +8,7 @@ import { Flexbox } from 'react-layout-kit';
 import { useChatStore } from '@/store/chat';
 import { useGlobalStore } from '@/store/global';
 
-import { RenderErrorMessage } from '../components/ChatList';
+import { RenderErrorMessage } from '../types';
 import APIKeyForm from './ApiKeyForm';
 import { ErrorActionContainer, FormAction } from './style';
 

package/src/features/Conversation/Error/OpenAPIKey.tsx

@@ -1,6 +1,6 @@
 import { memo } from 'react';
 
-import { RenderErrorMessage } from '../components/ChatList';
+import { RenderErrorMessage } from '../types';
 import APIKeyForm from './ApiKeyForm';
 import { ErrorActionContainer } from './style';
 

package/src/features/Conversation/Error/OpenAiBizError.tsx

@@ -2,7 +2,7 @@ import { Highlighter } from '@lobehub/ui';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
-import { RenderErrorMessage } from '../components/ChatList';
+import { RenderErrorMessage } from '../types';
 import OpenAPIKey from './OpenAPIKey';
 
 interface OpenAIError {

package/src/features/Conversation/Error/Plugin/PluginError.tsx

@@ -2,7 +2,7 @@ import { Highlighter } from '@lobehub/ui';
 import { memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
-import { RenderErrorMessage } from '../../components/ChatList';
+import { RenderErrorMessage } from '../../types';
 
 interface OpenAIError {
   code: 'invalid_api_key' | string;

package/src/features/Conversation/Error/Plugin/PluginSettings.tsx

@@ -11,7 +11,7 @@ import { useChatStore } from '@/store/chat';
 import { pluginHelpers, useToolStore } from '@/store/tool';
 import { pluginSelectors } from '@/store/tool/selectors';
 
-import { RenderErrorMessage } from '../../components/ChatList';
+import { RenderErrorMessage } from '../../types';
 import { ErrorActionContainer, useStyles } from '../style';
 
 const PluginSettings: RenderErrorMessage['Render'] = memo(({ id, plugin }) => {

package/src/features/Conversation/Error/index.tsx

@@ -2,14 +2,14 @@ import { PluginErrorType } from '@lobehub/chat-plugin-sdk';
 
 import { ChatErrorType } from '@/types/fetch';
 
-import { ChatListProps } from '../components/ChatList';
+import { RenderErrorMessage } from '../types';
 import InvalidAccess from './InvalidAccess';
 import OpenAPIKey from './OpenAPIKey';
 import OpenAiBizError from './OpenAiBizError';
 import PluginError from './Plugin/PluginError';
 import PluginSettings from './Plugin/PluginSettings';
 
-export const renderErrorMessages: ChatListProps['renderErrorMessages'] = {
+export const renderErrorMessages: Record<string, RenderErrorMessage> = {
   [PluginErrorType.PluginMarketIndexNotFound]: {
     Render: PluginError,
   },

package/src/features/Conversation/Extras/Assistant.tsx

@@ -8,41 +8,44 @@ import { useSessionStore } from '@/store/session';
 import { agentSelectors } from '@/store/session/selectors';
 import { ChatMessage } from '@/types/message';
 
+import { RenderMessageExtra } from '../types';
 import ExtraContainer from './ExtraContainer';
 import TTS from './TTS';
 import Translate from './Translate';
 
-export const AssistantMessageExtra = memo<ChatMessage>(({ extra, id, content }) => {
-  const model = useSessionStore(agentSelectors.currentAgentModel);
-  const loading = useChatStore((s) => s.chatLoadingId === id);
+export const AssistantMessageExtra: RenderMessageExtra = memo<ChatMessage>(
+  ({ extra, id, content }) => {
+    const model = useSessionStore(agentSelectors.currentAgentModel);
+    const loading = useChatStore((s) => s.chatLoadingId === id);
 
-  const showModelTag = extra?.fromModel && model !== extra?.fromModel;
-  const showTranslate = !!extra?.translate;
-  const showTTS = !!extra?.tts;
+    const showModelTag = extra?.fromModel && model !== extra?.fromModel;
+    const showTranslate = !!extra?.translate;
+    const showTTS = !!extra?.tts;
 
-  const showExtra = showModelTag || showTranslate || showTTS;
+    const showExtra = showModelTag || showTranslate || showTTS;
 
-  if (!showExtra) return;
+    if (!showExtra) return;
 
-  return (
-    <Flexbox gap={8} style={{ marginTop: 8 }}>
-      {showModelTag && (
-        <div>
-          <Tag icon={<SiOpenai size={'1em'} />}>{extra?.fromModel as string}</Tag>
-        </div>
-      )}
-      <>
-        {extra?.tts && (
-          <ExtraContainer>
-            <TTS content={content} id={id} loading={loading} {...extra?.tts} />
-          </ExtraContainer>
+    return (
+      <Flexbox gap={8} style={{ marginTop: 8 }}>
+        {showModelTag && (
+          <div>
+            <Tag icon={<SiOpenai size={'1em'} />}>{extra?.fromModel as string}</Tag>
+          </div>
         )}
-        {extra?.translate && (
-          <ExtraContainer>
-            <Translate id={id} loading={loading} {...extra?.translate} />
-          </ExtraContainer>
-        )}
-      </>
-    </Flexbox>
-  );
-});
+        <>
+          {extra?.tts && (
+            <ExtraContainer>
+              <TTS content={content} id={id} loading={loading} {...extra?.tts} />
+            </ExtraContainer>
+          )}
+          {extra?.translate && (
+            <ExtraContainer>
+              <Translate id={id} loading={loading} {...extra?.translate} />
+            </ExtraContainer>
+          )}
+        </>
+      </Flexbox>
+    );
+  },
+);

package/src/features/Conversation/Extras/User.tsx

@@ -3,11 +3,12 @@ import { memo } from 'react';
 import { useChatStore } from '@/store/chat';
 import { ChatMessage } from '@/types/message';
 
+import { RenderMessageExtra } from '../types';
 import ExtraContainer from './ExtraContainer';
 import TTS from './TTS';
 import Translate from './Translate';
 
-export const UserMessageExtra = memo<ChatMessage>(({ extra, id, content }) => {
+export const UserMessageExtra: RenderMessageExtra = memo<ChatMessage>(({ extra, id, content }) => {
   const loading = useChatStore((s) => s.chatLoadingId === id);
 
   const showTranslate = !!extra?.translate;

package/src/features/Conversation/Extras/index.ts

@@ -1,8 +1,8 @@
-import { ChatListProps, RenderMessageExtra } from '../components/ChatList';
+import { RenderMessageExtra } from '../types';
 import { AssistantMessageExtra } from './Assistant';
 import { UserMessageExtra } from './User';
 
-export const renderMessagesExtra: ChatListProps['renderMessagesExtra'] = {
-  assistant: AssistantMessageExtra as unknown as RenderMessageExtra,
-  user: UserMessageExtra as unknown as RenderMessageExtra,
+export const renderMessagesExtra: Record<string, RenderMessageExtra> = {
+  assistant: AssistantMessageExtra,
+  user: UserMessageExtra,
 };

package/src/features/Conversation/Messages/index.ts

@@ -6,20 +6,20 @@ import { useSessionStore } from '@/store/session';
 import { sessionSelectors } from '@/store/session/selectors';
 import { pathString } from '@/utils/url';
 
-import { ChatListProps } from '../components/ChatList';
+import { OnAvatarsClick, RenderMessage } from '../types';
 import { AssistantMessage } from './Assistant';
 import { DefaultMessage } from './Default';
 import { FunctionMessage } from './Function';
 import { UserMessage } from './User';
 
-export const renderMessages: ChatListProps['renderMessages'] = {
+export const renderMessages: Record<string, RenderMessage> = {
   assistant: AssistantMessage,
   default: DefaultMessage,
   function: FunctionMessage,
   user: UserMessage,
 };
 
-export const useAvatarsClick = (): ChatListProps['onAvatarsClick'] => {
+export const useAvatarsClick = (): OnAvatarsClick => {
   const [isInbox] = useSessionStore((s) => [sessionSelectors.isInboxSession(s)]);
   const [toggleSystemRole] = useGlobalStore((s) => [s.toggleSystemRole]);
   const { mobile } = useResponsive();

package/src/features/Conversation/components/ChatItem/ActionsBar.tsx

@@ -0,0 +1,58 @@
+import { ActionEvent, ActionIconGroup, type ActionIconGroupProps } from '@lobehub/ui';
+import isEqual from 'fast-deep-equal';
+import { memo, useCallback } from 'react';
+
+import { useChatStore } from '@/store/chat';
+import { chatSelectors } from '@/store/chat/selectors';
+import { useSessionStore } from '@/store/session';
+import { agentSelectors } from '@/store/session/selectors';
+
+import { renderActions, useActionsClick } from '../../Actions';
+import { useChatListActionsBar } from '../../hooks/useChatListActionsBar';
+
+export type ActionsBarProps = ActionIconGroupProps;
+
+const ActionsBar = memo<ActionsBarProps>((props) => {
+  const { regenerate, edit, copy, divider, del } = useChatListActionsBar();
+  return (
+    <ActionIconGroup
+      dropdownMenu={[edit, copy, regenerate, divider, del]}
+      items={[regenerate, edit]}
+      type="ghost"
+      {...props}
+    />
+  );
+});
+
+interface ActionsProps {
+  index: number;
+  setEditing: (edit: boolean) => void;
+}
+const Actions = memo<ActionsProps>(({ index, setEditing }) => {
+  const meta = useSessionStore(agentSelectors.currentAgentMeta, isEqual);
+
+  const item = useChatStore(
+    (s) => chatSelectors.currentChatsWithGuideMessage(meta)(s)[index],
+    isEqual,
+  );
+  const onActionsClick = useActionsClick();
+
+  const handleActionClick = useCallback(
+    async (action: ActionEvent) => {
+      switch (action.key) {
+        case 'edit': {
+          setEditing(true);
+        }
+      }
+
+      onActionsClick(action, item);
+    },
+    [item],
+  );
+
+  const RenderFunction = renderActions[item?.role] ?? ActionsBar;
+
+  return <RenderFunction {...item} onActionClick={handleActionClick} />;
+});
+
+export default Actions;