{% extends "base.html" %}
{% import "_empty.html" as empty %}
{% block title %}Freshness{% endblock %}

{% block topbar_main %}
<h1>Freshness</h1>
  <span class="sub">Measured from git, on every page load</span>
{% endblock %}

{% block topbar_actions %}
<div class="listctl" id="listctl">
<label class="sr-only" for="drift-filter">Filter</label>
<input class="input input-sm" type="search" id="drift-filter" data-list-filter
       placeholder="Filter plans…" autocomplete="off" spellcheck="false">
<label class="sr-only" for="drift-sort">Sort</label>
<select class="btn btn-sm" id="drift-sort" data-list-sort>
  <option value="drift:desc">Sort: Most drifted</option>
  <option value="name:asc">Sort: Name</option>
  <option value="project:asc">Sort: Project</option>
</select>
</div>
<a class="btn btn-primary" href="/freshness">Re-scan now</a>
{% endblock %}

{% block content %}
<div class="pane">

  <div class="stat-grid">
    <div class="stat"><div class="v tnum"><span class="dot d-fresh"></span><span data-tally="fresh">{{ tally.fresh }}</span></div>
      <div class="k">Fresh</div></div>
    <div class="stat"><div class="v tnum"><span class="dot d-aging"></span><span data-tally="aging">{{ tally.aging }}</span></div>
      <div class="k">Aging</div></div>
    <div class="stat"><div class="v tnum"><span class="dot d-suspect"></span><span data-tally="suspect">{{ tally.suspect }}</span></div>
      <div class="k">Suspect</div></div>
    <div class="stat"><div class="v tnum"><span class="dot d-stale"></span><span data-tally="stale">{{ tally.stale }}</span></div>
      <div class="k">Stale</div></div>
  </div>

  {% if attention or streaming %}
  <div class="card" data-listgroup{% if streaming %} data-freshness-stream{% endif %}>
    <div class="card-head">
      Needs attention
      <span class="pill pill-suspect tnum" data-drift-count>{{ pager.total }}</span>
      <span class="note">ordered by evidence, not by date</span>
      {# Judging one plan is several git processes. The page arrives first
         and this says how far along the rest is, rather than leaving a
         blank table that might be finished or might be broken. #}
      <span class="note" data-scan-progress hidden></span>
    </div>
    <div class="tablewrap">
      <div class="grid-head cols-freshness">
        <span>Plan</span><span>Drift</span><span>Evidence</span><span>Project</span><span></span>
      </div>
      <div data-list>
      {% for row in attention %}{% include "_freshness_row.html" %}{% endfor %}
      </div>
      <div class="empty-filter" data-list-empty hidden>Nothing matches that filter.</div>
      {% if streaming %}<div class="pager" data-list-pager hidden></div>{% else %}{% include "_pager.html" %}{% endif %}
      {% if streaming %}
      {# The same state as the server-rendered one below, reached the other
         way: this page streams its verdicts, so on a clean repository the
         table above stays empty and the answer arrives from the scan. #}
      <div class="empty empty-in" data-scan-clean hidden>
        {{ empty.glyph('clear') }}
        <h2>Nothing has drifted</h2>
        <p class="hint">Every plan still lines up with the code it describes.</p>
      </div>
      <noscript><div class="empty-filter">This table is filled in as each plan is
        checked, which needs JavaScript.
        <a href="/freshness?full=1">Load it all at once instead</a>.</div></noscript>
      {% endif %}
    </div>
  </div>
  {% else %}
  {% call empty.state('clear', 'Nothing has drifted') %}
    <p>Every plan still lines up with the code it describes. This page fills itself
       in as commits land.</p>
  {% endcall %}
  {% endif %}

  <div class="footnote">
    <span class="i" aria-hidden="true">i</span>
    The decay is measured, not guessed: dead references, commits since the anchor,
    and age — the same evidence <code class="mono">flanner freshness</code> prints.
  </div>

</div>
{% endblock %}