Update file_viewer_panel.py

file_viewer_panel.py

@@ -1,53 +1,69 @@
 import gradio as gr
-import os
-import json
 from file_utils import extract_text_from_file, call_llm
+import os, json
 
 def file_viewer_dashboard():
-    with gr.Column(scale=4, elem_id="main-column") as file_panel:
-        file_upload = gr.File(label="📂 Upload a File", file_types=[".pdf", ".txt", ".md", ".pptx"])
-        preview = gr.Textbox(label="📄 File Content Preview", lines=10, interactive=False)
-        chat_input = gr.Textbox(label="💬 Ask about the file")
-        chat_output = gr.Chatbot()
-        quiz_box = gr.Column(visible=False)
-        quiz_score = gr.Textbox(label="Your Score", interactive=False, visible=False)
+    with gr.Row():
+        with gr.Column(scale=3):  # Main viewer
+            file_upload = gr.File(label="📂 Upload a File", file_types=[".pdf", ".txt", ".md", ".pptx"])
+            file_viewer = gr.HTML(label="📄 File Preview")
+        
+        with gr.Column(scale=2):  # Right: Chat + Quiz
+            generate_quiz_btn = gr.Button("🧠 Practice Questions")
+            quiz_container = gr.Column(visible=False)
+            chat_output = gr.Chatbot(label="Ask a question to learn more about the file")
+            chat_input = gr.Textbox(label="", placeholder="Ask ChatEDU a question...")
 
         file_text_state = gr.State("")
 
-        def load_and_preview(file):
-            if not file: return "", ""
+        def render_file(file):
+            if not file:
+                return "", ""
+            ext = os.path.splitext(file.name)[1].lower()
+            file_path = file.name
             text = extract_text_from_file(file)
-            return text, text
 
-        def handle_chat(query, text):
-            prompt = f"Using the document below, answer this question:\n\n{text}\n\nQuestion: {query}"
-            return [(query, call_llm(prompt))]
+            if ext == ".pdf":
+                viewer_html = f"<iframe src='/file={file_path}' width='100%' height='700px' style='border:none; border-radius:8px;'></iframe>"
+            elif ext in [".txt", ".md", ".pptx"]:
+                viewer_html = f"<pre style='padding:12px; background:#f9f9f9;'>{text}</pre>"
+            else:
+                viewer_html = "<p>Unsupported file type.</p>"
+
+            return viewer_html, text
+
+        def ask_question(q, text):
+            prompt = f"Answer the following question based only on this document:\n\n{text}\n\nQuestion: {q}"
+            return [(q, call_llm(prompt))]
 
         def generate_quiz(text):
-            prompt = f"Create 5 multiple-choice questions from this text. Return as JSON list."
-            response = call_llm(prompt)
+            prompt = (
+                "Generate 5 multiple choice questions from this document. "
+                "Return a JSON array of questions, each with:\n- question\n- options (list)\n- answer (string)"
+            )
             try:
-                questions = json.loads(response)
-                score_state = {"score": 0, "total": len(questions)}
-                elements = []
+                result = call_llm(prompt)
+                questions = json.loads(result)
+
+                components = []
+                for idx, q in enumerate(questions):
+                    q_md = gr.Markdown(f"**Q{idx+1}. {q['question']}**")
+                    radio = gr.Radio(choices=q["options"], label="Choose an answer")
+                    feedback = gr.Textbox(interactive=False)
 
-                for i, q in enumerate(questions):
-                    q_md = gr.Markdown(f"**Q{i+1}. {q['question']}**")
-                    q_radio = gr.Radio(q["options"], label="Select an answer")
-                    q_feedback = gr.Textbox(label="Result", interactive=False)
+                    def check(ans, correct=q["answer"]):
+                        return "✅ Correct!" if ans == correct else f"❌ Correct answer: {correct}"
 
-                    def grade(choice, correct=q["answer"]):
-                        return "✅ Correct!" if choice == correct else f"❌ Correct: {correct}"
+                    radio.change(fn=check, inputs=[radio], outputs=[feedback])
+                    components.extend([q_md, radio, feedback])
 
-                    q_radio.change(fn=grade, inputs=[q_radio], outputs=[q_feedback])
-                    elements.extend([q_md, q_radio, q_feedback])
+                return gr.update(visible=True), components
 
-                return gr.update(visible=True), elements, gr.update(visible=True, value=f"Score: 0/{score_state['total']}")
-            except:
-                return gr.update(visible=False), [], gr.update(visible=True, value="Error generating quiz.")
+            except Exception as e:
+                return gr.update(visible=False), []
 
-        file_upload.change(fn=load_and_preview, inputs=[file_upload], outputs=[preview, file_text_state])
-        chat_input.submit(fn=handle_chat, inputs=[chat_input, file_text_state], outputs=[chat_output])
-        gr.Button("🧠 Generate Quiz").click(fn=generate_quiz, inputs=[file_text_state], outputs=[quiz_box, quiz_box, quiz_score])
+        file_upload.change(fn=render_file, inputs=[file_upload], outputs=[file_viewer, file_text_state])
+        chat_input.submit(fn=ask_question, inputs=[chat_input, file_text_state], outputs=[chat_output])
+        generate_quiz_btn.click(fn=generate_quiz, inputs=[file_text_state], outputs=[quiz_container])
 
-    return file_panel
+    return file_viewer_dashboard