mirror of
https://github.com/supermemoryai/supermemory.git
synced 2026-05-17 21:11:04 +00:00
42 lines
1 KiB
TypeScript
42 lines
1 KiB
TypeScript
"use client"
|
|
|
|
import { memo } from "react"
|
|
import { Copy, Check } from "lucide-react"
|
|
import type { UIMessage } from "@ai-sdk/react"
|
|
|
|
interface UserMessageProps {
|
|
message: UIMessage
|
|
copiedMessageId: string | null
|
|
onCopy: (messageId: string, text: string) => void
|
|
}
|
|
|
|
export const UserMessage = memo(function UserMessage({
|
|
message,
|
|
copiedMessageId,
|
|
onCopy,
|
|
}: UserMessageProps) {
|
|
const text = message.parts
|
|
.filter((part) => part.type === "text")
|
|
.map((part) => part.text)
|
|
.join(" ")
|
|
|
|
return (
|
|
<div className="flex flex-col items-end w-full">
|
|
<div className="bg-[#1B1F24] rounded-[12px] p-3 px-[14px] max-w-[80%]">
|
|
<p className="text-sm text-white">{text}</p>
|
|
</div>
|
|
<button
|
|
type="button"
|
|
onClick={() => onCopy(message.id, text)}
|
|
className="p-1.5 hover:bg-[#293952]/40 rounded transition-colors mt-1"
|
|
title="Copy message"
|
|
>
|
|
{copiedMessageId === message.id ? (
|
|
<Check className="size-3.5 text-green-400" />
|
|
) : (
|
|
<Copy className="size-3.5 text-white/50" />
|
|
)}
|
|
</button>
|
|
</div>
|
|
)
|
|
})
|