{% extends "base.html" %}

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

{% block content %}
<div class="dashboard">
    <header class="page-header">
        <h1>Dashboard</h1>
        <a href="/projects/new" class="btn btn-primary">
            New Project
        </a>
    </header>

    <!-- Stats Cards -->
    <div class="stats-grid">
        <div class="stat-card">
            <div class="stat-value">{{ total_projects }}</div>
            <div class="stat-label">Total Projects</div>
        </div>

        <div class="stat-card">
            <div class="stat-value">{{ total_plans }}</div>
            <div class="stat-label">Plan Files</div>
        </div>

        <div class="stat-card">
            <div class="stat-value">{{ updated_this_week }}</div>
            <div class="stat-label">Updated this week</div>
        </div>
    </div>

    <!-- Projects Overview -->
    <section class="content-section">
        <h2>Projects</h2>
        {% if projects %}
        <div class="projects-grid">
            {% for project in projects %}
            <div class="project-card">
                <div class="project-header">
                    <h3>{{ project.name }}</h3>
                    <span class="badge">{{ plan_counts.get(project.id, 0) }} files</span>
                </div>
                <p class="project-description">
                    {{ project.description or 'No description' }}
                </p>
                <div class="project-meta">
                    <span class="meta-item">
                        {{ project.plan_directory }}
                    </span>
                    <span class="meta-item">
                        {{ project.created_at.strftime('%Y-%m-%d') if project.created_at else '-' }}
                    </span>
                </div>
                <div class="project-actions">
                    <a href="/projects/{{ project.id }}" class="btn btn-sm btn-primary">
                        View
                    </a>
                    <a href="/projects/{{ project.id }}/plans/new" class="btn btn-sm btn-secondary">
                        New Plan
                    </a>
                </div>
            </div>
            {% endfor %}
        </div>
        {% if total_projects > projects|length %}
        <p class="see-all"><a href="/projects">all {{ total_projects }} projects &rarr;</a></p>
        {% endif %}
        {% else %}
        <div class="empty-state">
        {% include "_empty_glyph.html" %}
            <h3>No Projects Yet</h3>
            <p>Get started by creating your first project.</p>
            <a href="/projects/new" class="btn btn-primary">
                Create Project
            </a>
        </div>
        {% endif %}
    </section>

    <!-- Recent Activity -->
    {% if recent_activity %}
    <section class="content-section">
        <h2>Recent Activity</h2>
        <div class="activity-list">
            {% for item in recent_activity %}
            <div class="activity-item">
                <div class="activity-content">
                    <div class="activity-title">
                        <a href="/plans/{{ item.plan_file.id }}">{{ item.plan_file.name }}</a>
                        <span class="activity-version">v{{ item.plan_file.current_version }}</span>
                    </div>
                    <div class="activity-meta">
                        <span>in <a href="/projects/{{ item.project.id }}">{{ item.project.name }}</a></span>
                        <span class="activity-time">{{ item.updated_at|relative_time if item.updated_at }}</span>
                    </div>
                </div>
            </div>
            {% endfor %}
        </div>
    </section>
    {% endif %}
</div>
{% endblock %}