nexus/ui/src/components/ChatMessage.tsx
Nexus Dev ea0b12d87b feat(21-04): create ChatPanelContext, ChatInput, and ChatMessage components
- ChatPanelContext with localStorage persistence (nexus:chat-panel-open)
- ChatInput with Enter/Shift+Enter/Escape keyboard shortcuts and auto-resize
- ChatMessage renders user bubbles (bg-secondary) and assistant markdown via ChatMarkdownMessage
- ChatInput.test.tsx with 6 passing tests (keyboard shortcuts, max-height, submit state)
2026-04-02 15:08:50 +00:00

29 lines
685 B
TypeScript

import { ChatMarkdownMessage } from "./ChatMarkdownMessage";
import { cn } from "../lib/utils";
interface ChatMessageProps {
role: "user" | "assistant" | "system";
content: string;
}
export function ChatMessage({ role, content }: ChatMessageProps) {
if (role === "user") {
return (
<div className="flex justify-end">
<div
className={cn(
"max-w-[85%] rounded-lg bg-secondary px-3 py-2 text-secondary-foreground text-sm",
)}
>
{content}
</div>
</div>
);
}
// assistant or system
return (
<div className="max-w-full">
<ChatMarkdownMessage content={content} />
</div>
);
}