- Replace Zustand activeView with React Router (NavLink + Routes) - White/light modern theme with indigo accents - Sidebar with Chinese labels under icons - ConfigForm with individual form fields (no JSON textareas) - Account switching with context injection into chat - Fix duplicate conversation creation with useRef guard - Asset gallery: smaller 6-column grid with date labels - All components updated to light color scheme Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
33 lines
1021 B
TypeScript
33 lines
1021 B
TypeScript
import { cn } from '@/lib/utils';
|
|
import { renderMarkdown } from '@/lib/markdown';
|
|
import type { Message } from '@/types';
|
|
|
|
export function ChatMessage({ message }: { message: Message }) {
|
|
const isUser = message.role === 'user';
|
|
const isEmpty = !message.content;
|
|
|
|
return (
|
|
<div className={cn('mb-4 flex', isUser ? 'justify-end' : 'justify-start')}>
|
|
<div
|
|
className={cn(
|
|
'max-w-[80%] rounded-xl px-4 py-2.5',
|
|
isUser
|
|
? 'bg-indigo-600 text-white'
|
|
: 'bg-white text-zinc-700 border border-zinc-200 shadow-sm'
|
|
)}
|
|
>
|
|
{isEmpty ? (
|
|
<span className="text-zinc-400 italic text-xs">...</span>
|
|
) : isUser ? (
|
|
<p className="text-sm leading-relaxed whitespace-pre-wrap">{message.content}</p>
|
|
) : (
|
|
<div
|
|
className="markdown-body text-sm leading-relaxed"
|
|
dangerouslySetInnerHTML={{ __html: renderMarkdown(message.content) }}
|
|
/>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|