{%- import 'ui/kit.html' as kit %}{% import 'ui/broker/_fmt.html' as fmt -%}
{{ fmt.flash(message, tone) }}
{% call kit.list('apps', cols, page, PER_PAGE, total, 'No applications match.') %}
{%- for a in rows %}
<tr class="rowlink" onclick="dj.get({{ fmt.js('/apps/' ~ (a.application|urlencode)) }}, '#view', {push:true})">
  <td class="cb-col" onclick="event.stopPropagation()"><input type="checkbox" class="cb-row" value="{{ a.application }}"></td>
  <td data-col="application" class="fw">{{ a.application }}</td>
  <td data-col="endpoint" class="mono dim">{{ a.endpoint }}</td>
  <td data-col="role" class="dim">{{ a.role }}</td>
  <td data-col="owned">{{ a.nact }}</td>
  <td data-col="subs">{{ a.nsub }}</td>
  <td data-col="evh">{{ a.ev_h }}</td>
  <td data-col="health"><span class="pill {{ a.health_cls }}">{{ a.health }}</span></td>
  <td data-col="activity">{% if a.spark %}<svg class="spark" viewBox="0 0 120 28" aria-hidden="true"><polyline points="{{ a.spark.points }}" fill="none" stroke="currentColor" stroke-width="1.5"/><circle cx="{{ a.spark.x }}" cy="{{ a.spark.y }}" r="2.5"/></svg>{% else %}<span class="dim">-</span>{% endif %}</td>
  <td data-col="seen" class="dim">{{ a.last_seen|ago }}</td>
  <td data-col="status">{{ kit.active_pill(a.active) }}</td>
</tr>
{%- endfor %}
{% endcall %}
{%- if created %}
<div id="modal" data-dj-oob>{% include 'ui/broker/app_created.html' %}</div>
{%- endif %}