{% load l10n %}
<table class="dja-queue-table">
  <caption>{{ caption }}</caption>
  <tbody>
    {% for row in rows %}
      <tr class="dja-queue-row{% if row.is_oldest %} dja-queue-row--oldest{% endif %}">
        <th scope="row" class="dja-queue-row__label{% if row.is_unclaimed %} dja-queue-row__label--unclaimed{% endif %}">
          <span class="dja-queue-row__name">
            {% if row.query %}
              <a href="{{ changelist_url }}?{{ row.query }}">{{ row.label }}</a>
            {% else %}
              {{ row.label }}
            {% endif %}
          </span>
          {% if row.is_oldest %}<span class="dja-queue-row__flag">&#9888;&#65038; needs attention</span>{% endif %}
        </th>
        <td class="dja-queue-row__bar">
          {% if row.count %}
            <span class="dja-queue-bar" aria-hidden="true"
                  style="width: {{ row.share|unlocalize }}%{% if row.ramp %}; --dja-bar: var(--dja-age-{{ row.ramp }}){% endif %}"></span>
          {% endif %}
        </td>
        <td class="dja-queue-row__count">{{ row.count }}</td>
      </tr>
    {% endfor %}
  </tbody>
</table>