{% extends "base.html" %}

{% block title %}Dashboard - Mimir{% endblock %}

{% block content %}
<div class="hg-page-header mb-3" data-testid="dashboard-header">
  <div class="d-flex flex-wrap justify-content-between align-items-center gap-3">
    <div>
      <h1 class="hg-page-title d-flex align-items-center gap-2 mb-1">
        <i class="fas fa-gauge hg-page-title-icon text-primary" aria-hidden="true"></i>
        <span>What shall we contribute to today?</span>
      </h1>
      <p class="text-muted small mb-0">Welcome back, {{ user.username }}!</p>
    </div>
    <div role="toolbar" aria-label="Dashboard actions" class="d-flex flex-wrap gap-2 align-items-center">
            <!-- Quick Actions Multi-Button -->
            <div class="btn-group" role="group" aria-label="Quick Actions">
                <a href="{% url 'playbook_create' %}" 
                   class="btn btn-primary"
                   data-testid="dashboard-quick-new-playbook-header"
                   data-bs-toggle="tooltip" 
                   data-bs-placement="bottom" 
                   title="Create a new playbook">
                    <i class="fa-solid fa-book-sparkles me-2"></i>
                    New Playbook
                </a>
                <button type="button" 
                        class="btn btn-primary dropdown-toggle dropdown-toggle-split" 
                        data-bs-toggle="dropdown" 
                        aria-expanded="false"
                        data-testid="dashboard-quick-actions-dropdown">
                    <span class="visually-hidden">More Quick Actions</span>
                </button>
                <ul class="dropdown-menu">
                    <li>
                        <a class="dropdown-item disabled" 
                           href="#"
                           data-testid="quick-action-import-playbook-header"
                           data-bs-toggle="tooltip" 
                           data-bs-placement="right" 
                           title="Import playbook from file (coming soon)">
                            <i class="fa-solid fa-file-import me-2"></i>
                            Import Playbook
                        </a>
                    </li>
                </ul>
            </div>

            {% if user.is_staff %}
            <!-- Divider (only when admin quick link follows) -->
            <div class="vr"></div>

            <!-- Django admin (staff only) -->
            <a href="{% url 'admin:index' %}"
               class="btn btn-outline-secondary"
               data-testid="dashboard-settings-button"
               data-bs-toggle="tooltip"
               data-bs-placement="bottom"
               title="Open Django admin">
                <i class="fa-solid fa-gear me-2"></i>
                Settings
            </a>
            {% endif %}
    </div>
  </div>
</div>

    <!-- Error Message (if any) -->
    {% if error_message %}
    <div class="row mb-4">
        <div class="col-12">
            <div class="alert alert-warning alert-dismissible fade show" role="alert" data-testid="dashboard-error">
                <i class="fa-solid fa-triangle-exclamation me-2"></i>
                <strong>Warning:</strong> {{ error_message }}
                <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
            </div>
        </div>
    </div>
    {% endif %}

    <!-- Main Dashboard Content -->
    <div class="row g-3">
        <!-- My Playbooks Section -->
        {% include 'methodology/partials/my_playbooks_section.html' %}

        <!-- Recently Contributed Section -->
        {% include 'methodology/partials/recent_activity_section.html' %}
    </div>

<!-- Test identifiers -->
<div data-testid="dashboard-loaded" style="display: none;">FOB-DASHBOARD-1</div>
{% endblock %}