45 lines
1.3 KiB
TypeScript
45 lines
1.3 KiB
TypeScript
import { cn } from "@/shared/ui/cn";
|
|
import { MessageResponse } from "@/shared/ai-elements/message";
|
|
import { defaultRehypePlugins } from "streamdown";
|
|
import { artifactLinkComponents, artifactLinksPlugin } from "./artifact-markdown";
|
|
import { ReadableMarkdownDiagram, ReadableMarkdownTable } from "@/shared/ai-elements/markdown-reading";
|
|
|
|
const responseRehypePlugins = [...Object.values(defaultRehypePlugins), artifactLinksPlugin];
|
|
const responseComponents = { ...artifactLinkComponents, table: ReadableMarkdownTable };
|
|
const responsePlugins = { renderers: [{ language: "mermaid", component: ReadableMarkdownDiagram }] };
|
|
|
|
type StreamingTokenResponseProps = {
|
|
content: string;
|
|
streaming: boolean;
|
|
streamDone?: boolean;
|
|
className?: string;
|
|
messageId?: string;
|
|
};
|
|
|
|
export function StreamingTokenResponse({
|
|
content,
|
|
streaming,
|
|
streamDone = !streaming,
|
|
className,
|
|
}: StreamingTokenResponseProps) {
|
|
if (!content) {
|
|
return null;
|
|
}
|
|
|
|
const isAnimating = streaming && !streamDone;
|
|
|
|
return (
|
|
<MessageResponse
|
|
className={cn("agent-streaming-response", className)}
|
|
isAnimating={isAnimating}
|
|
mode="streaming"
|
|
parseIncompleteMarkdown={true}
|
|
rehypePlugins={responseRehypePlugins}
|
|
components={responseComponents}
|
|
plugins={responsePlugins}
|
|
>
|
|
{content}
|
|
</MessageResponse>
|
|
);
|
|
}
|