Update file_study_guide_panel.py

file_study_guide_panel.py

@@ -11,6 +11,22 @@ def file_study_guide_dashboard(nickname_input):
         file_text_state = gr.State("")
         guide_state = gr.State([])
 
+        def sample_section():
+            return render_sections([{
+                "section_title": "Sample Section",
+                "overview": "This is a short summary of the topic.",
+                "explanation": "This is a detailed explanation to show how learning content will look.",
+                "quiz": [
+                    {"question": "What is 2+2?", "options": ["1", "2", "3", "4"], "answer": "4"},
+                    {"question": "Sample Q2?", "options": ["A", "B", "C", "D"], "answer": "B"},
+                    {"question": "Sample Q3?", "options": ["A", "B", "C", "D"], "answer": "C"},
+                    {"question": "Sample Q4?", "options": ["A", "B", "C", "D"], "answer": "D"},
+                    {"question": "Sample Q5?", "options": ["A", "B", "C", "D"], "answer": "A"}
+                ]
+            }])
+
+        section_output.children = sample_section()
+
         def generate_study_guide(file):
             if file is None:
                 return [gr.Markdown("❌ No file uploaded.")], "", []
@@ -46,53 +62,48 @@ Text:
             response = call_llm(prompt)
             try:
                 guide = json.loads(response)
-                return render_sections(guide), text, guide
+                section_output.children = render_sections(guide)
+                return text, guide
             except:
-                return [gr.Markdown("❌ Failed to parse structured study guide.")], text, []
+                section_output.children = [gr.Markdown("❌ Failed to parse structured study guide.")]
+                return text, []
 
         def render_sections(guide_data):
-            section_blocks = []
+            blocks = []
             for i, sec in enumerate(guide_data):
-                section_blocks.append(render_section(i + 1, sec))
-            return section_blocks
+                blocks.append(render_section(i + 1, sec))
+            return blocks
 
         def render_section(index, sec):
-            quiz_area = gr.Column()
-            nav_buttons = gr.Row()
-            section_ui = gr.Column(
-                children=[
-                    gr.Markdown(f"## 📘 Section {index}: {sec['section_title']}"),
-                    gr.Markdown(f"**Overview:** {sec['overview']}"),
-                    gr.Markdown(f"**Explanation:**\n\n{sec['explanation']}"),
-                    gr.Markdown("### 🧠 Quiz"),
-                    quiz_area,
-                    nav_buttons,
-                    gr.Textbox(label="Answer Feedback", interactive=False, elem_id=f"feedback_{index}"),
-                    gr.Textbox(label="Score", interactive=False, value="Score: 0/5", elem_id=f"score_{index}")
-                ]
-            )
+            block = gr.Column()
+            with block:
+                gr.Markdown(f"## 📘 Section {index}: {sec['section_title']}")
+                gr.Markdown(f"**Overview:** {sec['overview']}")
+                gr.Markdown(f"**Explanation:**\n\n{sec['explanation']}")
+
+                gr.Markdown("### 🧠 Quiz")
+                question_area = gr.Column()
 
-            def make_question_ui(q_idx):
-                q = sec['quiz'][q_idx]
-                question_box = gr.Markdown(f"**Q{q_idx+1}.** {q['question']}")
-                option_radio = gr.Radio(q['options'], label="Choose an answer")
+                def make_question_ui(q_idx):
+                    q = sec['quiz'][q_idx]
+                    q_box = gr.Markdown(f"**Q{q_idx+1}.** {q['question']}")
+                    q_radio = gr.Radio(q['options'], label="Choose an answer")
 
-                def grade(choice):
-                    correct = q['answer']
-                    return "✅ Correct!" if choice == correct else f"❌ Correct: {correct}"
+                    def grade(choice):
+                        correct = q['answer']
+                        return "✅ Correct!" if choice == correct else f"❌ Correct: {correct}"
 
-                option_radio.change(fn=grade, inputs=[option_radio], outputs=[f"feedback_{index}"])
-                return [question_box, option_radio]
+                    q_radio.change(fn=grade, inputs=[q_radio], outputs=[feedback_box])
+                    return [q_box, q_radio]
 
-            # Initialize quiz with question 1
-            quiz_area.children = make_question_ui(0)
+                feedback_box = gr.Textbox(label="Answer Feedback", interactive=False)
+                question_area.children = make_question_ui(0)
 
-            for i in range(5):
-                q_button = gr.Button(str(i + 1), size="sm")
-                q_button.click(fn=lambda idx=i: make_question_ui(idx), inputs=[], outputs=quiz_area)
-                nav_buttons.children.append(q_button)
+                with gr.Row():
+                    for i in range(5):
+                        gr.Button(str(i + 1), size="sm").click(fn=lambda idx=i: make_question_ui(idx), inputs=[], outputs=question_area)
 
-            return section_ui
+            return block
 
         def save_to_user(nickname, filename, guide):
             if not guide or not filename:
@@ -107,12 +118,13 @@ Text:
             guides = fetch_study_guides(user)
             for g in guides:
                 if label.startswith(g.filename):
-                    return render_sections(json.loads(g.guide))
-            return [gr.Markdown("❌ Guide not found.")]
+                    section_output.children = render_sections(json.loads(g.guide))
+                    return
+            section_output.children = [gr.Markdown("❌ Guide not found.")]
 
-        file_input.change(fn=generate_study_guide, inputs=[file_input], outputs=[section_output, file_text_state, guide_state])
+        file_input.change(fn=generate_study_guide, inputs=[file_input], outputs=[file_text_state, guide_state])
         save_btn.click(fn=save_to_user, inputs=[nickname_input, file_input, guide_state], outputs=[])
         nickname_input.change(fn=load_user_guides, inputs=[nickname_input], outputs=[guide_dropdown])
-        guide_dropdown.change(fn=show_saved_guide, inputs=[nickname_input, guide_dropdown], outputs=[section_output])
+        guide_dropdown.change(fn=show_saved_guide, inputs=[nickname_input, guide_dropdown], outputs=[])
 
-    return panel
+    return panel