Chat Sources

import {
  ChatMessage,
  ChatMessageAvatar,
  ChatMessageContent,
} from "@/components/ui/chat-message";
import {
  ChatSource,
  ChatSources,
  ChatSourcesContent,
  ChatSourcesTrigger,
} from "@/components/ui/chat-sources";

const sources = [
  {
    title: "Next.js Cache Components",
    href: "https://nextjs.org/docs/app/api-reference/directives/use-cache",
  },
  {
    title: "React Server Components",
    href: "https://react.dev/reference/rsc/server-components",
  },
  { title: "Base UI", href: "https://base-ui.com/" },
];

export default function Particle() {
  return (
    <div className="w-full max-w-2xl p-4">
      <ChatMessage from="assistant">
        <ChatMessageAvatar fallback="J" />
        <ChatMessageContent>
          <p>
            Next.js 16 поддерживает Cache Components — мощную замену старому
            кешированию. RSC при этом остаются базой для рендера.
          </p>
          <ChatSources defaultOpen>
            <ChatSourcesTrigger count={sources.length} />
            <ChatSourcesContent>
              {sources.map((s) => (
                <ChatSource href={s.href} key={s.href} title={s.title} />
              ))}
            </ChatSourcesContent>
          </ChatSources>
        </ChatMessageContent>
      </ChatMessage>
    </div>
  );
}