Update app.py

app.py

@@ -730,6 +730,134 @@ def create_quiz_interface():
                 gr.update(visible=True)
             ]
         
+        def on_submit(questions, answers, current_idx, current_answer):
+            """Handle quiz submission with proper HTML rendering"""
+            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 [
+                    gr.Markdown("⚠️ 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)])
+            
+            # Create feedback content using proper HTML rendering
+            feedback_content = f"""# Assessment Results
+        
+        {' '.join(['✅' if f.is_correct else '❌' for f in feedback])}  Score: {score:.1f}%
+        
+        """
+            
+            for i, (q, f) in enumerate(zip(questions, feedback)):
+                feedback_content += f"""### Question {i+1}
+        {q.question}
+        
+        {'✅' if f.is_correct else '❌'} Your answer: **{f.selected or 'No answer'}**
+        {'  ' if f.is_correct else f'  \nCorrect answer: **{f.correct_answer}**'}
+        
+        """
+            
+            # Add summary box
+            if passed:
+                feedback_content += """
+        ---
+        ### 🎉 Congratulations!
+        You passed the assessment! Click the "View Certificate" button below to get your certificate.
+        """
+            else:
+                feedback_content += """
+        ---
+        ### Try Again
+        You need 80% or higher to pass. Click "Reset Quiz" to try again.
+        """
+            
+            return [
+                gr.Markdown(feedback_content),         # 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=not passed),        # reset_btn
+                gr.update(visible=passed),            # view_cert_btn
+                gr.update(visible=True),              # back_to_assessment
+                gr.update(visible=False)              # profile_tab
+            ]
+        
+        def create_quiz_interface():
+            if not os.getenv("GROQ_API_KEY"):
+                raise EnvironmentError("Please set your GROQ_API_KEY environment variable")
+                
+            quiz_app = QuizApp(os.getenv("GROQ_API_KEY"))
+            
+            with gr.Blocks(title="CertifyMe AI", theme=gr.themes.Soft()) as demo:
+                # State management
+                current_questions = gr.State([])
+                current_question_idx = gr.State(0)
+                answer_state = gr.State([None] * 5)
+                
+                with gr.Tabs() as tabs:
+                    # Profile Setup Tab
+                    with gr.Tab(id=1, label="📋 Step 1: Profile Setup"):
+                        # ... (previous profile setup code remains the same)
+                        pass
+                    
+                    # Assessment Tab
+                    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
+                                )
+                                
+                                with gr.Row():
+                                    prev_btn = gr.Button("← Previous", variant="secondary")
+                                    question_counter = gr.Markdown("Question 1")
+                                    next_btn = gr.Button("Next →", variant="secondary")
+                                
+                                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():
+                                    reset_btn = gr.Button(
+                                        "Reset Quiz",
+                                        variant="secondary",
+                                        size="lg",
+                                        visible=False
+                                    )
+                                    view_cert_btn = gr.Button(
+                                        "View Certificate",
+                                        variant="primary",
+                                        size="lg",
+                                        visible=False
+                                    )
+                    
+                    # Certification Tab
+                    with gr.Tab(id=3, label="🎓 Step 3: Get Certified"):
+                        score_display = gr.Number(label="Your Score", visible=False)
+                        certificate_display = gr.Image(label="Your Certificate")
+
+
+        
         # Event Handlers
         generate_btn.click(
             fn=on_generate_questions,