Update app.py

app.py

@@ -558,7 +558,7 @@ def create_quiz_interface():
         # State management
         current_questions = gr.State([])
         current_question_idx = gr.State(0)
-        answer_state = gr.State([None] * 5)  # Store all answers
+        answer_state = gr.State([None] * 5)
         
         # Header
         gr.Markdown("""
@@ -568,7 +568,7 @@ def create_quiz_interface():
         
         with gr.Tabs() as tabs:
             # Profile Setup Tab
-            with gr.Tab(id=1,label="📋 Step 1: Profile Setup"):
+            with gr.Tab(id=1, label="📋 Step 1: Profile Setup"):
                 with gr.Row():
                     name = gr.Textbox(label="Full Name", placeholder="Enter your full name")
                     email = gr.Textbox(label="Email", placeholder="Enter your email")
@@ -594,257 +594,217 @@ def create_quiz_interface():
                 generate_btn = gr.Button("Generate Assessment", variant="primary", size="lg")
             
             # Assessment Tab
-            with gr.Tab(id=2,label="📝 Step 2: Take Assessment") as assessment_tab:
-                with gr.Column(visible=True) as question_box:
-                    # Question section
-                    with gr.Group():
-                        # Question display
-                        question_display = gr.Markdown("", label="Current Question")
-                        
-                        # Single radio group for current question
+            with gr.Tab(id=2, label="📝 Step 2: Take Assessment") as assessment_tab:
+                with gr.Column() as main_container:
+                    # Questions Section
+                    with gr.Column(visible=True) as question_box:
+                        question_display = gr.Markdown("")
                         current_options = gr.Radio(
                             choices=[],
                             label="Select your answer:",
                             visible=False
                         )
                         
-                        # Navigation
                         with gr.Row():
                             prev_btn = gr.Button("← Previous", variant="secondary", size="sm")
                             question_counter = gr.Markdown("Question 1")
                             next_btn = gr.Button("Next →", variant="secondary", size="sm")
                         
-                        gr.Markdown("---")  # Separator
-                        
+                        submit_btn = gr.Button(
+                            "Submit Assessment",
+                            variant="primary",
+                            size="lg"
+                        )
+                    
+                    # Results Section
+                    with gr.Column(visible=False) as results_group:
+                        feedback_box = gr.Markdown("")
                         with gr.Row():
-                            submit_btn = gr.Button(
-                                "Submit Assessment",
-                                variant="primary",
-                                size="lg"
-                            )
                             reset_btn = gr.Button(
                                 "Reset Quiz",
                                 variant="secondary",
-                                size="lg"
+                                size="lg",
+                                visible=False
+                            )
+                            view_cert_btn = gr.Button(
+                                "View Certificate",
+                                variant="primary",
+                                size="lg",
+                                visible=False
                             )
-                
-            # Results section
-            with gr.Group(visible=False) as results_group:
-                feedback_box = gr.Markdown("")
-                with gr.Row():
-                    view_cert_btn = gr.Button(
-                        "View Certificate",
-                        variant="primary",
-                        size="lg",
-                        visible=False
-                    )
-                    back_to_assessment = gr.Button(  # Add this button definition
-                        "Back to Assessment",
-                        variant="secondary",
-                        size="lg",
-                        visible=True
-                    )
             
             # Certification Tab
-            with gr.Tab(id=3,label="🎓 Step 3: Get Certified"):
-                score_display = gr.Number(label="Your Score")
-                result_message = gr.Markdown("")
-                course_name = gr.Textbox(
-                    label="Certification Title",
-                    value="Professional Assessment Certification"
-                )
-                certificate_display = gr.Image(label="Your Certificate")
-
+            with gr.Tab(id=3, label="🎓 Step 3: Get Certified"):
+                with gr.Column():
+                    score_display = gr.Number(label="Your Score", visible=False)
+                    course_name = gr.Textbox(
+                        label="Certification Title",
+                        value="Professional Assessment Certification"
+                    )
+                    certificate_display = gr.Image(label="Your Certificate")
+        
         # Helper Functions
         def on_generate_questions(text, num_questions):
             """Generate quiz questions and setup initial state"""
+            if not text.strip():
+                return [
+                    gr.Markdown("⚠️ Please enter some text content to generate questions."),
+                    gr.update(visible=False),
+                    gr.update(choices=[], visible=False),
+                    "",
+                    [],
+                    0,
+                    [None] * 5,
+                    gr.Tabs(selected=1),
+                    gr.update(visible=False),
+                    gr.update(visible=False)
+                ]
+            
             success, questions = quiz_app.generate_questions(text, num_questions)
-            if not success:
+            if not success or not questions:
                 return [
-                    "",                                     # question_display
-                    gr.update(choices=[], visible=False),   # current_options
-                    "",                                     # question_counter
-                    gr.update(visible=False),               # question_box
-                    [],                                     # current_questions
-                    0,                                      # current_question_idx
-                    [None] * 5,                            # answer_state
-                    gr.Tabs(selected=2),                    # tabs
-                    gr.update(visible=False),               # results_group
-                    gr.update(visible=False)                # view_cert_btn - added this
+                    gr.Markdown("❌ Failed to generate questions. Please try again."),
+                    gr.update(visible=False),
+                    gr.update(choices=[], visible=False),
+                    "",
+                    [],
+                    0,
+                    [None] * 5,
+                    gr.Tabs(selected=1),
+                    gr.update(visible=False),
+                    gr.update(visible=False)
                 ]
             
-            # Setup initial state with first question
-            initial_answers = [None] * len(questions)
+            # Setup initial question
             question = questions[0]
-            question_html = f"""## Question 1
-        {question.question}
-        
-        Please select one answer:"""
+            question_html = f"""### Question 1
+            {question.question}"""
             
             return [
-                question_html,                              # question_display
+                gr.Markdown(question_html),
+                gr.update(visible=True),
                 gr.update(
                     choices=question.options,
                     value=None,
                     visible=True,
-                    label="Select your answer for Question 1:"
-                ),                                         # current_options
-                f"Question 1 of {len(questions)}",         # question_counter
-                gr.update(visible=True),                   # question_box
-                questions,                                 # current_questions
-                0,                                        # current_question_idx
-                initial_answers,                          # answer_state
-                gr.Tabs(selected=2),                      # tabs
-                gr.update(visible=False),                 # results_group
-                gr.update(visible=False)                  # view_cert_btn - added this
+                    label="Select your answer:"
+                ),
+                f"Question 1 of {len(questions)}",
+                questions,
+                0,
+                [None] * len(questions),
+                gr.Tabs(selected=2),
+                gr.update(visible=False),
+                gr.update(visible=False)
             ]
+
         def navigate(direction, current_idx, questions, answers, current_answer):
             """Handle navigation between questions"""
             if not questions:
-                return [
-                    0,
-                    answers,
-                    "",
-                    gr.update(choices=[], value=None, visible=False),
-                    "",
-                    gr.update(visible=False)
-                ]
+                return [0, answers, "", gr.update(choices=[], visible=False), "", gr.update(visible=False)]
             
+            # Update current answer in state
             new_answers = list(answers)
-            if current_answer and 0 <= current_idx < len(new_answers):
+            if current_answer is not None and 0 <= current_idx < len(new_answers):
                 new_answers[current_idx] = current_answer
             
+            # Calculate new index
             new_idx = max(0, min(len(questions) - 1, current_idx + direction))
             question = questions[new_idx]
             
+            # Format question display
+            question_html = f"""### Question {new_idx + 1}
+            {question.question}"""
+            
             return [
                 new_idx,
                 new_answers,
-                f"## Question {new_idx + 1}\n{question.question}\n\nPlease select one answer:",
+                gr.Markdown(question_html),
                 gr.update(
                     choices=question.options,
                     value=new_answers[new_idx] if new_idx < len(new_answers) else None,
                     visible=True,
-                    label=f"Select your answer for Question {new_idx + 1}:"
+                    label=f"Select your answer:"
                 ),
                 f"Question {new_idx + 1} of {len(questions)}",
                 gr.update(visible=True)
-            ]  
-        def handle_prev(current_idx, questions, answers, current_answer):
-            return navigate(-1, current_idx, questions, answers, current_answer)
-
-        def handle_next(current_idx, questions, answers, current_answer):
-            return navigate(1, current_idx, questions, answers, current_answer)
-
-        def update_answer_state(answer, idx, current_answers):
-            new_answers = list(current_answers)
-            if 0 <= idx < len(new_answers):
-                new_answers[idx] = answer
-            return new_answers
-
-        def reset_quiz(text, num_questions):
-            """Handle quiz reset"""
-            return on_generate_questions(text, num_questions)
-
-        def view_certificate():
-            """Navigate to certificate tab"""
-            return gr.Tabs(selected=2)
-        
-        def on_submit(questions, answers, current_idx, current_answer):
-            """Handle quiz submission with updated styling and logic"""
-            final_answers = list(answers)
-            if 0 <= current_idx < len(final_answers):
-                final_answers[current_idx] = current_answer
-            
-            if not all(a is not None for a in final_answers[:len(questions)]):
-                return [
-                    "⚠️ Please answer all questions before submitting.",
-                    gr.update(visible=True),
-                    0,
-                    "",
-                    gr.update(visible=True),
-                    gr.update(visible=True),
-                    gr.update(visible=False),
-                    gr.update(visible=False),
-                    gr.update(visible=False)
-                ]
-            
-            score, passed, feedback = quiz_app.calculate_score(final_answers[:len(questions)])
-            
-            # Updated feedback HTML with proper font styling
-            feedback_html = """
-            <div style="font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;">
-                <h1 style="font-size: 24px; font-weight: 600; margin-bottom: 20px;">Assessment Results</h1>
-            """
-            
-            for i, (q, f) in enumerate(zip(questions, feedback)):
-                color = "green" if f.is_correct else "red"
-                symbol = "✅" if f.is_correct else "❌"
-                
-                feedback_html += f"""
-                <div style="margin-bottom: 24px;">
-                    <h3 style="font-size: 18px; font-weight: 500; margin-bottom: 12px;">Question {i+1}</h3>
-                    <p style="font-size: 16px; margin-bottom: 12px;">{q.question}</p>
-                    <div style="color: {color}; padding: 12px; margin: 8px 0; border-left: 3px solid {color}; background-color: {'#f8fff8' if f.is_correct else '#fff8f8'}; font-size: 15px;">
-                        {symbol} Your answer: {f.selected or "No answer"}
-                        {'' if f.is_correct else f'<br><span style="font-weight: 500;">Correct answer:</span> {f.correct_answer}'}
-                    </div>
-                </div>
-                """
-            
-            # Add summary box with score
-            if passed:
-                feedback_html += f"""
-                <div style="background-color: #e6ffe6; padding: 20px; margin: 20px 0; border-radius: 10px; border: 1px solid #ccffcc;">
-                    <h3 style="color: #008000; margin: 0 0 12px 0; font-size: 20px;">🎉 Congratulations!</h3>
-                    <p style="margin: 0; font-size: 16px;">You passed with a score of {score:.1f}%</p>
-                </div>
-                """
-            else:
-                feedback_html += f"""
-                <div style="background-color: #ffe6e6; padding: 20px; margin: 20px 0; border-radius: 10px; border: 1px solid #ffcccc;">
-                    <h3 style="color: #cc0000; margin: 0 0 12px 0; font-size: 20px;">Please Try Again</h3>
-                    <p style="margin: 0; font-size: 16px;">Your score: {score:.1f}% (80% required to pass)</p>
-                </div>
-                """
-            
-            feedback_html += "</div>"
-            
-            return [
-                feedback_html,                          # feedback_box
-                gr.update(visible=True),               # results_group
-                score,                                 # score_display
-                "🎉 Passed!" if passed else "Please try again",  # result_message
-                gr.update(visible=False),              # question_box
-                gr.update(visible=True),               # reset_btn
-                gr.update(visible=passed),             # view_cert_btn
-                gr.update(visible=not passed),         # back_to_assessment
-                gr.update(visible=False)               # profile_tab
             ]
-
-        # Event handlers
-       
-        generate_btn.click(fn=on_generate_questions, inputs=[text_input, num_questions], outputs=[question_display, current_options, question_counter, question_box, current_questions, current_question_idx, answer_state, tabs, results_group, view_cert_btn]).then(fn=lambda: gr.Tabs(selected=2), outputs=tabs)
         
-        prev_btn.click(fn=handle_prev, inputs=[current_question_idx, current_questions, answer_state, current_options], outputs=[current_question_idx, answer_state, question_display, current_options, question_counter, question_box])
+        # Event Handlers
+        generate_btn.click(
+            fn=on_generate_questions,
+            inputs=[text_input, num_questions],
+            outputs=[
+                question_display,
+                question_box,
+                current_options,
+                question_counter,
+                current_questions,
+                current_question_idx,
+                answer_state,
+                tabs,
+                results_group,
+                view_cert_btn
+            ]
+        )
         
-        next_btn.click(fn=handle_next, inputs=[current_question_idx, current_questions, answer_state, current_options], outputs=[current_question_idx, answer_state, question_display, current_options, question_counter, question_box])
+        prev_btn.click(
+            fn=lambda *args: navigate(-1, *args),
+            inputs=[current_question_idx, current_questions, answer_state, current_options],
+            outputs=[current_question_idx, answer_state, question_display, current_options, question_counter, question_box]
+        )
         
-        current_options.change(fn=update_answer_state, inputs=[current_options, current_question_idx, answer_state], outputs=answer_state)
+        next_btn.click(
+            fn=lambda *args: navigate(1, *args),
+            inputs=[current_question_idx, current_questions, answer_state, current_options],
+            outputs=[current_question_idx, answer_state, question_display, current_options, question_counter, question_box]
+        )
         
-        submit_btn.click(fn=on_submit, inputs=[current_questions, answer_state, current_question_idx, current_options], outputs=[feedback_box, results_group, score_display, result_message, question_box, tabs, view_cert_btn])
-
-        reset_btn.click(fn=reset_quiz, inputs=[text_input, num_questions], outputs=[question_display, current_options, question_counter, question_box, current_questions, current_question_idx, answer_state, tabs, results_group, view_cert_btn])
+        submit_btn.click(
+            fn=on_submit,
+            inputs=[current_questions, answer_state, current_question_idx, current_options],
+            outputs=[
+                feedback_box,
+                results_group,
+                score_display,
+                result_message,
+                question_box,
+                reset_btn,
+                view_cert_btn,
+                back_to_assessment,
+                tabs
+            ]
+        )
         
-        view_cert_btn.click(fn=lambda: gr.Tabs(selected=3), outputs=tabs)
+        reset_btn.click(
+            fn=on_generate_questions,
+            inputs=[text_input, num_questions],
+            outputs=[
+                question_display,
+                question_box,
+                current_options,
+                question_counter,
+                current_questions,
+                current_question_idx,
+                answer_state,
+                tabs,
+                results_group,
+                view_cert_btn
+            ]
+        )
         
-        back_to_assessment.click(fn=lambda: gr.Tabs(selected=2), outputs=tabs)
+        view_cert_btn.click(
+            fn=lambda: gr.Tabs(selected=3),
+            outputs=tabs
+        )
         
-        score_display.change(fn=lambda s, n, c, l, p: quiz_app.certificate_generator.generate(s, n, c, l, p) or gr.update(value=None), inputs=[score_display, name, course_name, company_logo, participant_photo], outputs=certificate_display)
-
+        score_display.change(
+            fn=lambda s, n, c, l, p: quiz_app.certificate_generator.generate(s, n, c, l, p) or gr.update(value=None),
+            inputs=[score_display, name, course_name, company_logo, participant_photo],
+            outputs=certificate_display
+        )
 
     return demo
-
 if __name__ == "__main__":
     demo = create_quiz_interface()
     demo.launch()