{% extends 'base.html.twig' %}

{% block title %}Accueil — aperçu v2{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link rel="stylesheet" href="{{ asset('css/dashboard-v2.css') }}?v=1">
    {% if dashboard_editorial %}
        <link rel="stylesheet" href="{{ asset('css/dashboard-editorial.css') }}?v=6">
    {% endif %}
{% endblock %}

{% block body %}
    {% include 'home/_ui_preview_banner.html.twig' with { back_route: 'app_homepage' } only %}

    {% include 'home/_dashboard_banner.html.twig' %}

    <div class="dashboard-v2-layout mt-4">
        <div class="dashboard-v2-main">
            {% if dashboard_editorial %}
                <div class="dashboard-v2-editorial--compact">
                    {% include 'home/_dashboard_editorial.html.twig' with {
                        dashboard_editorial: dashboard_editorial,
                        dashboard_editorials_archive: dashboard_editorials_archive|default([]),
                    } only %}
                </div>
            {% endif %}

            {% if not competition_started and (not precomp_checklist.all_done or not cotisation_payee) %}
                {% include 'home/_precompetition_checklist.html.twig' with {
                    precomp_checklist: precomp_checklist,
                    cotisation_payee: cotisation_payee,
                } only %}
            {% endif %}

            <section class="dashboard-v2-section mt-5">
                {% if live_matches is empty and last_completed_matchday is null and upcoming_matches is empty %}
                    <p class="ta-card-text">Aucun match à afficher pour le moment.</p>
                {% else %}
                    {% if live_matches is not empty %}
                        <div class="dashboard-v2-section">
                            <h2 class="dashboard-v2-section-title">En direct</h2>
                            <div class="dashboard-v2-match-grid">
                                {% for match in live_matches %}
                                    {% include 'home/_dashboard_v2_match_card.html.twig' with {
                                        match: match,
                                        pronostic: pronostics_by_match_id[match.id] ?? null,
                                        partner_pronostics: partner_pronostics_by_match_id[match.id] ?? [],
                                        is_live: true,
                                        is_finished: false,
                                        team_match_points: team_match_points_by_match_id[match.id] ?? null,
                                    } only %}
                                {% endfor %}
                            </div>
                        </div>
                    {% endif %}

                    {% if last_completed_matchday %}
                        <div class="dashboard-v2-section">
                            <h2 class="dashboard-v2-section-title">Dernière journée — {{ last_completed_matchday.date|fr_date_long }}</h2>
                            <div class="dashboard-v2-match-grid">
                                {% for match in last_completed_matchday.matches %}
                                    {% if not match_is_live(match, now) %}
                                        {% include 'home/_dashboard_v2_match_card.html.twig' with {
                                            match: match,
                                            pronostic: pronostics_by_match_id[match.id] ?? null,
                                            partner_pronostics: partner_pronostics_by_match_id[match.id] ?? [],
                                            is_live: false,
                                            is_finished: true,
                                            team_match_points: team_match_points_by_match_id[match.id] ?? null,
                                        } only %}
                                    {% endif %}
                                {% endfor %}
                            </div>
                        </div>
                    {% endif %}

                    {% if upcoming_matches is not empty %}
                        <div class="dashboard-v2-section">
                            <h2 class="dashboard-v2-section-title">Matchs à venir</h2>
                            <div class="dashboard-v2-match-grid">
                                {% for match in upcoming_matches %}
                                    {% include 'home/_dashboard_v2_match_card.html.twig' with {
                                        match: match,
                                        pronostic: pronostics_by_match_id[match.id] ?? null,
                                        partner_pronostics: partner_pronostics_by_match_id[match.id] ?? [],
                                        is_live: false,
                                        is_finished: false,
                                        team_match_points: null,
                                    } only %}
                                {% endfor %}
                            </div>
                        </div>
                    {% endif %}
                {% endif %}
            </section>
        </div>

        <div class="dashboard-v2-sidebar">
            {% include 'home/_dashboard_v2_team_hub.html.twig' %}
        </div>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {% if dashboard_editorial %}
        <script src="{{ asset('js/dashboard-editorial-accordion.js') }}?v=1" defer></script>
    {% endif %}
    {% if dashboard_editorials_archive|default([])|length > 0 %}
        <script src="{{ asset('js/dashboard-editorial-switch.js') }}?v=1" defer></script>
    {% endif %}
    {% if has_live_matches|default(false) %}
        <script src="{{ asset('js/live-match-feed.js') }}?v=1" defer></script>
    {% endif %}
{% endblock %}