{% extends "admin/base_site.html" %}
{% load i18n %}

{% block extrahead %}
{{ block.super }}
<style>
.agent-banner { margin: 10px 0; padding: 10px 12px; border: 1px solid #ba2121; background: #fff8f8; }
.agent-layer { margin: 18px 0 28px; }
.agent-layer h2 { margin-bottom: 8px; }
.agent-kind { margin: 10px 0 16px; }
.agent-kind h3 { margin: 0 0 6px; font-size: 13px; }
.agent-json { white-space: pre-wrap; font-family: monospace; font-size: 12px; max-width: 860px; }
.agent-overall { font-weight: 600; }
.agent-actions { margin: 0 0 12px; }
</style>
{% endblock %}

{% block content %}
<div id="content-main">
  <p>
    <a href="{% url 'admin:ai_agent_agentmemory_changelist' %}">&larr; All memories</a>
    · <a href="{% url 'admin:ai_agent_agentprompt_changelist' %}">Prompt overlays</a>
    · <a href="{% url 'admin:ai_agent_agentthread_changelist' %}?user={{ memory_user.pk }}">Threads</a>
    {% if user_change_url %}
    · <a href="{{ user_change_url }}">User</a>
    {% endif %}
  </p>

  {% if error %}
  <p class="agent-banner">{{ error }}</p>
  {% endif %}

  <p>
    <strong>{{ memory_user.get_username }}</strong>
    {% if memory_user.get_full_name %}
      — {{ memory_user.get_full_name }}
    {% endif %}
  </p>

  {% if global_overlays or user_overlays %}
  <div class="agent-layer module">
    <h2>Prompt overlays</h2>
    {% if global_overlays %}
    <div class="agent-kind">
      <h3>Global (all users)</h3>
      <table>
        <thead>
          <tr>
            <th>Layer</th>
            <th>Updated</th>
            <th>Current</th>
            <th>History</th>
          </tr>
        </thead>
        <tbody>
          {% for item in global_overlays %}
          <tr>
            <td>
              <a href="{% url 'admin:ai_agent_agentprompt_change' item.item_id %}">
                {% if item.layer == supervisor_layer %}
                  <span class="agent-overall">{{ item.layer_display }}</span>
                {% else %}
                  {{ item.layer_display }}
                {% endif %}
              </a>
            </td>
            <td>{{ item.updated_at|default:"—" }}</td>
            <td><pre class="agent-json">{{ item.current|default:"—" }}</pre></td>
            <td>
              {{ item.history|length }} previous
              {% if item.history %}
              <details>
                <summary>Show</summary>
                {% for version in item.history %}
                <p><strong>{{ version.updated_at|default:"previous" }}</strong></p>
                <pre class="agent-json">{{ version.text }}</pre>
                {% endfor %}
              </details>
              {% endif %}
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
    {% endif %}
    {% if user_overlays %}
    <div class="agent-kind">
      <h3>This user</h3>
      <table>
        <thead>
          <tr>
            <th>Layer</th>
            <th>Updated</th>
            <th>Current</th>
            <th>History</th>
          </tr>
        </thead>
        <tbody>
          {% for item in user_overlays %}
          <tr>
            <td>
              <a href="{% url 'admin:ai_agent_agentprompt_change' item.item_id %}">
                {% if item.layer == supervisor_layer %}
                  <span class="agent-overall">{{ item.layer_display }}</span>
                {% else %}
                  {{ item.layer_display }}
                {% endif %}
              </a>
            </td>
            <td>{{ item.updated_at|default:"—" }}</td>
            <td><pre class="agent-json">{{ item.current|default:"—" }}</pre></td>
            <td>
              {{ item.history|length }} previous
              {% if item.history %}
              <details>
                <summary>Show</summary>
                {% for version in item.history %}
                <p><strong>{{ version.updated_at|default:"previous" }}</strong></p>
                <pre class="agent-json">{{ version.text }}</pre>
                {% endfor %}
              </details>
              {% endif %}
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
    {% endif %}
  </div>
  {% endif %}

  <form method="post">
    {% csrf_token %}
    {% if can_delete and grouped %}
    <div class="actions agent-actions">
      <label>
        Action:
        <select name="action">
          <option value="">---------</option>
          <option value="delete">Delete selected memories</option>
        </select>
      </label>
      <button type="submit" class="button">Go</button>
      <label>
        <input type="checkbox" id="action-toggle" title="Select all">
        Select all
      </label>
    </div>
    {% endif %}

  {% for layer, kinds in grouped.items %}
  <div class="agent-layer module">
    <h2>
      {% if layer == supervisor_layer %}
        <span class="agent-overall">Overall</span>
        <span> (supervisor)</span>
      {% else %}
        {{ layer }}
      {% endif %}
    </h2>
    {% for kind, items in kinds.items %}
      {% if items and kind != "prompt" %}
      <div class="agent-kind">
        <h3>{{ kind }}</h3>
        <table>
          <thead>
            <tr>
              {% if can_delete %}
              <th class="action-checkbox-column"></th>
              {% endif %}
              <th>Key</th>
              <th>Updated</th>
              <th>Value</th>
            </tr>
          </thead>
          <tbody>
            {% for item in items %}
            <tr>
              {% if can_delete %}
              <td class="action-checkbox">
                <input type="checkbox" name="selected" value="{{ item.item_id }}" class="action-select">
              </td>
              {% endif %}
              <td>{{ item.key }}</td>
              <td>{{ item.updated_at|default:item.created_at|default:"—" }}</td>
              <td><pre class="agent-json">{{ item.value_json|default:item.preview }}</pre></td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
      {% endif %}
    {% endfor %}
  </div>
  {% empty %}
  <p>{% if not error %}No memories stored for this user.{% endif %}</p>
  {% endfor %}
  </form>
</div>
<script>
(function () {
  var toggle = document.getElementById("action-toggle");
  if (!toggle) return;
  toggle.addEventListener("change", function () {
    document.querySelectorAll(".action-select").forEach(function (box) {
      box.checked = toggle.checked;
    });
  });
})();
</script>
{% endblock %}