File size: 1,454 Bytes
1f21206 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 | import type { UIAttachment } from '../../types/chat'
import { AttachmentGallery } from './AttachmentGallery'
import { MessageActionBar, type MessageBranchAction } from './MessageActionBar'
type Props = {
content: string
attachments?: UIAttachment[]
branchAction?: MessageBranchAction
}
export function UserMessage({ content, attachments, branchAction }: Props) {
const hasText = content.trim().length > 0
return (
<div className="group mb-5 flex justify-end">
<div
data-message-shell="user"
className="flex min-w-0 w-full max-w-[82%] flex-col items-end gap-2 sm:max-w-[78%] lg:max-w-[72%]"
>
{attachments && attachments.length > 0 && (
<AttachmentGallery attachments={attachments} variant="message" />
)}
{hasText && (
<div
className="min-w-0 max-w-full bg-[var(--color-surface-user-msg)] px-4 py-3 text-sm leading-relaxed text-[var(--color-text-primary)] whitespace-pre-wrap break-words"
style={{
borderRadius: '18px 4px 18px 18px',
overflowWrap: 'anywhere',
wordBreak: 'break-word',
}}
>
{content}
</div>
)}
{hasText && (
<MessageActionBar
copyText={content}
copyLabel="Copy prompt"
branchAction={branchAction}
align="end"
/>
)}
</div>
</div>
)
}
|