{% extends "base.html" %}
{% block title %}Pattern review{% endblock %}
{% block content %}
<section class="page-head">
  <h1>Pattern review</h1>
  <p class="page-sub">
    Discovered patterns awaiting a human checkpoint before they enter the
    active library. Promote to keep, reject to drop.
    {% if staged %}· {{ staged|length }} staged{% endif %}
  </p>
</section>

{% if staged %}
  <div class="curator-cards">
    {% for p in staged %}
      <article class="curator-card" id="pattern-{{ p.pattern_id }}">
        <div class="curator-card-head">
          <span class="chip">{{ p.pattern_type }}</span>
          <h2 class="curator-card-title">{{ p.name }}</h2>
          <span class="curator-src-chip">{{ "%.0f"|format(p.confidence * 100) }}% confidence</span>
        </div>
        <p class="curator-card-rationale">{{ p.description }}</p>

        <div class="curator-sources">
          <code class="curator-src-chip">agent: {{ p.agent_id }}</code>
          <code class="curator-src-chip">id: {{ p.pattern_id }}</code>
        </div>

        {% if p.code %}
          <pre class="pattern-code"><code>{{ p.code }}</code></pre>
        {% endif %}

        <div class="curator-card-actions">
          <button class="btn btn-primary pattern-promote-btn"
                  data-pattern-id="{{ p.pattern_id }}">Promote</button>
          <button class="btn btn-muted pattern-reject-btn"
                  data-pattern-id="{{ p.pattern_id }}">Reject</button>
        </div>
      </article>
    {% endfor %}
  </div>
{% else %}
  <section class="curator-empty">
    <p>The review queue is empty — no patterns are staged for review.</p>
  </section>
{% endif %}
{% endblock %}

{% block scripts %}
<script>
  // Promote/reject POST JSON (token-gated), then reload to reflect state.
  async function _post(url, payload) {
    const resp = await fetch(url, {
      method: "POST",
      headers: attuneClientHeaders({ "Content-Type": "application/json" }),
      body: JSON.stringify(payload),
    });
    return resp.ok;
  }
  document.querySelectorAll(".pattern-promote-btn").forEach((btn) => {
    btn.addEventListener("click", async () => {
      btn.disabled = true;
      if (await _post("/patterns/promote", { pattern_id: btn.dataset.patternId })) {
        window.location.reload();
      } else {
        btn.disabled = false;
      }
    });
  });
  document.querySelectorAll(".pattern-reject-btn").forEach((btn) => {
    btn.addEventListener("click", async () => {
      const reason = window.prompt("Reason for rejecting (optional):", "") ?? "";
      btn.disabled = true;
      if (await _post("/patterns/reject", {
        pattern_id: btn.dataset.patternId,
        reason: reason,
      })) {
        window.location.reload();
      } else {
        btn.disabled = false;
      }
    });
  });
</script>
{% endblock %}