@lobehub/lobehub 2.0.0-next.41 → 2.0.0-next.42

package/src/features/ChatItem/components/Title.tsx

@@ -1,5 +1,5 @@
 import dayjs from 'dayjs';
-import { memo } from 'react';
+import { CSSProperties, memo } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
 import { useStyles } from '../style';
@@ -10,6 +10,7 @@ export interface TitleProps {
   className?: string;
   placement?: ChatItemProps['placement'];
   showTitle?: ChatItemProps['showTitle'];
+  style?: CSSProperties;
   time?: ChatItemProps['time'];
   titleAddon?: ChatItemProps['titleAddon'];
 }
@@ -27,21 +28,24 @@ const formatTime = (time: number): string => {
   }
 };
 
-const Title = memo<TitleProps>(({ showTitle, placement, time, avatar, titleAddon, className }) => {
-  const { styles, cx } = useStyles({ placement, showTitle, time });
+const Title = memo<TitleProps>(
+  ({ showTitle, placement, time, avatar, titleAddon, className, style }) => {
+    const { styles, cx } = useStyles({ placement, showTitle, time });
 
-  return (
-    <Flexbox
-      align={'center'}
-      className={cx(styles.name, className)}
-      direction={placement === 'left' ? 'horizontal' : 'horizontal-reverse'}
-      gap={4}
-    >
-      {showTitle ? avatar.title || 'untitled' : undefined}
-      {showTitle ? titleAddon : undefined}
-      {time && <time>{formatTime(time)}</time>}
-    </Flexbox>
-  );
-});
+    return (
+      <Flexbox
+        align={'center'}
+        className={cx(styles.name, className)}
+        direction={placement === 'left' ? 'horizontal' : 'horizontal-reverse'}
+        gap={4}
+        style={style}
+      >
+        {showTitle ? avatar.title || 'untitled' : undefined}
+        {showTitle ? titleAddon : undefined}
+        {time && <time>{formatTime(time)}</time>}
+      </Flexbox>
+    );
+  },
+);
 
 export default Title;

package/src/features/Conversation/Messages/Assistant/index.tsx

@@ -4,6 +4,7 @@ import { LOADING_FLAT } from '@lobechat/const';
 import { UIChatMessage } from '@lobechat/types';
 import { Tag } from '@lobehub/ui';
 import { useResponsive } from 'antd-style';
+import isEqual from 'fast-deep-equal';
 import { ReactNode, memo, useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
@@ -213,12 +214,12 @@ const AssistantMessage = memo<AssistantMessageProps>((props) => {
           onClick={onAvatarClick}
           placement={placement}
           size={MOBILE_AVATAR_SIZE}
-          style={{ marginTop: 6 }}
         />
         <Title
           avatar={avatar}
           placement={placement}
           showTitle
+          style={{ marginBlockEnd: 0 }}
           time={createdAt}
           titleAddon={dmIndicator}
         />
@@ -274,6 +275,6 @@ const AssistantMessage = memo<AssistantMessageProps>((props) => {
       {mobile && <BorderSpacing borderSpacing={MOBILE_AVATAR_SIZE} />}
     </Flexbox>
   );
-});
+}, isEqual);
 
 export default AssistantMessage;

package/src/features/Conversation/Messages/Group/index.tsx

@@ -2,6 +2,7 @@
 
 import { UIChatMessage } from '@lobechat/types';
 import { useResponsive } from 'antd-style';
+import isEqual from 'fast-deep-equal';
 import { memo, useCallback } from 'react';
 import { Flexbox } from 'react-layout-kit';
 
@@ -49,6 +50,7 @@ const GroupMessage = memo<GroupMessageProps>((props) => {
     provider,
   } = props;
   const avatar = meta;
+  console.log('render');
   const { mobile } = useResponsive();
   const placement = 'left';
   const type = useAgentStore(agentChatConfigSelectors.displayMode);
@@ -96,9 +98,14 @@ const GroupMessage = memo<GroupMessageProps>((props) => {
           onClick={onAvatarClick}
           placement={placement}
           size={MOBILE_AVATAR_SIZE}
-          style={{ marginTop: 6 }}
         />
-        <Title avatar={avatar} placement={placement} showTitle time={createdAt} />
+        <Title
+          avatar={avatar}
+          placement={placement}
+          showTitle
+          style={{ marginBlockEnd: 0 }}
+          time={createdAt}
+        />
       </Flexbox>
       {isEditing && contentId ? (
         <EditState content={lastAssistantMsg?.content} id={contentId} />
@@ -141,6 +148,6 @@ const GroupMessage = memo<GroupMessageProps>((props) => {
       {mobile && <BorderSpacing borderSpacing={MOBILE_AVATAR_SIZE} />}
     </Flexbox>
   );
-});
+}, isEqual);
 
 export default GroupMessage;

package/src/store/chat/slices/aiChat/actions/conversationLifecycle.ts

@@ -166,7 +166,11 @@ export const conversationLifecycle: StateCreator<
         topicId = data.topicId;
       }
 
-      get().replaceMessages(data.messages, { sessionId: activeId, topicId: topicId });
+      get().replaceMessages(data.messages, {
+        sessionId: activeId,
+        topicId: topicId,
+        action: 'sendMessage/serverResponse',
+      });
 
       if (data.isCreateNewTopic && data.topicId) {
         await get().switchTopic(data.topicId, true);
@@ -250,7 +254,9 @@ export const conversationLifecycle: StateCreator<
         .map((f) => f?.id)
         .filter(Boolean) as string[];
 
-      await getAgentStoreState().addFilesToAgent(userFiles, false);
+      if (userFiles.length > 0) {
+        await getAgentStoreState().addFilesToAgent(userFiles, false);
+      }
     } catch (e) {
       console.error(e);
     } finally {

package/src/store/chat/slices/aiChat/actions/streamingExecutor.ts

@@ -521,10 +521,7 @@ export const streamingExecutor: StateCreator<
       // Handle completion and error events
       for (const event of result.events) {
         if (event.type === 'done') {
-          log('[internal_execAgentRuntime] Received done event, syncing to database');
-          // Sync final state to database
-          const finalMessages = get().messagesMap[messageKey] || [];
-          get().replaceMessages(finalMessages);
+          log('[internal_execAgentRuntime] Received done event');
         }
 
         if (event.type === 'error') {

package/src/store/chat/slices/message/actions/optimisticUpdate.ts

@@ -195,7 +195,7 @@ export const messageOptimisticUpdate: StateCreator<
     );
 
     if (result && result.success && result.messages) {
-      replaceMessages(result.messages);
+      replaceMessages(result.messages, { action: 'optimisticUpdateMessageContent' });
     } else {
       await refreshMessages();
     }