{# poll_url and poll_interval come from status_view.with_poll, which builds
   the URL with status_view.poll_url; this template composes no URL.  The
   poll carries the token of what this rendering shows, so an unchanged poll
   is answered 204 and focus inside the area stays put.

   tabindex="-1" is on every rendering because htmx restores focus by id only
   to a focusable element.  autofocus is only on an action's response: on a
   poll it would pull focus out of the Title box every second.  No line is
   aria-busy, because a screen reader may hold back a busy subtree inside a
   live region and "Scanning..." would never be heard; class="busy-line" draws
   the spinner instead. #}
<div id="status-area" tabindex="-1"{% if focus_status_area %} autofocus{% endif %}
     {% if job and job.is_active %}
     hx-get="{{ poll_url }}"
     hx-trigger="every {{ poll_interval }}s"
     hx-swap="outerHTML"
     {% endif %}>
  {% if job %}
    {% if job.is_busy %}
      {# Built on the server: templates compose no vocabulary. #}
      <p class="busy-line">{{ busy_line }}</p>
    {% elif job.state == JobState.AWAITING_FLIP %}
      {# The controls are emitted only for the owner, or for anyone when the job
         has no owner token; never hide them with CSS instead.  The title gate
         is the other way round: a job with no owner token is answerable by
         anyone but shows its title to no one.  There is
         deliberately no cancel control or second timer here: the flip timeout
         already covers a closed tab.  non_owner_line and the waiting lines
         below end in a full stop, not an ellipsis, on purpose: nothing is
         happening on this viewer's behalf. #}
      {% if flip_answer %}
      <p class="busy-line">{{ flip_answer | flip_answer_label }}</p>
      {% elif is_owner %}
      {% include "partials/flip.html" %}
      {% else %}
      <p>{{ non_owner_line }}</p>
      {% endif %}
    {% elif job.state in pass_wait_states %}
      {# The same owner gate as the flip prompt.  Before the worker publishes
         the question the owner sees busy_line, the state's progress wording,
         not non_owner_line.  Neither waiting line is a busy-line: a spinner
         makes a scan that waits for a person look hung. #}
      {% if pass_answer %}
      <p class="busy-line">{{ pass_answer | pass_answer_label }}</p>
      {% elif is_owner and pass_copy %}
      {% include "partials/pages_prompt.html" %}
      {% elif not is_owner %}
      <p>{{ non_owner_line }}</p>
      {% else %}
      <p>{{ busy_line }}</p>
      {% endif %}
    {% elif job.state == JobState.DONE %}
      {# Guard on counts being None, never on a count's truthiness: error,
         cancel, a refused submit and rows older than the count columns leave
         them NULL, while a measured 0 renders as 0.  A warned upload reads
         amber and is not an alert: it is a degraded success. #}
      {% if job.warning %}
      <p class="status-fallback">&#9888; {{ job.state | outcome_line(job.warning, job.title) }}</p>
      <p class="status-fallback">{{ job.warning }}</p>
      {% else %}
      <p class="status-done">&#10003; {{ job.state | outcome_line(job.warning, job.title) }}</p>
      {% endif %}
      {% set counts = job | page_counts %}
      {% if counts %}<p class="page-counts">{{ counts }}</p>{% endif %}
      {% set removed = job | removed_pages %}
      {% if removed %}<p class="page-counts">{{ removed }}</p>{% endif %}
      {% if terminal_reload %}{% include "partials/terminal_reload.html" %}{% endif %}
    {% elif job.state == JobState.FALLBACK %}
      <p class="status-fallback">&#8594; {{ job.state | outcome_line(job.warning, job.title) }}</p>
      {% if job.warning %}
      <p class="status-fallback">{{ job.warning }}</p>
      {% endif %}
      {% set counts = job | page_counts %}
      {% if counts %}<p class="page-counts">{{ counts }}</p>{% endif %}
      {% set removed = job | removed_pages %}
      {% if removed %}<p class="page-counts">{{ removed }}</p>{% endif %}
      {% if terminal_reload %}{% include "partials/terminal_reload.html" %}{% endif %}
    {% elif job.state == JobState.CANCELLED %}
      {# A cancel is a deliberate stop, not a failure, so it is not announced as an alert. #}
      <p class="status-cancelled">&#8856; Cancelled: {{ job.title }}</p>
      {% if terminal_reload %}{% include "partials/terminal_reload.html" %}{% endif %}
    {% elif job.state == JobState.ERROR %}
      {# The alert wraps the next step as well as the sentence, so a screen
         reader hears it; <details> stays outside, so "Technical details" is
         not announced.  job.error comes from the job view, which has already
         replaced every host path.  A NULL error_category is a row from before
         categories and keeps the plain shape.  An amber category may already
         be in paperless-ngx, so it is not an alert: red says "scan it again". #}
      {% if job.error_category %}
      {% if job.error_category | is_amber_category %}
      <p class="status-fallback">&#9888; {{ job.error_category | error_message }}</p>
      <p>{{ job.error_category | error_next_step }}</p>
      {% else %}
      <div role="alert">
        <p class="status-error">&#10007; {{ job.error_category | error_message }}</p>
        <p>{{ job.error_category | error_next_step }}</p>
      </div>
      {% endif %}
      <details class="tech-details">
        <summary>Technical details</summary>
        <p>{{ job.error }}</p>
        <p>Category: {{ job.error_category }}</p>
        <p>Job: {{ job.id }}</p>
      </details>
      {% else %}
      <p role="alert" class="status-error">&#10007; Error: {{ job.error }}</p>
      {% endif %}
      {% if terminal_reload %}{% include "partials/terminal_reload.html" %}{% endif %}
    {% endif %}
    {% if job.thumbnail %}
      <img src="data:image/jpeg;base64,{{ job.thumbnail }}" alt="First page preview" class="thumbnail">
    {% endif %}
  {% else %}
    {# idle_line stays plain text even when it carries the blocked reason: the
       red reason already sits under the button.  On the full page an ended
       job arrives as last_job and is reported muted, as the past, so a fresh
       page never presents an old result as news. #}
    <p>{{ idle_line }}</p>
    {% if last_job %}
    <p class="last-scan">{{ last_scan_line }}</p>
    {% if last_scan_detail %}<p class="last-scan">{{ last_scan_detail }}</p>{% endif %}
    {% if last_job.state == JobState.ERROR and last_job.error_category %}
    <details class="tech-details">
      <summary>Technical details</summary>
      <p>{{ last_job.error }}</p>
      <p>Category: {{ last_job.error_category }}</p>
      <p>Job: {{ last_job.id }}</p>
    </details>
    {% endif %}
    {% endif %}
  {% endif %}
</div>