{% extends "base.html" %}

{% block title %}Dashboard{% endblock %}

{% block content %}

        <div class="page-header">
            <div>
                <h1 class="page-title">Dashboard</h1>
                <p class="page-subtitle">Overview of document processing, extraction coverage, and line item review status.</p>
            </div>
        </div>

        <div class="card">
            <div class="button-row">
                <a class="button-link primary" href="/documents/">Open documents</a>
                <a class="button-link" href="/queue/">Open queue</a>
                <a class="button-link" href="/line-items/">Open line items</a>
                <a class="button-link" href="/line-items/summary">Open summary</a>
                <a class="button-link" href="/ingest/">Open ingest</a>
            </div>
        </div>

        <div class="card">
            <h2 class="card-title">Document overview</h2>
            <div class="meta-grid">
                <div class="meta-item"><span class="meta-label">Total documents</span>{{ total_documents }}</div>
                <div class="meta-item"><span class="meta-label">Active documents</span>{{ active_documents }}</div>
                <div class="meta-item"><span class="meta-label">Reviewed documents</span>{{ reviewed_documents }}</div>
                <div class="meta-item"><span class="meta-label">Pending OCR/review</span>{{ pending_review_documents }}</div>
                <div class="meta-item"><span class="meta-label">Extracted field rows</span>{{ extracted_documents }}</div>
                <div class="meta-item"><span class="meta-label">Trashed documents</span>{{ trashed_documents }}</div>
            </div>
        </div>

        <div class="card">
            <h2 class="card-title">Line item overview</h2>
            <div class="meta-grid">
                <div class="meta-item"><span class="meta-label">Total line items</span>{{ total_line_items }}</div>
                <div class="meta-item"><span class="meta-label">Cocktail items</span>{{ cocktail_count }}</div>
                <div class="meta-item"><span class="meta-label">Rated cocktails</span>{{ rated_cocktails }}</div>
                <div class="meta-item"><span class="meta-label">Pending cocktail ratings</span>{{ pending_cocktail_reviews }}</div>
                <div class="meta-item"><span class="meta-label">Cocktails marked N/A</span>{{ na_cocktails }}</div>
                <div class="meta-item"><span class="meta-label">Average cocktail rating</span>{{ avg_cocktail_rating or "—" }}</div>
            </div>
        </div>

        <div class="card">
            <h2 class="card-title">Recent documents</h2>
            {% if recent_documents %}
                <div class="table-wrap">
                    <table>
                        <thead>
                            <tr>
                                <th>Document</th>
                                <th>Type</th>
                                <th>Review status</th>
                                <th>Updated</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for doc in recent_documents %}
                            <tr>
                                <td><a href="/documents/{{ doc.document_id }}">{{ doc.document_id }}</a></td>
                                <td>{{ doc.document_type }}</td>
                                <td><span class="badge {% if doc.review_status == 'reviewed' %}reviewed{% else %}pending{% endif %}">{{ doc.review_status }}</span></td>
                                <td>{{ doc.updated_at }}</td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            {% else %}
                <p class="empty-state">No documents found.</p>
            {% endif %}
        </div>

        <div class="card">
            <h2 class="card-title">Recent line items</h2>
            {% if recent_line_items %}
                <div class="table-wrap">
                    <table>
                        <thead>
                            <tr>
                                <th>Date</th>
                                <th>Merchant</th>
                                <th>Item</th>
                                <th>Category</th>
                                <th>Total</th>
                                <th>Rating</th>
                                <th>Status</th>
                                <th>Document</th>
                            </tr>
                        </thead>
                        <tbody>
                            {% for row in recent_line_items %}
                            <tr>
                                <td>{{ row.transaction_date }}</td>
                                <td>{{ row.merchant }}</td>
                                <td>{{ row.description }}</td>
                                <td>{{ row.category }}</td>
                                <td>{{ row.line_total }}</td>
                                <td>{{ row.quality_rating }}</td>
                                <td>{{ row.quality_status }}</td>
                                <td><a href="/documents/{{ row.document_id }}?tab=extracted-fields">{{ row.document_id }}</a></td>
                            </tr>
                            {% endfor %}
                        </tbody>
                    </table>
                </div>
            {% else %}
                <p class="empty-state">No line items found.</p>
            {% endif %}
        </div>
    
{% endblock %}