Fix custom artifact cards not appearing after page refresh

Add handlers for tool-quizMaster and tool-planner in message.tsx
so custom artifact cards render in the chat thread after page
refresh. Also add preview content for flashcard and study-plan
kinds in DocumentContent.

The bug was that agent tools were not being rendered - only the
built-in createDocument/updateDocument tools had rendering code.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>

Author: NiallJoeMaher

components/document-preview.tsx

@@ -275,6 +275,22 @@ const DocumentContent = ({ document }: { document: Document }) => {
             <SpreadsheetEditor {...commonProps} />
           </div>
         </div>
+      ) : document.kind === "flashcard" ? (
+        <div className="flex h-full flex-col items-center justify-center p-8 text-center">
+          <div className="mb-2 text-2xl">📝</div>
+          <p className="font-medium text-foreground">Interactive Quiz</p>
+          <p className="mt-1 text-muted-foreground text-sm">
+            Click to start the flashcard quiz
+          </p>
+        </div>
+      ) : document.kind === "study-plan" ? (
+        <div className="flex h-full flex-col items-center justify-center p-8 text-center">
+          <div className="mb-2 text-2xl">📚</div>
+          <p className="font-medium text-foreground">Study Plan</p>
+          <p className="mt-1 text-muted-foreground text-sm">
+            Click to view your personalized study plan
+          </p>
+        </div>
       ) : null}
     </div>
   );

components/message.tsx

@@ -6,6 +6,7 @@ import { memo, useState } from "react";
 import type { Vote } from "@/lib/db/types";
 import type { ChatMessage } from "@/lib/types";
 import { cn, sanitizeText } from "@/lib/utils";
+import type { ArtifactKind } from "./artifact";
 import { useDataStream } from "./data-stream-provider";
 import { DocumentToolResult } from "./document";
 import { DocumentPreview } from "./document-preview";
@@ -267,6 +268,53 @@ const PurePreviewMessage = ({
               );
             }
 
+            // Custom agent tools that create artifacts
+            if (type === "tool-quizMaster") {
+              const { toolCallId, state, output } = part;
+
+              if (
+                state === "output-available" &&
+                output?.success &&
+                output?.data?.documentId
+              ) {
+                return (
+                  <DocumentPreview
+                    isReadonly={isReadonly}
+                    key={toolCallId}
+                    result={{
+                      id: output.data.documentId,
+                      title: `Quiz: ${output.data.topic}`,
+                      kind: "flashcard" as ArtifactKind,
+                    }}
+                  />
+                );
+              }
+              return null;
+            }
+
+            if (type === "tool-planner") {
+              const { toolCallId, state, output } = part;
+
+              if (
+                state === "output-available" &&
+                output?.success &&
+                output?.data?.documentId
+              ) {
+                return (
+                  <DocumentPreview
+                    isReadonly={isReadonly}
+                    key={toolCallId}
+                    result={{
+                      id: output.data.documentId,
+                      title: `Study Plan: ${output.data.topic}`,
+                      kind: "study-plan" as ArtifactKind,
+                    }}
+                  />
+                );
+              }
+              return null;
+            }
+
             return null;
           })}