{% from "components/ui.html" import pager %}
{# A page of messages. ``emails``: the account column, for lists across
   accounts. Without it, one account's list. ``selectable``: a tick box
   per message for the form ``batch``. ``open_as="drafts"``: links open
   the draft editor. #}
{% set opens = open_as if open_as is defined else "mail" %}
{% set ticks = selectable is defined and selectable %}
{% if messages %}
<div class="table-scroll">
  <table>
    <thead>
      <tr>
        {% if ticks %}<th class="tick"><span class="sr">Select</span></th>{% endif %}
        {% if emails is defined %}<th>Account</th>{% endif %}
        <th>From</th><th>Subject</th><th>Date</th><th></th>
      </tr>
    </thead>
    <tbody>
      {% for m in messages %}
      <tr class="{{ 'unread' if m.unread }}">
        {% if ticks %}<td class="tick"><input type="checkbox" name="ids" value="{{ m.id }}" form="batch" aria-label="Select {{ m.subject | or_missing }}" /></td>{% endif %}
        {% if emails is defined %}<td class="muted">{{ emails.get(m.account_id, m.account_id) }}</td>{% endif %}
        <td>{{ m.sender | address }}</td>
        <td class="name">
          <a href="/ui/accounts/{{ m.account_id }}/{{ opens }}/{{ m.id }}">{{ m.subject | or_missing }}</a>
          <span class="sub">{{ m.snippet | or_missing }}</span>
        </td>
        <td>{{ m.date | when }}</td>
        <td>
          {% if m.starred %}<span class="tag warn" title="starred">★</span>{% endif %}
          {% if m.has_attachments %}<span class="tag" title="has attachments">📎</span>{% endif %}
          {% if "$answered" in m.keywords %}<span class="tag" title="answered">↩</span>{% endif %}
        </td>
      </tr>
      {% endfor %}
    </tbody>
  </table>
</div>
{% else %}
<div class="empty">No messages{{ " match the search" if fields else "" }}.</div>
{% endif %}
{{ pager(pages) }}