{% extends 'admin/base.html.twig' %}

{% block title %}System Prompt{% endblock %}

{% block body %}

    <div class="container-fluid">


        <!-- Flash Messages -->
        {% for message in app.flashes('success') %}
            <div class="alert alert-success mb-5">{{ message }}</div>
        {% endfor %}
        {% for message in app.flashes('danger') %}
            <div class="alert alert-danger mb-5">{{ message }}</div>
        {% endfor %}

        <!-- HEADER -->
        <div class="d-flex justify-content-between align-items-center mb-4">
            <h1 class="h3"><i class="bi bi-chat-right-dots-fill"></i> System Prompt Verwaltung</h1>
        </div>

        {# ========================================================= #}
        {# SYSTEM PROMPT DESCRIPTION                                #}
        {# ========================================================= #}
        <div class="card bg-dark border-secondary text-light mb-4 shadow-sm">
            <div class="card-body row">

                <div class="col-lg-6">
                    <h5 class="text-info mb-3">Was steuert der System Prompt?</h5>

                    <p class="small text-light mb-3">
                        Der System Prompt definiert das globale Antwortverhalten des LLM.
                        Er ist die oberste Steuerungsebene des Systems und beeinflusst:
                    </p>

                    <ul class="small text-light mb-3">
                        <li>Ton und Stil der Antworten</li>
                        <li>Struktur der Ausgaben</li>
                        <li>Umgang mit Unsicherheiten</li>
                        <li>Bezug auf Wissensquellen</li>
                    </ul>
                </div>

                <div class="col-lg-6">
                    <h6 class="text-info mt-3">Architektur-Prinzip</h6>

                    <p class="small text-light mb-3">
                        Der System Prompt ist strikt von der Wissensebene getrennt.
                        Er verändert keine Dokumente, Chunks oder Vektoren,
                        sondern nur die Interpretation und Darstellung der Retrieval-Ergebnisse.
                    </p>

                    <h6 class="text-info mt-3">Warum Versionierung?</h6>

                    <p class="small text-light mb-0">
                        Jede Änderung kann das Antwortverhalten signifikant verändern.
                        Daher ist der Prompt versioniert, rollbackfähig und nur eine Version kann aktiv sein.
                        Aktivierungen wirken unmittelbar auf alle nachfolgenden Anfragen.
                    </p>
                </div>

            </div>
        </div>

        <div class="row g-4">

            <!-- LEFT SIDE – Versionen -->
            <div class="col-lg-6">

                <div class="card bg-black border-secondary text-light h-100">
                    <div class="card-body">

                        <h5 class="text-info mb-3">Versionen</h5>

                        <div class="table-responsive">
                            <table class="table table-dark table-striped table-hover align-middle">
                                <thead class="table-secondary text-dark">
                                <tr>
                                    <th>Version</th>
                                    <th>Status</th>
                                    <th>Kommentar</th>
                                    <th>Erstellt</th>
                                    <th class="text-end">Aktionen</th>
                                </tr>
                                </thead>
                                <tbody>

                                {% for p in all %}
                                    <tr>
                                        <td>v{{ p.version }}</td>

                                        <td>
                                            {% if p.active %}
                                                <span class="badge bg-success">Aktiv</span>
                                            {% else %}
                                                <span class="badge bg-dark border border-secondary">
                                                    Inaktiv
                                                </span>
                                            {% endif %}
                                        </td>

                                        <td>{{ p.comment ?? '-' }}</td>

                                        <td>{{ p.createdAt|date('d.m.Y H:i:s') }}</td>

                                        <td class="text-end">

                                            {% if not p.active and is_granted('ROLE_SUPER_ADMIN') %}

                                                <form method="post"
                                                      action="{{ path('admin_system_prompt_activate', {id: p.id}) }}"
                                                      class="d-inline"
                                                      onsubmit="return confirm('Diese Version aktivieren?');">

                                                    <input type="hidden"
                                                           name="_token"
                                                           value="{{ csrf_token('activate_system_prompt_' ~ p.id) }}">

                                                    <button class="btn btn-sm btn-outline-success me-2">
                                                        Aktivieren
                                                    </button>
                                                </form>

                                                <form method="post"
                                                      action="{{ path('admin_system_prompt_delete', {id: p.id}) }}"
                                                      class="d-inline"
                                                      onsubmit="return confirm('Version wirklich löschen?');">

                                                    <input type="hidden"
                                                           name="_token"
                                                           value="{{ csrf_token('delete_system_prompt_' ~ p.id) }}">

                                                    <button class="btn btn-sm btn-outline-danger">
                                                        Löschen
                                                    </button>
                                                </form>

                                            {% else %}
                                                <span class="text-light">—</span>
                                            {% endif %}

                                        </td>
                                    </tr>
                                {% else %}
                                    <tr>
                                        <td colspan="5" class="text-center py-4">
                                            Keine Versionen vorhanden.
                                        </td>
                                    </tr>
                                {% endfor %}

                                </tbody>
                            </table>
                        </div>

                        <hr class="border-secondary mt-4">

                        <div class="small text-light">
                            <strong>Governance-Hinweis:</strong><br>
                            Der aktive System Prompt beeinflusst das globale Antwortverhalten unmittelbar.
                            Änderungen sollten dokumentiert, versioniert und bewusst aktiviert werden.
                        </div>

                    </div>
                </div>

            </div>

            <!-- RIGHT SIDE – Neue Version -->
            <div class="col-lg-6">

                <div class="card bg-black border-secondary text-light h-100">
                    <div class="card-body">

                        <h5 class="text-info mb-3">Neue Version erstellen</h5>

                        <form method="post">
                            <input type="hidden"
                                   name="_token"
                                   value="{{ csrf_token('create_system_prompt') }}">

                            <div class="mb-3">
                                <label class="form-label">Kommentar (optional)</label>
                                <input type="text"
                                       name="comment"
                                       class="form-control bg-dark text-light border-secondary"
                                       placeholder="Warum wurde der Prompt geändert?">
                                <div class="form-text text-light">
                                    Dokumentation der Änderung für spätere Nachvollziehbarkeit.
                                </div>
                            </div>

                            <div class="mb-3">
                                <label class="form-label">Prompt-Inhalt</label>

                                <div class="form-text text-light mb-2">
                                    Verfügbare Variable:
                                    <code>{% verbatim %}{% now %}{% endverbatim %}</code>
                                    (aktuelles Datum / Zeit)
                                </div>

                                <textarea name="content"
                                          rows="18"
                                          class="form-control bg-dark text-light border-secondary"
                                          required>{{ active ? active.content : '' }}</textarea>
                            </div>

                            {% if is_granted('ROLE_SUPER_ADMIN') %}
                                <div class="d-flex justify-content-end">
                                    <button class="btn btn-outline-info">
                                        Neue Version speichern
                                    </button>
                                </div>
                            {% endif %}
                        </form>

                    </div>
                </div>

            </div>

        </div>

    </div>

{% endblock %}