{% extends "_layout.html" %}
{% block title %}Overview{% endblock %}
{% block content %}
<header class="page-header">
    <div>
        <div class="eyebrow">Overview</div>
        <h1>Workspace Status</h1>
    </div>
    <div class="page-actions">
        {% if show_admin_sections %}
        <a class="btn btn-secondary" href="/audit">Audit log</a>
        {% endif %}
        <a class="btn btn-primary" href="/manage/connections">
            <span aria-hidden="true">+</span>
            Add connection
        </a>
    </div>
</header>

<section class="stat-grid">
    <div class="stat-card">
        <div class="stat-label">Connected Apps</div>
        <div class="stat-value">{{ stats.connected }}</div>
        <div class="stat-foot">{{ stats.available }} more available</div>
    </div>

    <div class="stat-card">
        <div class="stat-label">Next Expiry</div>
        <div class="stat-value stat-value-sm">{{ last_activity }}</div>
        <div class="stat-foot">Across connected providers</div>
    </div>

    <div class="stat-card">
        <div class="stat-label">Auth Types</div>
        <div class="stat-value">{{ stats.oauth }} <span class="muted">/</span> {{ stats.api_key }}</div>
        <div class="stat-foot">OAuth 2.0 / API Key</div>
    </div>
</section>

<section class="section">
    <div class="section-header">
        <h2>Connected Providers</h2>
        <a class="link" href="/manage/connections">Manage Connections</a>
    </div>

    {% if connected_providers %}
    <div class="provider-grid">
        {% for p in connected_providers %}
        <a class="provider-card" href="/apps/{{ p.name }}">
            <div class="provider-card-top">
                <span class="logo">{{ p.logo_initial }}</span>
                {% if p.status == 'reauth' %}
                <span class="pill pill-warn">Re-auth required</span>
                {% else %}
                <span class="pill pill-accent">Connected</span>
                {% endif %}
            </div>
            <div class="provider-card-name">{{ p.display_name }}</div>
            <div class="provider-card-desc">{{ p.description or p.api_url }}</div>
            <div class="provider-card-foot">
                {% if p.status == 'reauth' %}
                <button class="btn btn-warn-ghost" type="button">Fix</button>
                {% else %}
                <span class="meta">{{ p.auth_type_label }}{% if p.scope_count %} · {{ p.scope_count }} scopes{% endif %}</span>
                <span class="icon-gear" aria-hidden="true">
                    <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
                        <circle cx="12" cy="12" r="3"/>
                        <path d="M19.4 15a1.7 1.7 0 0 0 .3 1.8l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-1.8-.3 1.7 1.7 0 0 0-1 1.5V21a2 2 0 1 1-4 0v-.1a1.7 1.7 0 0 0-1-1.5 1.7 1.7 0 0 0-1.8.3l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0 .3-1.8 1.7 1.7 0 0 0-1.5-1H3a2 2 0 1 1 0-4h.1a1.7 1.7 0 0 0 1.5-1 1.7 1.7 0 0 0-.3-1.8l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 1.8.3h0a1.7 1.7 0 0 0 1-1.5V3a2 2 0 1 1 4 0v.1a1.7 1.7 0 0 0 1 1.5 1.7 1.7 0 0 0 1.8-.3l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0-.3 1.8v0a1.7 1.7 0 0 0 1.5 1H21a2 2 0 1 1 0 4h-.1a1.7 1.7 0 0 0-1.5 1z"/>
                    </svg>
                </span>
                {% endif %}
            </div>
        </a>
        {% endfor %}
    </div>
    {% else %}
    <div class="empty">
        <div class="empty-title">No connections yet</div>
        <div class="empty-body">Connect your first provider to get started.</div>
        <a class="btn btn-primary" href="/manage/connections">Browse providers</a>
    </div>
    {% endif %}
</section>

{% if show_admin_sections %}
<section class="notice-band">
    <div>
        <div class="notice-title">Administrative controls</div>
        <p class="notice-body">Provider configuration and audit events are restricted to administrators.</p>
    </div>
    <a class="btn btn-secondary" href="/audit">Review audit</a>
</section>
{% endif %}
{% endblock %}