{% extends "base.html" %}
{% block title %}Sentinel — Run #{{ run.id }}{% endblock %}
{% block content %}
<a href="/runs" class="back-link">&larr; All Runs</a>

<div class="page-header">
  <h1>Run #{{ run.id }}</h1>
  <p class="subtitle">
    <span class="text-mono">{{ run.repo_path }}</span> &middot;
    {{ run.started_at.strftime('%Y-%m-%d %H:%M') if run.started_at else '—' }} &middot;
    {{ run.finding_count }} finding{{ 's' if run.finding_count != 1 else '' }}
    &middot; <span class="badge badge-scope">{{ run.scope.value }}</span>
    {% if run.commit_sha %} &middot; <span class="text-mono">{{ run.commit_sha[:8] }}</span>{% endif %}
  </p>
</div>

{% set counts = {'critical': grouped['critical']|length, 'high': grouped['high']|length, 'medium': grouped['medium']|length, 'low': grouped['low']|length} %}
<div class="stat-grid">
  <div class="stat-card">
    <div class="stat-label">Critical</div>
    <div class="stat-value critical">{{ counts.critical }}</div>
  </div>
  <div class="stat-card">
    <div class="stat-label">High</div>
    <div class="stat-value high">{{ counts.high }}</div>
  </div>
  <div class="stat-card">
    <div class="stat-label">Medium</div>
    <div class="stat-value amber">{{ counts.medium }}</div>
  </div>
  <div class="stat-card">
    <div class="stat-label">Low</div>
    <div class="stat-value">{{ counts.low }}</div>
  </div>
</div>

<div class="card mb-2">
  <form method="get" action="/runs/{{ run.id }}" class="filter-bar">
    <label>Severity
      <select name="severity">
        <option value="">All</option>
        {% for s in ['critical', 'high', 'medium', 'low'] %}
        <option value="{{ s }}" {{ 'selected' if filter_severity == s else '' }}>{{ s }}</option>
        {% endfor %}
      </select>
    </label>
    <label>Status
      <select name="status">
        <option value="">All</option>
        {% for s in all_statuses %}
        <option value="{{ s }}" {{ 'selected' if filter_status == s else '' }}>{{ s }}</option>
        {% endfor %}
      </select>
    </label>
    <label>Detector
      <select name="detector">
        <option value="">All</option>
        {% for d in all_detectors %}
        <option value="{{ d }}" {{ 'selected' if filter_detector == d else '' }}>{{ d }}</option>
        {% endfor %}
      </select>
    </label>
    <button type="submit" class="btn btn-sm">Filter</button>
    {% if filter_severity or filter_status or filter_detector %}
    <a href="/runs/{{ run.id }}" class="btn btn-sm">Clear</a>
    {% endif %}
  </form>
</div>

{% if other_runs %}
<div class="card mb-2">
  <form class="filter-bar" onsubmit="event.preventDefault(); var sel = this.querySelector('select'); if(sel.value) window.location='/runs/{{ run.id }}/compare/'+sel.value;">
    <label>Compare with
      <select name="base_run">
        <option value="">Select a run...</option>
        {% for r in other_runs %}
        <option value="{{ r.id }}">Run #{{ r.id }} — {{ r.started_at.strftime('%Y-%m-%d %H:%M') if r.started_at else '?' }} ({{ r.finding_count }} findings)</option>
        {% endfor %}
      </select>
    </label>
    <button type="submit" class="btn btn-sm">Compare</button>
  </form>
</div>
{% endif %}

{% if not findings %}
<div class="empty-state">
  <h2>No findings</h2>
  <p>{% if filter_severity or filter_status or filter_detector %}No findings match the current filters.{% else %}This run produced no findings. The codebase looks clean!{% endif %}</p>
</div>
{% else %}

<div id="bulk-bar" class="bulk-bar" style="display: none;">
  <span id="bulk-count">0 selected</span>
  <button type="button" class="btn btn-sm" onclick="submitBulk('approve')">Approve Selected</button>
  <button type="button" class="btn btn-sm btn-muted" onclick="submitBulk('suppress')">Suppress Selected</button>
</div>

<form id="bulk-form"
      hx-post="/runs/{{ run.id }}/bulk-action"
      hx-target="#toast-container"
      hx-swap="beforeend">
  <input type="hidden" name="action" id="bulk-action-input" value="">

{% for severity in ['critical', 'high', 'medium', 'low'] %}
{% if grouped[severity] %}
<div class="severity-group">
  <h2>
    <label class="bulk-select-group">
      <input type="checkbox" class="bulk-group-toggle" data-severity="{{ severity }}"
             onchange="toggleGroup(this, '{{ severity }}')">
      <span class="badge badge-{{ severity }}">{{ severity }}</span>
    </label>
    {{ grouped[severity]|length }} finding{{ 's' if grouped[severity]|length != 1 else '' }}
  </h2>

  {% for item in clustered[severity] %}
  {% if item.findings is defined %}
  {# This is a FindingCluster — render as collapsible group #}
  <details class="finding-cluster">
    <summary class="cluster-summary">
      {% if item.cluster_type == "pattern" %}
      <span class="cluster-icon">🔗</span>
      <span class="cluster-label">{{ item.findings|length }} related: {{ item.pattern_label }}</span>
      {% else %}
      <span class="cluster-icon">📁</span>
      <span class="cluster-label">{{ item.findings|length }} findings in <code>{{ item.common_path }}</code></span>
      {% endif %}
    </summary>
    <div class="cluster-body">
      {% for f in item.findings %}
      <div class="finding-row">
        <input type="checkbox" name="finding_ids" value="{{ f.id }}" class="bulk-checkbox severity-{{ severity }}"
               onchange="updateBulkCount()">
        <span class="badge badge-{{ f.status.value }}">{{ f.status.value }}</span>
        <span class="finding-title"><a href="/findings/{{ f.id }}">{{ f.title }}</a></span>
        <span class="finding-meta">{{ f.detector }}</span>
        {% if f.file_path %}
        <span class="finding-location">{{ f.file_path }}{% if f.line_start %}:{{ f.line_start }}{% endif %}</span>
        {% endif %}
      </div>
      {% endfor %}
    </div>
  </details>
  {% else %}
  {# This is a standalone Finding #}
  <div class="finding-row">
    <input type="checkbox" name="finding_ids" value="{{ item.id }}" class="bulk-checkbox severity-{{ severity }}"
           onchange="updateBulkCount()">
    <span class="badge badge-{{ item.status.value }}">{{ item.status.value }}</span>
    <span class="finding-title"><a href="/findings/{{ item.id }}">{{ item.title }}</a></span>
    <span class="finding-meta">{{ item.detector }}</span>
    {% if item.file_path %}
    <span class="finding-location">{{ item.file_path }}{% if item.line_start %}:{{ item.line_start }}{% endif %}</span>
    {% endif %}
  </div>
  {% endif %}
  {% endfor %}
</div>
{% endif %}
{% endfor %}

</form>

{% endif %}
{% endblock %}