Update web/src/App.tsx

web/src/App.tsx

@@ -14,7 +14,7 @@ import { toast } from "sonner";
 import { LeftSidebar } from "./components/sidebar/LeftSidebar";
 
 // backend API bindings
-import { apiChat, apiUpload, apiMemoryline } from "./lib/api";
+import { apiChat, apiUpload, apiMemoryline, apiQuizStart } from "./lib/api";
 
 // NEW: review-star logic
 import {
@@ -645,35 +645,70 @@ function App() {
     else if (chatMode === "review") setReviewMessages((prev) => [...prev, userMessage]);
     else setQuizMessages((prev) => [...prev, userMessage]);
 
+
     if (chatMode === "quiz") {
-      if (quizState.waitingForAnswer) {
-        const isCorrect = Math.random() > 0.3;
-        setIsTyping(true);
+      // Quiz mode: always route to backend (grading + next question handled server-side)
+      setIsTyping(true);
+    
+      try {
+        const docType = getCurrentDocTypeForChat();
+    
+        const r = await apiChat({
+          user_id: user.email,
+          message: content,
+          learning_mode: "quiz",
+          language_preference: mapLanguagePref(language),
+          doc_type: docType,
+        });
+    
+        const refs = (r.refs || [])
+          .map((x) => {
+            const a = x?.source_file ? String(x.source_file) : "";
+            const b = x?.section ? String(x.section) : "";
+            const s = `${a}${a && b ? " — " : ""}${b}`.trim();
+            return s || null;
+          })
+          .filter(Boolean) as string[];
+    
+        const assistantMessage: Message = {
+          id: (Date.now() + 1).toString(),
+          role: "assistant",
+          content: r.reply || "",
+          timestamp: new Date(),
+          references: refs.length ? refs : undefined,
+          sender: spaceType === "group" ? groupMembers.find((m) => m.isAI) : undefined,
+          // Quiz flow is driven by backend, so don't force a local "Next" unless you want it
+          showNextButton: false,
+        };
 
+        setIsTyping(false);
+    
         setTimeout(() => {
-          const feedback = isCorrect ? "✅ Correct! Great job!" : "❌ Not quite right, but good effort!";
-          const explanation =
-            "Here's the explanation: The correct answer demonstrates understanding of the key concepts. Let me break it down for you...";
-
-          const assistantMessage: Message = {
-            id: (Date.now() + 1).toString(),
-            role: "assistant",
-            content: `${feedback}\n\n${explanation}`,
-            timestamp: new Date(),
-            sender: spaceType === "group" ? groupMembers.find((m) => m.isAI) : undefined,
-            showNextButton: true,
-          };
-
-          setIsTyping(false);
-          setTimeout(() => {
-            setQuizMessages((prev) => [...prev, assistantMessage]);
-            setQuizState((prev) => ({ ...prev, waitingForAnswer: false, showNextButton: true }));
-          }, 50);
-        }, 2000);
+          setQuizMessages((prev) => [...prev, assistantMessage]);
+          // In quiz, backend typically asks the next prompt; keep waitingForAnswer true
+          setQuizState((prev) => ({ ...prev, waitingForAnswer: true, showNextButton: false }));
+        }, 50);
+      } catch (e: any) {
+        setIsTyping(false);
+        toast.error(e?.message || "Quiz failed");
+    
+        const assistantMessage: Message = {
+          id: (Date.now() + 1).toString(),
+          role: "assistant",
+          content: "Sorry — quiz request failed. Please try again.",
+          timestamp: new Date(),
+          sender: spaceType === "group" ? groupMembers.find((m) => m.isAI) : undefined,
+        };
+    
+        setTimeout(() => {
+          setQuizMessages((prev) => [...prev, assistantMessage]);
+        }, 50);
       }
+    
       return;
     }
 
+
     setIsTyping(true);
     try {
       const docType = getCurrentDocTypeForChat();
@@ -736,27 +771,60 @@ function App() {
     }
   };
 
-  const handleNextQuestion = () => {
+  const handleNextQuestion = async () => {
+    if (!user) return;
+  
+    const prompt = "Please give me another question of the same quiz style.";
+    const sender: GroupMember = {
+      id: user.email,
+      name: user.name,
+      email: user.email,
+      avatar: `https://api.dicebear.com/7.x/avataaars/svg?seed=${encodeURIComponent(user.email)}`,
+    };
+  
+    // record the "next" action as a user turn (keeps server history consistent)
+    const userMessage: Message = {
+      id: Date.now().toString(),
+      role: "user",
+      content: prompt,
+      timestamp: new Date(),
+      sender,
+    };
+  
+    setQuizMessages((prev) => [...prev, userMessage]);
     setIsTyping(true);
-    const question = generateQuizQuestion();
-    let questionText = question.question;
-
-    if (question.type === "multiple-choice") {
-      questionText += "\n\n" + (question.options || []).join("\n");
-    }
-
-    setTimeout(() => {
+  
+    try {
+      const docType = getCurrentDocTypeForChat();
+      const r = await apiChat({
+        user_id: user.email,
+        message: prompt,
+        learning_mode: "quiz",
+        language_preference: mapLanguagePref(language),
+        doc_type: docType,
+      });
+  
+      const refs = (r.refs || [])
+        .map((x) => {
+          const a = x?.source_file ? String(x.source_file) : "";
+          const b = x?.section ? String(x.section) : "";
+          const s = `${a}${a && b ? " — " : ""}${b}`.trim();
+          return s || null;
+        })
+        .filter(Boolean) as string[];
+  
       const assistantMessage: Message = {
-        id: Date.now().toString(),
+        id: (Date.now() + 1).toString(),
         role: "assistant",
-        content: questionText,
+        content: r.reply || "",
         timestamp: new Date(),
+        references: refs.length ? refs : undefined,
         sender: spaceType === "group" ? groupMembers.find((m) => m.isAI) : undefined,
-        questionData: question,
+        showNextButton: false,
       };
-
+  
       setIsTyping(false);
-
+  
       setTimeout(() => {
         setQuizMessages((prev) => [...prev, assistantMessage]);
         setQuizState((prev) => ({
@@ -766,10 +834,78 @@ function App() {
           showNextButton: false,
         }));
       }, 50);
-    }, 2000);
+    } catch (e: any) {
+      setIsTyping(false);
+      toast.error(e?.message || "Quiz failed");
+  
+      const assistantMessage: Message = {
+        id: (Date.now() + 1).toString(),
+        role: "assistant",
+        content: "Sorry — quiz request failed. Please try again.",
+        timestamp: new Date(),
+        sender: spaceType === "group" ? groupMembers.find((m) => m.isAI) : undefined,
+      };
+  
+      setTimeout(() => setQuizMessages((prev) => [...prev, assistantMessage]), 50);
+    }
+  };
+
+  const handleStartQuiz = async () => {
+    if (!user) return;
+  
+    setIsTyping(true);
+    try {
+      const docType = getCurrentDocTypeForChat();
+  
+      const r = await apiQuizStart({
+        user_id: user.email,
+        language_preference: mapLanguagePref(language),
+        doc_type: docType,
+        learning_mode: "quiz",
+      });
+  
+      const refs = (r.refs || [])
+        .map((x) => {
+          const a = x?.source_file ? String(x.source_file) : "";
+          const b = x?.section ? String(x.section) : "";
+          const s = `${a}${a && b ? " — " : ""}${b}`.trim();
+          return s || null;
+        })
+        .filter(Boolean) as string[];
+  
+      const assistantMessage: Message = {
+        id: Date.now().toString(),
+        role: "assistant",
+        content: r.reply || "",
+        timestamp: new Date(),
+        references: refs.length ? refs : undefined,
+        sender: spaceType === "group" ? groupMembers.find((m) => m.isAI) : undefined,
+        showNextButton: false,
+      };
+  
+      setIsTyping(false);
+  
+      setTimeout(() => {
+        setQuizMessages((prev) => [...prev, assistantMessage]);
+        // backend will ask: "choose 1 or 2" first; user should answer next
+        setQuizState({ currentQuestion: 0, waitingForAnswer: true, showNextButton: false });
+      }, 50);
+    } catch (e: any) {
+      setIsTyping(false);
+      toast.error(e?.message || "Start quiz failed");
+  
+      const assistantMessage: Message = {
+        id: Date.now().toString(),
+        role: "assistant",
+        content: "Sorry — could not start the quiz. Please try again.",
+        timestamp: new Date(),
+        sender: spaceType === "group" ? groupMembers.find((m) => m.isAI) : undefined,
+      };
+  
+      setTimeout(() => setQuizMessages((prev) => [...prev, assistantMessage]), 50);
+    }
   };
 
-  const handleStartQuiz = () => handleNextQuestion();
 
   // =========================
   // ✅ File Upload (FIXED)