{{define "content"}}
{{$f := .Data.Filter}}

<div class="d-flex flex-wrap justify-content-between align-items-start gap-3 mb-4">
  <div>
    <h1 class="page-title">Audit Log</h1>
    <p class="text-body-secondary mb-0">
      Every administrative change, whether made in this interface, through the REST API,
      or on the command line. Passwords and token secrets are never recorded.
    </p>
  </div>
</div>

<div class="card">
  <div class="card-body">
    <form method="get" data-autosubmit class="row g-2 align-items-end mb-3">
      <div class="col-12 col-md-4">
        <label class="form-label small" for="aSearch">Search</label>
        <div class="input-group input-group-sm">
          <span class="input-group-text"><i class="bi bi-search"></i></span>
          <input type="search" class="form-control" id="aSearch" name="q" value="{{$f.Search}}"
                 placeholder="Action, object or detail...">
        </div>
      </div>
      <div class="col-6 col-md-3">
        <label class="form-label small" for="aObject">Object type</label>
        <select class="form-select form-select-sm" id="aObject" name="object">
          <option value="">All</option>
          {{range list "zone" "record" "network" "policy" "list" "domain" "settings" "cache" "admin" "api_token" "backup" "config" "query_log"}}
          <option value="{{.}}" {{if eq . $f.ObjectType}}selected{{end}}>{{title .}}</option>
          {{end}}
        </select>
      </div>
      <div class="col-6 col-md-3">
        <label class="form-label small" for="aSource">Source</label>
        <select class="form-select form-select-sm" id="aSource" name="source">
          <option value="">All</option>
          {{range list "web" "api" "cli" "system"}}
          <option value="{{.}}" {{if eq . $f.Source}}selected{{end}}>{{upper .}}</option>
          {{end}}
        </select>
      </div>
      <div class="col-auto">
        <a href="/audit" class="btn btn-sm btn-link">Clear filters</a>
      </div>
    </form>

    {{if .Data.Entries}}
    <div class="table-responsive">
      <table class="table table-hover align-middle table-compact">
        <thead>
          <tr>
            <th>Time</th><th>Actor</th><th>Source</th><th>Action</th>
            <th>Object</th><th>Details</th><th>Client</th>
          </tr>
        </thead>
        <tbody>
          {{range .Data.Entries}}
          <tr>
            <td class="small text-nowrap" title="{{datetime .Timestamp}}">{{timeAgo .Timestamp}}</td>
            <td class="small fw-semibold">{{.Actor}}</td>
            <td><span class="badge text-bg-light text-dark">{{upper .Source}}</span></td>
            <td class="mono small">{{.Action}}</td>
            <td class="small">
              {{if .ObjectName}}
              <span class="mono">{{truncate 40 .ObjectName}}</span>
              {{end}}
              {{if .ObjectType}}
              <div class="text-body-secondary">{{.ObjectType}}{{if .ObjectID}} #{{.ObjectID}}{{end}}</div>
              {{end}}
            </td>
            <td class="small text-body-secondary truncate-cell" title="{{.Details}}">{{.Details}}</td>
            <td class="mono small text-body-secondary">{{.ClientIP}}</td>
          </tr>
          {{end}}
        </tbody>
      </table>
    </div>
    {{template "pagination" dict "P" .Data.Pagination "Q" .Query}}
    {{else}}
      {{template "empty" dict "Icon" "bi-clipboard-check" "Title" "No audit entries match"
          "Message" "Administrative changes are recorded here as they happen. Clear the filters if you expected to see something."}}
    {{end}}
  </div>
</div>
{{end}}