{% extends layout %}{% import 'ui/kit.html' as kit %}
{% import 'ui/telemetry/_t.html' as t with context %}
{% block title %}Issues · amebo{% endblock %}
{% block content %}
{{ t.css() }}
<div class="section-head pin">
  <div>
    <h2>Issues</h2>
    <p class="sub">Errors grouped by fingerprint. The fingerprint excludes line numbers, so a refactor does not fork an issue, and includes the service, so the same bug in two services has two owners.</p>
  </div>
  <div class="hstats">
    {{ t.hstat(counts.total, 'issues') }}
    {{ t.hstat(counts.events, 'events') }}
    {{ t.hstat(counts.regressed, 'regressed', 'bad' if counts.regressed > 0 else '') }}
  </div>
</div>
<div class="toolbar">
  <div class="rng">
    {%- for label, value in (('Unresolved', 'unresolved'), ('Resolved', 'resolved'), ('Ignored', 'ignored'), ('All', '')) %}
    <button class="{{ 'rng-b active' if value == status else 'rng-b' }}" onclick="dj.get('{{ h.url('/issues', service=service, q=q, status=value) }}', '#view', {push:true})">{{ label }}</button>
    {%- endfor %}
  </div>
  <select class="select" style="width:200px" onchange="dj.get('{{ h.url('/issues', status=status, q=q) }}&service=' + encodeURIComponent(this.value), '#view', {push:true})">
    {{ t.service_options(seen, service) }}
  </select>
  <div class="search-inline" style="min-width:280px">
    {{ kit.search_svg() }}
    <input class="q" type="search" placeholder="Filter by title, culprit or transaction" value="{{ q }}"
           onchange="dj.get('{{ h.url('/issues', status=status, service=service) }}&q=' + encodeURIComponent(this.value), '#view', {push:true})">
  </div>
  <div class="grow"></div>
  <span class="dim">{{ issues|length }} shown</span>
</div>
<div class="table-wrap">
{%- if not issues %}
  <div class="empty">
    {{ t.check_svg() }}
    <p>No issues match this filter</p>
    <p class="hint">Errors arrive two ways: an OTel span event named "exception" on POST /v1/traces, or a report on POST /v1/errors. Neither needs an amebo SDK.</p>
  </div>
{%- else %}
  <table class="data issues">
    <thead><tr>
      <th>issue</th><th class="right">last seen</th><th class="right">age</th>
      <th>trend <span class="th-sub">14d</span></th><th class="right">events</th><th class="right">users</th>
      <th>priority</th><th>assignee</th>
    </tr></thead>
    <tbody>
    {%- for i in issues %}
      <tr class="rowlink" onclick="dj.get('/issues/{{ h.enc(i.fingerprint) }}', '#view', {push:true})">
        <td class="icell">
          <div class="ititle">{{ h.short(i.title, 110) }}</div>
          <div class="iculprit">{{ i.culprit or 'no in-app frame' }}</div>
          <div class="ichips">
            <span class="ichip svc">{{ i.service }}</span>
            {%- if i.status == 'regressed' %}<span class="ichip reg">regressed</span>{% endif %}
            {%- if i.transaction %}<span class="ichip">{{ i.transaction }}</span>{% endif %}
            {%- if i.last_release %}<span class="ichip">{{ i.last_release }}</span>{% endif %}
          </div>
        </td>
        <td class="right nowrap dim">{{ i.last_seen|ago }}</td>
        <td class="right nowrap dim">{{ i.first_seen|ago }}</td>
        <td class="trend-cell">{{ t.trend(daily.get(i.fingerprint, [])) }}</td>
        <td class="right fw">{{ i.count }}</td>
        <td class="right">{{ i.users }}</td>
        <td>{{ t.prio(i.priority) }}</td>
        <td>{{ t.assignee(i.assignee) }}</td>
      </tr>
    {%- endfor %}
    </tbody>
  </table>
{%- endif %}
</div>
{% endblock %}