pdf ui overhaul

package.json

@@ -44,13 +44,15 @@
     "lucide-react": "^0.563.0",
     "next": "^15.2.3",
     "next-themes": "^0.4.6",
+    "pdfjs-dist": "5.4.296",
     "postgres": "^3.4.4",
     "radix-ui": "^1.4.3",
     "react": "^19.0.0",
     "react-day-picker": "^9.13.1",
     "react-dom": "^19.0.0",
     "react-hook-form": "^7.71.1",
     "react-markdown": "^10.1.0",
+    "react-pdf": "^10.3.0",
     "react-resizable-panels": "^4.6.2",
     "react-shiki": "^0.9.1",
     "rehype-katex": "^7.0.1",

src/components/chat/chat-interface.tsx

@@ -17,9 +17,16 @@ import { api } from "~/trpc/react";
 interface ChatInterfaceProps {
     noteId: string;
     textContent?: string;
+    initialMessage?: string;
+    onMessageSent?: () => void;
 }
 
-export function ChatInterface({ noteId, textContent }: ChatInterfaceProps) {
+export function ChatInterface({
+    noteId,
+    textContent,
+    initialMessage,
+    onMessageSent,
+}: ChatInterfaceProps) {
     const { data: history } = api.message.listByNoteId.useQuery({ noteId });
     const utils = api.useUtils();
 
@@ -59,6 +66,33 @@ export function ChatInterface({ noteId, textContent }: ChatInterfaceProps) {
         }
     }, [history, setMessages, messages.length]);
 
+    // Handle initial message (e.g. from "Explain" button)
+    useEffect(() => {
+        if (initialMessage && !isLoading) {
+            void (async () => {
+                try {
+                    // Send message immediately
+                    await sendMessage({
+                        parts: [
+                            {
+                                type: "text",
+                                text: `Explain this: "${initialMessage}"`,
+                            },
+                        ],
+                    });
+
+                    // Notify parent that message was sent (to clear pending state)
+                    onMessageSent?.();
+
+                    // Refresh stats after sending
+                    await utils.stats.getMyStats.invalidate();
+                } catch (error) {
+                    console.error("Error sending initial message:", error);
+                }
+            })();
+        }
+    }, [initialMessage, isLoading, sendMessage, onMessageSent, utils]);
+
     // Scroll Logic
     const scrollToBottom = () => {
         messagesEndRef.current?.scrollIntoView({ behavior: "smooth" });