components/module_view.py

"""
Module view component for SkillSync
"""

import gradio as gr

def create_module_view(module_data, module_id, progress_manager):
    """Create a module view with lessons, quiz, and assignment"""
    
    # Calculate progress
    completed_lessons = progress_manager.get_completed_lessons(module_id)
    total_lessons = len(module_data['lessons'])
    progress_pct = int((len(completed_lessons) / total_lessons) * 100) if total_lessons > 0 else 0
    
    # Module header
    gr.Markdown(f"""
    ## Module {module_id}: {module_data['title']}
    
    **{module_data['description']}**
    
    **Progress:** {len(completed_lessons)}/{total_lessons} lessons completed ({progress_pct}%)
    """)
    
    # Progress bar
    gr.HTML(f"""
    <div style="background: #e0e0e0; border-radius: 10px; height: 20px; width: 100%; margin: 10px 0;">
        <div style="background: linear-gradient(90deg, #667eea 0%, #764ba2 100%); 
                    border-radius: 10px; height: 100%; width: {progress_pct}%;"></div>
    </div>
    """)
    
    # Lessons section
    gr.Markdown("### 📚 Lessons")
    
    for lesson in module_data['lessons']:
        status = "✅" if lesson['id'] in completed_lessons else "⬜"
        gr.Markdown(f"{status} **{lesson['title']}** • ⏱️ {lesson['duration']} • 📹 {lesson['type'].title()}")
    
    # Mark lesson complete
    gr.Markdown("---")
    gr.Markdown("### ✍️ Mark Lesson Complete")
    
    lesson_dropdown = gr.Dropdown(
        choices=[lesson['title'] for lesson in module_data['lessons']],
        label="Select Lesson"
    )
    
    mark_btn = gr.Button("✅ Mark as Complete", variant="primary")
    status_msg = gr.Markdown()
    
    def mark_complete(lesson_title):
        for lesson in module_data['lessons']:
            if lesson['title'] == lesson_title:
                result = progress_manager.mark_lesson_complete(module_id, lesson['id'])
                if result:
                    return f"✅ Marked '{lesson_title}' as complete!"
                else:
                    return f"ℹ️ '{lesson_title}' is already marked complete."
        return "❌ Lesson not found."
    
    mark_btn.click(
        fn=mark_complete,
        inputs=[lesson_dropdown],
        outputs=[status_msg]
    )
    
    # Assignment section
    from components.assignment_view import create_assignment_view
    create_assignment_view(module_data, module_id, progress_manager)
    
    # Quiz section
    from components.quiz_view import create_quiz_view
    create_quiz_view(module_data, module_id, progress_manager)