{% extends 'eval/base.html' %}
{% load static %}
{% block title %}Edit: {{ version.label }} | Prompt Library | Eval Admin{% endblock %}

{% block action_bar %}
<c-detail-nav
  back_url="{% url 'Eval:prompt_library' %}{% if subagent_key %}?subagent={{ subagent_key }}{% endif %}"
  back_label="Prompt Library"
  title="Edit Prompt"
/>
{% endblock %}

{% block content %}
<link rel="stylesheet" href="{% static 'eval/css/prompt-history.css' %}">

<div class="pm-detail-layout">

  {# Main editor — uses the shared prompt form component #}
  <div x-data="promptEditor()"
       x-init="initFormGuard()"
       data-version-id="{{ version.id }}"
       data-subagent="{{ subagent_key }}"
       data-label="{{ version.label }}"
       data-initial-prompt="{{ version.prompt|escape }}"
       class="pm-detail-main space-y-4">

    {% include 'eval/components/_prompt_form.html' with mode='edit' subagent_display_name=subagent_display_name subagent_key=subagent_key version_label=version.label %}
  </div>

  {# History sidebar #}
  {% include 'eval/components/_version_history.html' %}

</div>

<script id="diff-targets-json" type="application/json">{{ diff_targets_json|safe }}</script>
<script id="version-diffs-json" type="application/json">{{ version_diffs_json|safe }}</script>
{% endblock %}

{% block extra_scripts %}
<script src="{% static 'eval/js/eval-prompt-editor.js' %}"></script>
{% endblock %}