{% extends "app_home/base.html" %}
{% load static %}
{% load i18n %}

{% block navbar_app %}
{% include 'app_home/_sidebar.html' %}
{% endblock %}


{% block title %}
<h2>{% translate "Logs" %}</h2>
<small class="text-muted">{{ count }} {% translate "entries" %}</small>
<hr>
{% endblock %}


{% block content %}

<!-- FILTERS -->
<form method="get" action="{% url 'app_home:log' %}" class="row g-2 align-items-end mb-3">

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-level">{% translate "Level" %}</label>
    <select class="form-select form-select-sm" id="f-level" name="level">
      <option value="">{% translate "all" %}</option>
      {% for l in levels %}<option value="{{ l }}" {% if params.level|upper == l %}selected{% endif %}>{{ l }}+</option>{% endfor %}
    </select>
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-outcome">{% translate "Outcome" %}</label>
    <select class="form-select form-select-sm" id="f-outcome" name="outcome">
      <option value="">{% translate "all" %}</option>
      {% for o in outcomes %}<option value="{{ o }}" {% if params.outcome == o %}selected{% endif %}>{{ o }}</option>{% endfor %}
    </select>
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-channel">{% translate "Channel" %}</label>
    <select class="form-select form-select-sm" id="f-channel" name="channel">
      <option value="">{% translate "all" %}</option>
      {% for c in channels %}<option value="{{ c }}" {% if params.channel == c %}selected{% endif %}>{{ c }}</option>{% endfor %}
    </select>
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-domain">{% translate "Domain" %}</label>
    <input class="form-control form-control-sm cv-log-filter-sm" id="f-domain" name="domain" value="{{ params.domain|default:'' }}">
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-action">{% translate "Action" %}</label>
    <input class="form-control form-control-sm cv-log-filter" id="f-action" name="action" value="{{ params.action|default:'' }}" placeholder="instance.">
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-actor">{% translate "Actor" %}</label>
    <input class="form-control form-control-sm cv-log-filter" id="f-actor" name="actor" value="{{ params.actor|default:'' }}">
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-target">{% translate "Target" %}</label>
    <input class="form-control form-control-sm cv-log-filter" id="f-target" name="target" value="{{ params.target|default:'' }}" placeholder="type:id">
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-since">{% translate "From" %}</label>
    <input class="form-control form-control-sm" type="date" id="f-since" name="since" value="{{ params.since|default:'' }}">
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-until">{% translate "To" %}</label>
    <input class="form-control form-control-sm" type="date" id="f-until" name="until" value="{{ params.until|default:'' }}">
  </div>

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-q">{% translate "Text" %}</label>
    <input class="form-control form-control-sm cv-log-filter" type="search" id="f-q" name="q" value="{{ params.q|default:'' }}" placeholder="{% translate 'message, target, reason' %}">
  </div>

  {% if params.request_id %}<input type="hidden" name="request_id" value="{{ params.request_id }}">{% endif %}

  <div class="col-auto">
    <label class="form-label small mb-0" for="f-size">{% translate "Per page" %}</label>
    <select class="form-select form-select-sm" id="f-size" name="size">
      {% for s in sizes %}<option value="{{ s }}" {% if s == size %}selected{% endif %}>{{ s }}</option>{% endfor %}
    </select>
  </div>

  <div class="col-auto">
    <button class="btn btn-sm btn-success" type="submit"><i class="fa fa-search"></i> {% translate "Filter" %}</button>
    <a class="btn btn-sm btn-outline-secondary" href="{% url 'app_home:log' %}">{% translate "Reset" %}</a>
  </div>

  <div class="col-auto ms-auto">
    <div class="btn-group">
      <a class="btn btn-sm btn-outline-primary dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">
        <i class="fa fa-download"></i> {% translate "Export" %}</a>
      <div class="dropdown-menu dropdown-menu-end">
        <a class="dropdown-item" href="{% url 'app_home:log_export' 'csv' %}?{{ query_string }}">CSV</a>
        <a class="dropdown-item" href="{% url 'app_home:log_export' 'json' %}?{{ query_string }}">JSON</a>
        <span class="dropdown-item-text small text-muted">{% translate "Current filters, max" %} {{ export_max }}</span>
      </div>
    </div>
    {% if 'p_log_admin' in aaa.perms %}
    <button type="button" class="btn btn-sm btn-outline-danger ms-2" data-bs-toggle="modal" data-bs-target="#logPurgeModal">
      <i class="fa fa-trash"></i> {% translate "Purge" %}</button>
    {% endif %}
  </div>

</form>

