{% extends "base.html" %}

{% block extra_head %}
<link rel="stylesheet" href="{{ static_url('/static/css/sidebar.css') }}">
<link rel="stylesheet" href="{{ static_url('/static/css/deepsearch.css') }}">
{% endblock %}

{% block content %}
<div class="ds-layout">
    <aside class="sidebar-card" role="navigation" aria-label="DeepSearch">
        <div class="sidebar-heading" role="heading" aria-level="2">DeepSearch</div>
        <div class="sidebar-nav">
            <a href="/tools" class="sidebar-link">
                <span class="icon">&#x1F9F0;</span>
                All tools
            </a>
            <a href="/tools/deepsearch" class="sidebar-link">
                <span class="icon">&#x1F9E0;</span>
                Research
            </a>
            <a href="/tools/deepsearch/history" class="sidebar-link active">
                <span class="icon">&#x1F553;</span>
                History
            </a>
        </div>
    </aside>

    <div class="ds-main">
        <header class="ds-header">
            <h1><span class="icon">&#x1F553;</span> DeepSearch history</h1>
            <p>Every research run you have started, newest first. Reopen a finished run to read its
               report again or continue the grounded chat over its sources.</p>
        </header>

        {% if sessions %}
        <section class="ds-history-list">
            {% for item in sessions %}
            <article class="ds-card ds-history-item">
                <div class="ds-history-item-head">
                    <h2 class="ds-history-query">{{ item.query or "Untitled research" }}</h2>
                    <span class="ds-history-status ds-status-{{ item.status }}">{{ item.status }}</span>
                </div>
                {% if item.summary %}
                <p class="ds-history-summary">{{ item.summary[:220] }}{{ "…" if item.summary|length > 220 else "" }}</p>
                {% endif %}
                <div class="ds-metrics" role="group" aria-label="Research metrics">
                    {% if item.score is not none %}<span class="ds-metric"><strong>{{ item.score }}</strong> score</span>{% endif %}
                    {% if item.confidence is not none %}<span class="ds-metric"><strong>{{ item.confidence }}</strong> confidence</span>{% endif %}
                    <span class="ds-metric"><strong>{{ item.page_count }}</strong> sources</span>
                </div>
                <div class="ds-history-item-foot">
                    <time data-dt datetime="{{ item.created_at }}">{{ local_dt(item.created_at) if item.created_at else "" }}</time>
                    {% if item.available %}
                    <a class="btn btn-primary" href="{{ item.reopen_url }}">
                        {{ "Reopen and chat" if item.chat_available else "Open" }}
                    </a>
                    {% else %}
                    <span class="ds-history-expired" title="This research run's report and chat have expired and are no longer available.">Expired</span>
                    {% endif %}
                </div>
            </article>
            {% endfor %}
        </section>
        {% else %}
        <section class="ds-card">
            <p>No DeepSearch runs yet. <a href="/tools/deepsearch">Start your first research</a>.</p>
        </section>
        {% endif %}
    </div>
</div>
{% endblock %}