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

{% block title %}{{ 'admin.dashboard'|trans }}{% endblock %}

{% block body %}
    {% set canUserCreate = has_permission('ALLOW_USER_CREATE', app.user) %}
    {% set canPageCreate = has_permission('ALLOW_PAGE_CREATE', app.user) %}
    {% set canCategoryCreate = has_permission('ALLOW_CATEGORY_CREATE', app.user) %}
    {% set canMediaView = has_permission('ALLOW_MEDIA_VIEW', app.user) %}
    {% set canUserView = has_permission('ALLOW_USER_VIEW', app.user) %}
    {% set canPageView = has_permission('ALLOW_PAGE_VIEW', app.user) %}
    {% set canCategoryView = has_permission('ALLOW_CATEGORY_VIEW', app.user) %}
    {% set canCacheManage = has_permission('ALLOW_CACHE_MANAGE', app.user) %}
    {% set canLicenseView = has_permission('ALLOW_LICENSE_VIEW', app.user) %}
    {% set canSettingsView = has_permission('ALLOW_SETTINGS_VIEW', app.user) %}
    {% set canExtensionsView = has_permission('ALLOW_EXTENSIONS_VIEW', app.user) %}
    {% set canPluginsView = has_permission('ALLOW_PLUGINS_VIEW', app.user) %}

    <div class="dashboard-page" id="tf-admin-dashboard" data-locale="{{ app.request.locale|default('de')|e('html_attr') }}">
        {# — Hero — #}
        <header class="dashboard-hero" aria-labelledby="dashboard-heading">
            <div class="dashboard-hero__inner">
                <div class="dashboard-hero__intro">
                    <h1 class="dashboard-hero__title" id="dashboard-heading">{{ 'admin.dashboard'|trans }}</h1>
                    <p class="dashboard-hero__lead">{{ 'admin.dashboard_welcome'|trans }}</p>
                    <div class="dashboard-hero__meta">
                        <span class="dashboard-hero__time" id="dashboardCurrentTime" aria-live="polite"></span>
                    </div>
                </div>
                <div class="dashboard-hero__stats" aria-label="{{ 'admin.dashboard_stats_aria'|trans }}">
                    {% if canUserView %}
                        <a href="{{ path('admin_users') }}" class="dashboard-stat dashboard-stat--link">
                    {% else %}
                        <div class="dashboard-stat">
                    {% endif %}
                        <span class="dashboard-stat__value">{{ userCount }}</span>
                        <span class="dashboard-stat__label">{{ 'admin.statistic_users'|trans }}</span>
                        {% if canUserView %}<span class="dashboard-stat__hint"><i class="bi bi-arrow-right-short"></i></span>{% endif %}
                    {% if canUserView %}</a>{% else %}</div>{% endif %}

                    {% if canPageView %}
                        <a href="{{ path('admin_pages') }}" class="dashboard-stat dashboard-stat--link">
                    {% else %}
                        <div class="dashboard-stat">
                    {% endif %}
                        <span class="dashboard-stat__value">{{ pageCount }}</span>
                        <span class="dashboard-stat__label">{{ 'admin.statistic_pages'|trans }}</span>
                        {% if canPageView %}<span class="dashboard-stat__hint"><i class="bi bi-arrow-right-short"></i></span>{% endif %}
                    {% if canPageView %}</a>{% else %}</div>{% endif %}

                    {% if canCategoryView %}
                        <a href="{{ path('admin_categories') }}" class="dashboard-stat dashboard-stat--link">
                    {% else %}
                        <div class="dashboard-stat">
                    {% endif %}
                        <span class="dashboard-stat__value">{{ categoryCount }}</span>
                        <span class="dashboard-stat__label">{{ 'admin.statistic_categories'|trans }}</span>
                        {% if canCategoryView %}<span class="dashboard-stat__hint"><i class="bi bi-arrow-right-short"></i></span>{% endif %}
                    {% if canCategoryView %}</a>{% else %}</div>{% endif %}

                    {% if canMediaView %}
                        <a href="{{ path('admin_media') }}" class="dashboard-stat dashboard-stat--link">
                    {% else %}
                        <div class="dashboard-stat">
                    {% endif %}
                        <span class="dashboard-stat__value">{{ mediaCount }}</span>
                        <span class="dashboard-stat__label">{{ 'admin.statistic_media'|trans }}</span>
                        {% if canMediaView %}<span class="dashboard-stat__hint"><i class="bi bi-arrow-right-short"></i></span>{% endif %}
                    {% if canMediaView %}</a>{% else %}</div>{% endif %}
                </div>
            </div>
        </header>

        <div class="dashboard-stack">

            {# — Schnellaktionen — #}
            <section class="dashboard-panel" aria-labelledby="dash-quick-heading">
                <div class="dashboard-panel__head">
                    <h2 class="dashboard-panel__title" id="dash-quick-heading">
                        <i class="bi bi-lightning-charge-fill text-primary" aria-hidden="true"></i>
                        {{ 'admin.quick_actions'|trans }}
                    </h2>
                </div>
                <div class="dashboard-actions">
                    {% if canUserCreate %}
                    <a href="{{ path('admin_new_user') }}" class="dashboard-action-card">
                        <span class="dashboard-action-card__icon bg-primary"><i class="bi bi-person-plus" aria-hidden="true"></i></span>
                        <span class="dashboard-action-card__text">{{ 'admin.create_user'|trans }}</span>
                        <i class="bi bi-chevron-right dashboard-action-card__chev" aria-hidden="true"></i>
                    </a>
                    {% endif %}
                    {% if canPageCreate %}
                    <a href="{{ path('admin_new_page') }}" class="dashboard-action-card">
                        <span class="dashboard-action-card__icon bg-success"><i class="bi bi-file-earmark-plus" aria-hidden="true"></i></span>
                        <span class="dashboard-action-card__text">{{ 'admin.create_page'|trans }}</span>
                        <i class="bi bi-chevron-right dashboard-action-card__chev" aria-hidden="true"></i>
                    </a>
                    {% endif %}
                    {% if canCategoryCreate %}
                    <a href="{{ path('admin_categories_new') }}" class="dashboard-action-card">
                        <span class="dashboard-action-card__icon bg-info"><i class="bi bi-folder-plus" aria-hidden="true"></i></span>
                        <span class="dashboard-action-card__text">{{ 'admin.create_category'|trans }}</span>
                        <i class="bi bi-chevron-right dashboard-action-card__chev" aria-hidden="true"></i>
                    </a>
                    {% endif %}
                    {% if canMediaView %}
                    <a href="{{ path('admin_media') }}" class="dashboard-action-card">
                        <span class="dashboard-action-card__icon bg-warning text-dark"><i class="bi bi-images" aria-hidden="true"></i></span>
                        <span class="dashboard-action-card__text">{{ 'admin.upload_media'|trans }}</span>
                        <i class="bi bi-chevron-right dashboard-action-card__chev" aria-hidden="true"></i>
                    </a>
                    {% endif %}
                    {% if canCacheManage %}
                    <form method="post" action="{{ path('admin_modules_cache', {action: 'clear'}) }}" class="dashboard-action-form" onsubmit="return handleDashboardCacheClear(event);">
                        <button type="submit" class="dashboard-action-card dashboard-action-card--button">
                            <span class="dashboard-action-card__icon bg-info"><i class="bi bi-arrow-clockwise" aria-hidden="true"></i></span>
                            <span class="dashboard-action-card__text">{{ 'admin.clear_cache'|trans }}</span>
                            <i class="bi bi-chevron-right dashboard-action-card__chev" aria-hidden="true"></i>
                        </button>
                    </form>
                    {% endif %}
                    {% if canLicenseView %}
                    <a href="{{ path('admin_license') }}" class="dashboard-action-card">
                        <span class="dashboard-action-card__icon bg-danger"><i class="bi bi-shield-check" aria-hidden="true"></i></span>
                        <span class="dashboard-action-card__text">{{ 'admin.license_management'|trans }}</span>
                        <i class="bi bi-chevron-right dashboard-action-card__chev" aria-hidden="true"></i>
                    </a>
                    {% endif %}
                </div>
            </section>

            {# — System & Aktivität — #}
            <section class="dashboard-panel" aria-labelledby="dash-health-heading">
                <div class="dashboard-panel__head">
                    <div>
                        <h2 class="dashboard-panel__title" id="dash-health-heading">
                            <i class="bi bi-heart-pulse text-danger" aria-hidden="true"></i>
                            {{ 'admin.system_health'|trans }}
                        </h2>
                        <p class="dashboard-panel__sub">{{ 'admin.system_health_description'|trans }}</p>
                    </div>
                    {% set _oh = systemHealth.overall_status|default('unknown') %}
                    <span class="dashboard-status-badge badge bg-{{ _oh == 'healthy' ? 'success' : (_oh == 'warning' ? 'warning' : (_oh == 'unknown' ? 'secondary' : 'danger')) }} rounded-pill px-3 py-2">
                        {% if _oh == 'healthy' %}
                            <i class="bi bi-check-circle me-1" aria-hidden="true"></i>{{ 'admin.healthy'|trans }}
                        {% elseif _oh == 'warning' %}
                            <i class="bi bi-exclamation-triangle me-1" aria-hidden="true"></i>{{ 'admin.warning'|trans }}
                        {% elseif _oh == 'unknown' %}
                            <i class="bi bi-question-circle me-1" aria-hidden="true"></i>{{ 'admin.dashboard_status_unknown'|trans }}
                        {% else %}
                            <i class="bi bi-x-circle me-1" aria-hidden="true"></i>{{ 'admin.critical'|trans }}
                        {% endif %}
                    </span>
                </div>

                <div class="row g-3 mb-4">
                    {% for component in systemHealth.components %}
                    <div class="col-12 col-md-6">
                        <div class="dashboard-health-tile">
                            <div class="dashboard-health-tile__top">
                                <span class="dashboard-health-tile__name text-break">{{ component.name }}</span>
                                <span class="badge bg-{{ component.status == 'healthy' ? 'success' : (component.status == 'warning' ? 'warning' : 'danger') }} rounded-pill">
                                    {{ component.value }}
                                </span>
                            </div>
                            {% if component.percent is defined %}
                                <div class="progress dashboard-health-tile__bar" style="height: 6px;">
                                    <div class="progress-bar bg-{{ component.status == 'healthy' ? 'success' : (component.status == 'warning' ? 'warning' : 'danger') }}"
                                         style="width: {{ component.percent }}%"></div>
                                </div>
                                <small class="text-muted d-block mt-1">
                                    {{ component.percent }}%
                                    {% if component.limit is defined %} · {{ component.limit }}{% endif %}
                                    {% if component.free is defined %} · {{ component.free }} {{ 'admin.dashboard_free_suffix'|trans }}{% endif %}
                                </small>
                            {% elseif component.limit_label is defined %}
                                <small class="text-muted">{{ component.limit_label }}</small>
                            {% endif %}
                            {% if component.missing is defined and component.missing is not empty %}
                                <small class="text-warning d-block mt-2">
                                    <i class="bi bi-exclamation-triangle me-1" aria-hidden="true"></i>
                                    {{ 'admin.dashboard_missing_extensions'|trans }}: {{ component.missing|join(', ') }}
                                </small>
                            {% endif %}
                            {% if component.details is defined and component.details is not empty %}
                                <ul class="dashboard-health-tile__details list-unstyled small text-muted mb-0 mt-2">
                                    {% for key, value in component.details %}
                                        <li><strong>{{ key|title }}:</strong> {{ value }}</li>
                                    {% endfor %}
                                </ul>
                            {% endif %}
                        </div>
                    </div>
                    {% endfor %}
                </div>

                <div class="dashboard-activity-wrap">
                    <h3 class="h6 fw-semibold mb-3 text-body-secondary text-uppercase letter-spacing-sm">
                        <i class="bi bi-clock-history me-2 text-primary" aria-hidden="true"></i>
                        {{ 'admin.recent_activity'|trans }}
                    </h3>
                    <div class="dashboard-activity-list">
                        {% for activity in recentActivity %}
                            <div class="dashboard-activity-item">
                                <div class="dashboard-activity-item__icon text-{{ activity.color }}">
                                    <i class="bi {{ activity.icon }}" aria-hidden="true"></i>
                                </div>
                                <div class="dashboard-activity-item__body">
                                    <div class="dashboard-activity-item__title">{{ activity.title }}</div>
                                    <div class="dashboard-activity-item__meta">
                                        <time datetime="{{ activity.time|date('c') }}">{{ activity.time|date('d.m.Y H:i') }}</time>
                                        <span class="dashboard-activity-item__badge">
                                            {% if activity.type == 'plugin_installed' %}
                                                <i class="bi bi-plugin me-1" aria-hidden="true"></i>Plugin installiert
                                            {% elseif activity.type == 'plugin_uninstalled' %}
                                                <i class="bi bi-plugin me-1" aria-hidden="true"></i>Plugin deinstalliert
                                            {% elseif activity.type == 'plugin_activated' %}
                                                <i class="bi bi-play-circle me-1" aria-hidden="true"></i>Plugin aktiviert
                                            {% elseif activity.type == 'plugin_deactivated' %}
                                                <i class="bi bi-pause-circle me-1" aria-hidden="true"></i>Plugin deaktiviert
                                            {% elseif activity.type == 'plugin_updated' %}
                                                <i class="bi bi-arrow-up-circle me-1" aria-hidden="true"></i>Plugin-Update
                                            {% elseif activity.type == 'user_created' %}
                                                <i class="bi bi-person me-1" aria-hidden="true"></i>Benutzer
                                            {% elseif activity.type == 'category_created' %}
                                                <i class="bi bi-folder-plus me-1" aria-hidden="true"></i>Kategorie erstellt
                                            {% elseif activity.type == 'category_updated' %}
                                                <i class="bi bi-folder2 me-1" aria-hidden="true"></i>Kategorie bearbeitet
                                            {% elseif activity.type == 'category_deleted' %}
                                                <i class="bi bi-folder-x me-1" aria-hidden="true"></i>Kategorie gelöscht
                                            {% elseif activity.type == 'media_uploaded' %}
                                                <i class="bi bi-image me-1" aria-hidden="true"></i>Media hochgeladen
                                            {% elseif activity.type == 'media_deleted' %}
                                                <i class="bi bi-image-fill me-1" aria-hidden="true"></i>Media gelöscht
                                            {% elseif activity.type == 'page_created' %}
                                                <i class="bi bi-file-earmark-plus me-1" aria-hidden="true"></i>Seite erstellt
                                            {% elseif activity.type == 'page_updated' %}
                                                <i class="bi bi-pencil-square me-1" aria-hidden="true"></i>Seite bearbeitet
                                            {% elseif activity.type == 'page_deleted' %}
                                                <i class="bi bi-trash me-1" aria-hidden="true"></i>Seite gelöscht
                                            {% else %}
                                                <i class="bi bi-activity me-1" aria-hidden="true"></i>{{ activity.type }}
                                            {% endif %}
                                        </span>
                                    </div>
                                </div>
                            </div>
                        {% else %}
                            <div class="dashboard-activity-empty text-center text-muted py-4">
                                <i class="bi bi-inbox display-6 d-block mb-2 opacity-50" aria-hidden="true"></i>
                                <p class="mb-0">{{ 'admin.no_recent_activity'|trans }}</p>
                            </div>
                        {% endfor %}
                    </div>
                </div>
            </section>

            {# — System & Module — #}
            {% if canExtensionsView or canSettingsView or canPluginsView %}
            <section class="dashboard-panel" aria-labelledby="dash-tools-heading">
                <div class="dashboard-panel__head">
                    <div>
                        <h2 class="dashboard-panel__title" id="dash-tools-heading">
                            <i class="bi bi-tools text-secondary" aria-hidden="true"></i>
                            {{ 'admin.system_modules'|trans }}
                        </h2>
                        <p class="dashboard-panel__sub mb-0">{{ 'admin.system_modules_description'|trans }}</p>
                    </div>
                </div>
                <div class="dashboard-tools">
                    {% if canExtensionsView %}
                    <article class="dashboard-tool-card">
                        <div class="dashboard-tool-card__icon bg-purple text-white"><i class="bi bi-wrench-adjustable" aria-hidden="true"></i></div>
                        <h3 class="dashboard-tool-card__title">{{ 'admin.modules'|trans }}</h3>
                        <p class="dashboard-tool-card__desc">{{ 'admin.modules_description'|trans }}</p>
                        <a href="{{ path('app_admin_modules') }}" class="btn btn-outline-primary btn-sm rounded-pill stretched-link">
                            {{ 'admin.access_modules'|trans }} <i class="bi bi-arrow-right ms-1" aria-hidden="true"></i>
                        </a>
                    </article>
                    {% endif %}
                    {% if canSettingsView %}
                    <article class="dashboard-tool-card">
                        <div class="dashboard-tool-card__icon bg-dark"><i class="bi bi-gear-fill" aria-hidden="true"></i></div>
                        <h3 class="dashboard-tool-card__title">{{ 'admin.settings'|trans }}</h3>
                        <p class="dashboard-tool-card__desc">{{ 'admin.settings_description'|trans }}</p>
                        <a href="{{ path('admin_settings') }}" class="btn btn-outline-secondary btn-sm rounded-pill stretched-link">
                            {{ 'admin.access_settings'|trans }} <i class="bi bi-arrow-right ms-1" aria-hidden="true"></i>
                        </a>
                    </article>
                    {% endif %}
                    {% if canPluginsView %}
                    <article class="dashboard-tool-card">
                        <div class="dashboard-tool-card__icon bg-secondary"><i class="bi bi-plugin" aria-hidden="true"></i></div>
                        <h3 class="dashboard-tool-card__title">{{ 'admin.plugins'|trans }}</h3>
                        <p class="dashboard-tool-card__desc">{{ 'admin.plugins_description'|trans }}</p>
                        <a href="{{ path('admin_plugins_index') }}" class="btn btn-outline-secondary btn-sm rounded-pill stretched-link">
                            {{ 'admin.manage_plugins'|trans }} <i class="bi bi-arrow-right ms-1" aria-hidden="true"></i>
                        </a>
                    </article>
                    {% endif %}
                </div>
            </section>
            {% endif %}
        </div>
    </div>

    {% set dashboard_cache_confirm_html %}
        {{- 'admin.cache.clear_confirm_message'|trans -}}<br><small class="text-muted">{{ 'admin.cache.clear_confirm_description'|trans }}</small>
    {% endset %}
    <script>
        (function () {
            const root = document.getElementById('tf-admin-dashboard');
            const el = document.getElementById('dashboardCurrentTime');
            if (!root || !el) return;
            const locale = root.dataset.locale || 'de';
            const map = { de: 'de-DE', en: 'en-GB' };
            const loc = map[locale] || locale.replace('_', '-') || 'de-DE';
            function tick() {
                el.textContent = new Date().toLocaleString(loc, {
                    weekday: 'long',
                    year: 'numeric',
                    month: 'long',
                    day: 'numeric',
                    hour: '2-digit',
                    minute: '2-digit'
                });
            }
            tick();
            setInterval(tick, 60000);
        })();

        async function handleDashboardCacheClear(event) {
            event.preventDefault();
            const confirmHtml = {{ dashboard_cache_confirm_html|json_encode|raw }};
            const titleClear = {{ 'admin.cache.clear_cache'|trans|json_encode|raw }};
            const btnClear = {{ 'admin.cache.clear'|trans|json_encode|raw }};
            const loadingText = {{ 'admin.cache.clearing_cache'|trans|json_encode|raw }};
            const errGeneric = {{ 'error.general'|trans|json_encode|raw }};
            if (window.adminModals) {
                const confirmed = await window.adminModals.showConfirm(
                    confirmHtml,
                    titleClear,
                    {
                        confirmText: btnClear,
                        confirmClass: 'btn-danger',
                        icon: 'bi-trash-fill text-danger'
                    }
                );
                if (confirmed) {
                    let loading = null;
                    try {
                        loading = window.adminModals.showLoading(loadingText + '…');
                        const response = await fetch('{{ path('admin_modules_cache', {action: 'clear'}) }}', {
                            method: 'POST',
                            headers: {
                                'X-Requested-With': 'XMLHttpRequest',
                                'Content-Type': 'application/x-www-form-urlencoded',
                            },
                            body: 'action=clear'
                        });
                        let result;
                        try {
                            result = await response.json();
                        } catch (e) {
                            const text = await response.text();
                            result = { success: false, error: text || errGeneric };
                        }
                        if (loading && typeof loading.close === 'function') loading.close();
                        if (result.success) {
                            window.adminNotifications && window.adminNotifications.success(
                                titleClear,
                                result.message || {{ 'admin.hotkeys.cache_cleared_message'|trans|json_encode|raw }}
                            );
                        } else {
                            window.adminNotifications && window.adminNotifications.error(errGeneric, result.message || result.error || errGeneric);
                        }
                    } catch (error) {
                        if (loading && typeof loading.close === 'function') loading.close();
                        window.adminNotifications && window.adminNotifications.error(errGeneric, String(error.message || error));
                    }
                }
            } else {
                event.target.closest('form').requestSubmit();
            }
            return false;
        }
    </script>
{% endblock %}