{% if params.request_id %}
<div class="alert alert-info py-1 small">
  {% translate "Events of request" %} <code>{{ params.request_id }}</code>
  <a class="ms-2" href="{% url 'app_home:log' %}">{% translate "clear" %}</a>
</div>
{% endif %}


<!-- EVENTS -->
<table class="table table-sm table-striped table-hover small">
<thead><tr>
  <th>{% translate "Date" %}</th>
  <th>{% translate "Level" %}</th>
  <th>{% translate "Channel" %}</th>
  <th>{% translate "Actor" %}</th>
  <th>{% translate "IP" %}</th>
  <th>{% translate "Action" %}</th>
  <th>{% translate "Outcome" %}</th>
  <th>{% translate "Reason" %}</th>
  <th>{% translate "Target" %}</th>
  <th class="text-end">{% translate "Count" %}</th>
  <th class="text-end">ms</th>
  <th>{% translate "Message" %}</th>
</tr></thead>
<tbody>
{% for e in events %}
<tr class="cv-log-row" data-bs-toggle="modal" data-bs-target="#logEventModal"
    hx-get="{% url 'app_home:log_event' e.id %}" hx-target="#logEventBody" hx-swap="innerHTML">
  <td class="text-nowrap">{{ e.created|date:'Y-m-d H:i:s' }}</td>
  <td><span class="badge cv-log-level-{{ e.level|lower }}">{{ e.level }}</span></td>
  <td>{{ e.channel }}</td>
  <td>{{ e.actor }}{% if e.actor_effective %} <span class="text-muted">({{ e.actor_effective }})</span>{% endif %}</td>
  <td>{{ e.client_ip }}</td>
  <td>{{ e.action }}</td>
  <td><span class="badge cv-log-outcome-{{ e.outcome }}">{{ e.outcome }}</span></td>
  <td>{{ e.reason }}</td>
  <td>{% if e.target_type or e.target_id %}{{ e.target_type }}:{{ e.target_id|truncatechars:40 }}{% endif %}</td>
  <td class="text-end">{{ e.count|default_if_none:'' }}</td>
  <td class="text-end">{{ e.duration_ms|default_if_none:'' }}</td>
  <td class="cv-log-msg">{{ e.message|truncatechars:80 }}</td>
</tr>
{% empty %}
<tr><td colspan="12" class="text-muted">{% translate "No event matches these filters." %}</td></tr>
{% endfor %}
</tbody>
</table>


<!-- PAGINATION -->
<nav>
  <ul class="pagination pagination-sm">
    {% if page_prev %}
    <li class="page-item"><a class="page-link" href="?{{ query_string }}&size={{ size }}&page={{ page_prev }}">&laquo; {% translate "Newer" %}</a></li>
    {% else %}
    <li class="page-item disabled"><span class="page-link">&laquo; {% translate "Newer" %}</span></li>
    {% endif %}
    <li class="page-item active"><span class="page-link">{{ page }}</span></li>
    {% if page_next %}
    <li class="page-item"><a class="page-link" href="?{{ query_string }}&size={{ size }}&page={{ page_next }}">{% translate "Older" %} &raquo;</a></li>
    {% else %}
    <li class="page-item disabled"><span class="page-link">{% translate "Older" %} &raquo;</span></li>
    {% endif %}
  </ul>
</nav>


<!-- EVENT DETAIL MODAL (body loaded by HTMX) -->
<div class="modal fade" id="logEventModal" tabindex="-1" aria-labelledby="logEventLabel" aria-hidden="true">
  <div class="modal-dialog modal-lg modal-dialog-scrollable">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="logEventLabel">{% translate "Event" %}</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body" id="logEventBody">
        <span class="text-muted">{% translate "Loading..." %}</span>
      </div>
    </div>
  </div>
</div>


{% if 'p_log_admin' in aaa.perms %}
<!-- PURGE MODAL -->
<div class="modal fade" id="logPurgeModal" tabindex="-1" aria-labelledby="logPurgeLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="logPurgeLabel">{% translate "Purge logs" %}</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <p>{% translate "Retention: delete events older than the configured keep days per level, and above the maximum number of entries." %}</p>
        <p class="mb-0 text-danger">{% translate "All: delete every stored event. This cannot be undone." %}</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">{% translate "Cancel" %}</button>
        <form method="post" action="{% url 'app_home:log' %}" class="cv-form-inline">
          {% csrf_token %}
          <button type="submit" name="purge" value="retention" class="btn btn-primary">{% translate "Apply retention" %}</button>
          <button type="submit" name="purge" value="all" class="btn btn-danger">{% translate "Purge all" %}</button>
        </form>
      </div>
    </div>
  </div>
</div>
{% endif %}

{% endblock %}