{% extends "page.html" %}

{% block title %}{{ _("Settings") }} — {{ _("Better Stats") }}{% endblock %}

{% block breadcrumb_content %}
    {{ super() }}
    <li><a href="{{ h.url_for('better_stats.dashboard') }}">{{ _("Better Stats") }}</a></li>
    <li class="active"><a href="{{ h.url_for('better_stats_settings.settings') }}">{{ _("Settings") }}</a></li>
{% endblock %}

{% block secondary %}{% endblock %}

{% block primary %}
<div class="primary col p-0" role="main">
    {% block primary_content %}

    <meta name="csrf-token" content="{{ csrf_token() }}">

    <form class="module"
         name="better-stats-settings-form"
         data-module="bstats-stats-settings"
         data-module-clear-all-url="{{ h.url_for('better_stats_settings.clear_all_caches') }}"
         data-module-reset-url="{{ h.url_for('better_stats_settings.reset_all_configs') }}"
         data-module-batch-order-url="{{ h.url_for('better_stats_settings.batch_update_order') }}">
        <div class="p-3">

            <div class="d-flex align-items-center justify-content-between mb-4">
                <h1 class="h3 mb-0">{{ _("Better Stats — Settings") }}</h1>
                <a href="{{ h.url_for('better_stats.dashboard') }}" class="btn btn-dashboard">
                    <i class="fa fa-arrow-left"></i> {{ _("Back to Dashboard") }}
                </a>
            </div>

            {# ── Actions ── #}
            <div class="mb-3 d-flex align-items-center gap-3 flex-wrap">
                <span class="text-muted small align-self-center" id="autosave-status"></span>

                <button type="button" class="btn btn-dashboard btn-sm ms-auto" id="btn-reset-all">
                    <i class="fa fa-undo"></i> {{ _("Reset All to Defaults") }}
                </button>

                <button type="button" class="btn btn-dashboard btn-sm" id="btn-clear-all-caches">
                    <i class="fa fa-trash"></i> {{ _("Clear All Caches") }}
                </button>
            </div>

            {# ── Metrics accordion ── #}
            <div class="accordion bstats-settings-accordion" id="metrics-accordion">
                {% for group, group_rows in groups %}
                    {% snippet "better_stats/settings_group.html", group=group, group_rows=group_rows, group_id="bstats-group-" ~ group.name %}
                {% endfor %}
            </div>
        </div>
    </form>
    {% endblock %}
</div>
{% endblock %}

{%- block scripts %}
    {% asset 'better_stats/better_stats-settings-js' %}
    {{ super() }}
{% endblock %}