{% extends layout %}{% import 'ui/kit.html' as kit %}
{% import 'ui/telemetry/_t.html' as t with context %}
{% block title %}Logs · amebo{% endblock %}
{% block content %}
{{ t.css() }}
{%- set total = totals.values()|sum %}
{%- set errors = totals.get('error', 0) + totals.get('fatal', 0) %}
<div class="section-head pin">
  <div>
    <h2>Logs</h2>
    <p class="sub">Every line your services emitted, correlated to the trace that produced it. A line carrying a trace id links straight to its waterfall, and from there to the business event that started the whole thing.</p>
  </div>
  {{ t.rng('/logs', w.key, {'s': service, 'sev': severity, 'q': q}) }}
</div>

<div class="kcards">
  <div class="kcard"><div class="kcard-h"><span class="kcard-l">Lines</span><span class="kcard-note">{{ w.label }}</span></div>
    <div class="kcard-b"><div class="kcard-v"><span class="kcard-n">{{ total }}</span></div></div>
    <div class="kcard-f"><span class="kcard-cmp">counted at ingest, not scanned</span></div></div>
  <div class="kcard"><div class="kcard-h"><span class="kcard-l">Errors and fatals</span></div>
    <div class="kcard-b"><div class="kcard-v"><span class="kcard-n {{ 'bad' if errors > 0 else '' }}">{{ errors }}</span></div></div>
    <div class="kcard-f"><span class="kcard-cmp">in this window</span></div></div>
  <div class="kcard"><div class="kcard-h"><span class="kcard-l">Showing</span></div>
    <div class="kcard-b"><div class="kcard-v"><span class="kcard-n">{{ lines|length }}</span></div></div>
    <div class="kcard-f"><span class="kcard-cmp">newest first, capped</span></div></div>
  <div class="kcard"><div class="kcard-h"><span class="kcard-l">Services</span></div>
    <div class="kcard-b"><div class="kcard-v"><span class="kcard-n">{{ seen|length }}</span></div></div>
    <div class="kcard-f"><span class="kcard-cmp">reporting telemetry</span></div></div>
</div>

<div class="panel tight">
  <h3>Volume <span class="panel-sub">stacked by severity, from the per-minute counters</span></h3>
  {%- set mx = ([1] + points|map(attribute='total')|list)|max %}
  <div class="lv-wrap">
    <div class="lv-scale"><span>{{ mx }}</span><span>0</span></div>
    <div class="lv">
    {%- for p in points %}
      <div class="lv-col" title="{{ h.clock(p.ts) }}: {{ p.total }} lines">
        {%- for sev in severities %}{% set n = p.by.get(sev, 0) %}{% if n %}<i class="{{ h.sev_class(sev) }}" style="height:{{ h.vol_height(n, mx) }}%"></i>{% endif %}{% endfor -%}
      </div>
    {%- endfor %}
    </div>
  </div>
  {%- set ax = h.axis(points) %}
  <div class="hstrip-ax"><span>{{ ax[0] }}</span><span>{{ ax[1] }}</span><span>{{ ax[2] }}</span></div>
</div>

<div class="toolbar">
  <select class="select" style="width:200px" onchange="dj.get('{{ h.url('/logs', w=w.key, sev=severity, q=q) }}&s=' + encodeURIComponent(this.value), '#view', {push:true})">
    {{ t.service_options(seen, service) }}
  </select>
  <div class="search-inline" style="min-width:320px">
    {{ kit.search_svg() }}
    <input class="q" type="search" placeholder="Search body, logger and every attribute value" value="{{ q }}"
           onchange="dj.get('{{ h.url('/logs', w=w.key, s=service, sev=severity) }}&q=' + encodeURIComponent(this.value), '#view', {push:true})">
  </div>
  <div class="grow"></div>
  <div class="sevchips">
    <button class="{{ 'sevchip active' if not severity else 'sevchip' }}" onclick="dj.get('{{ h.url('/logs', w=w.key, s=service, sev='', q=q) }}', '#view', {push:true})">all<span class="sevchip-n">{{ total }}</span></button>
    {%- for sev in severities %}
    {%- set n = totals.get(sev, 0) %}
    <button class="{{ 'sevchip active' if sev == severity else ('sevchip empty' if n == 0 else 'sevchip') }}" onclick="dj.get('{{ h.url('/logs', w=w.key, s=service, sev=sev, q=q) }}', '#view', {push:true})">
      <i class="{{ h.sev_class(sev) }}"></i>{{ sev }}<span class="sevchip-n">{{ n }}</span>
    </button>
    {%- endfor %}
  </div>
</div>

<div class="table-wrap">
{%- if not lines %}
  <div class="empty">
    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6"><path d="M4 6h16M4 12h16M4 18h10"/></svg>
    <p>No log lines match</p>
    <p class="hint">Send them with POST /v1/logs, either as stock OTLP protobuf from any OpenTelemetry SDK or as {"logs": [...]} JSON from anything that can curl.</p>
  </div>
{%- else %}
  <div class="logstream">{% for l in lines %}{{ t.logrow(l, True) }}{% endfor %}</div>
{%- endif %}
</div>
{% endblock %}