48 lines
1.6 KiB
TypeScript
48 lines
1.6 KiB
TypeScript
"use client"
|
|
|
|
import { memo, useMemo } from "react"
|
|
import { useTranslations } from "next-intl"
|
|
import type { LiveMessage } from "@/contexts/acp-connections-context"
|
|
import { ContentPartsRenderer } from "@/components/message/content-parts-renderer"
|
|
import { adaptLiveMessageFromAcp } from "@/lib/adapters/ai-elements-adapter"
|
|
import { Message, MessageContent } from "@/components/ai-elements/message"
|
|
|
|
interface LiveMessageBlockProps {
|
|
message: LiveMessage
|
|
}
|
|
|
|
export const LiveMessageBlock = memo(function LiveMessageBlock({
|
|
message,
|
|
}: LiveMessageBlockProps) {
|
|
const t = useTranslations("Folder.chat.liveMessageBlock")
|
|
const sharedT = useTranslations("Folder.chat.shared")
|
|
const hasContent = message.content.length > 0
|
|
const adapted = useMemo(
|
|
() =>
|
|
adaptLiveMessageFromAcp(message, {
|
|
toolCallFailedText: sharedT("toolCallFailed"),
|
|
planUpdatedText: sharedT("planUpdated"),
|
|
}),
|
|
[message, sharedT]
|
|
)
|
|
|
|
return (
|
|
<Message from="assistant">
|
|
<MessageContent>
|
|
{hasContent ? (
|
|
<ContentPartsRenderer parts={adapted.content} role="assistant" />
|
|
) : (
|
|
<div
|
|
className="flex items-center gap-1.5 text-muted-foreground py-1"
|
|
aria-label={t("assistantThinkingAria")}
|
|
>
|
|
<span className="h-2 w-2 rounded-full bg-primary animate-bounce [animation-delay:-0.3s]" />
|
|
<span className="h-2 w-2 rounded-full bg-primary animate-bounce [animation-delay:-0.15s]" />
|
|
<span className="h-2 w-2 rounded-full bg-primary animate-bounce" />
|
|
</div>
|
|
)}
|
|
</MessageContent>
|
|
</Message>
|
|
)
|
|
})
|