@@ -6,7 +6,9 @@ import { AdminModelDto } from '@/types/adminApis';
66import { ChatRole , IChat , Message , ResponseContent } from '@/types/chat' ;
77import { IChatMessage , ReactionMessageType } from '@/types/chatMessage' ;
88
9+ import ChatMessageHeader from './ChatMessageHeader' ;
910import ResponseMessage from './ResponseMessage' ;
11+ import ResponseMessageActions from './ResponseMessageActions' ;
1012import UserMessage from './UserMessage' ;
1113
1214import { cn } from '@/lib/utils' ;
@@ -29,6 +31,7 @@ export interface Props {
2931 ) => void ;
3032 onEditUserMessage ?: ( messageId : string , content : ResponseContent ) => void ;
3133 onDeleteMessage ?: ( messageId : string ) => void ;
34+ onChangeDisplayType ?: ( messageId : string ) => void ;
3235}
3336
3437export const ChatMessage : FC < Props > = memo (
@@ -46,6 +49,7 @@ export const ChatMessage: FC<Props> = memo(
4649 onEditResponseMessage,
4750 onEditUserMessage,
4851 onDeleteMessage,
52+ onChangeDisplayType,
4953 } ) => {
5054 const isMultiSpan = hasMultipleSpans ( selectedMessages ) ;
5155 return (
@@ -78,6 +82,7 @@ export const ChatMessage: FC<Props> = memo(
7882 ) }
7983 >
8084 < UserMessage
85+ readonly = { readonly }
8186 selectedChat = { selectedChat }
8287 message = { message }
8388 onChangeMessage = { onChangeChatLeafMessageId }
@@ -88,38 +93,55 @@ export const ChatMessage: FC<Props> = memo(
8893 </ div >
8994 ) }
9095 { message . role === ChatRole . Assistant && (
91- < div
92- onClick = { ( ) =>
93- isMultiSpan &&
94- onChangeChatLeafMessageId &&
95- onChangeChatLeafMessageId ( message . id )
96- }
97- key = { 'response-group-message-' + index }
98- className = { cn (
99- 'border-[1px] border-background rounded-md flex w-full bg-card mb-4' ,
100- isMultiSpan &&
101- message . isActive &&
102- 'border-primary/50 border-gray-300' ,
103- isMultiSpan && 'p-1 md:p-2' ,
104- ! isMultiSpan && 'border-none' ,
105- ) }
106- >
107- < div className = "prose dark:prose-invert rounded-r-md flex-1 overflow-auto text-base py-2 px-3" >
108- < ResponseMessage
109- key = { 'response-message-' + index }
110- chatStatus = { selectedChat . status }
111- message = { message }
112- readonly = { readonly }
113- models = { models }
114- onRegenerate = { onRegenerate }
115- onReactionMessage = { onReactionMessage }
116- onEditResponseMessage = { onEditResponseMessage }
117- onChangeChatLeafMessageId = {
118- onChangeChatLeafMessageId
119- }
120- onDeleteMessage = { onDeleteMessage }
121- / >
96+ < div className = "group/item" >
97+ < ChatMessageHeader
98+ readonly = { readonly }
99+ onChangeDisplayType = { onChangeDisplayType }
100+ message = { message }
101+ />
102+ < div
103+ onClick = { ( ) =>
104+ isMultiSpan &&
105+ onChangeChatLeafMessageId &&
106+ onChangeChatLeafMessageId ( message . id )
107+ }
108+ key = { 'response-group-message-' + index }
109+ className = { cn (
110+ 'border-[1px] border-background rounded-md flex w-full bg-card mb-1' ,
111+ isMultiSpan &&
112+ message . isActive &&
113+ 'border-primary/50 border-gray-300 dark:border-gray-600' ,
114+ isMultiSpan && 'p-1 md:p-2' ,
115+ ! isMultiSpan && 'border-none' ,
116+ ) }
117+ >
118+ < div className = "prose dark:prose-invert rounded-r-md flex-1 overflow-auto text-base py-1 px-2" >
119+ < ResponseMessage
120+ key = { 'response-message-' + index }
121+ chatStatus = { selectedChat . status }
122+ message = { message }
123+ readonly = { readonly }
124+ onEditResponseMessage = { onEditResponseMessage }
125+ />
126+ </ div >
122127 </ div >
128+ < ResponseMessageActions
129+ key = { 'response-actions-' + message . id }
130+ readonly = { readonly }
131+ models = { models }
132+ chatStatus = { selectedChat . status }
133+ message = { message }
134+ onChangeMessage = { onChangeChatLeafMessageId }
135+ onReactionMessage = { onReactionMessage }
136+ onRegenerate = { (
137+ messageId : string ,
138+ modelId : number ,
139+ ) => {
140+ onRegenerate &&
141+ onRegenerate ( message . spanId ! , messageId , modelId ) ;
142+ } }
143+ onDeleteMessage = { onDeleteMessage }
144+ />
123145 </ div >
124146 ) }
125147 </ >
0 commit comments