{% extends 'layouts/app.html.twig' %}

{% block title %}Semantyka AI | micey-projects{% endblock %}

{% block app_content %}
    {% include 'partials/_flash_messages.html.twig' %}

    <div class="ai-instructions-page">
        <section class="ai-instructions-hero">
            <div class="ai-instructions-hero__main">
                <div class="ai-instructions-hero__eyebrow">
                    <span class="ui-icon">hub</span>
                    <span>AI Studio / Semantyka</span>
                </div>
                <h2>Pomocnicze JSON-y i embeddingi</h2>
                <p>
                    Tu generujesz karty decyzyjne dla tagów, stylów i puzzli długiego opisu. Pipeline AI używa ich do zawężania kandydatów,
                    wyboru najlepiej pasujących bloków i semantycznego wyszukiwania tagów bez wysyłania całego słownika do modelu.
                </p>
                <div class="ai-instructions-hero__meta">
                    <span><strong>Tagi aktywne</strong>{{ stats.tags_total }}</span>
                    <span><strong>Tagi bez AI</strong>{{ stats.tags_missing }}</span>
                    <span><strong>Style bez AI</strong>{{ stats.styles_missing }}/{{ stats.styles_total }}</span>
                    <span><strong>Bloki bez AI</strong>{{ stats.blocks_missing }}/{{ stats.blocks_total }}</span>
                </div>
            </div>

            <div class="ai-instructions-hero__side">
                <form method="get" action="{{ path('app_ai_semantic') }}" class="ai-profile-switcher ai-profile-switcher--panel">
                    <label>Profil AI dla stylów i bloków
                        <select class="form-control" name="profile" onchange="this.form.submit()">
                            {% for profile in profiles %}
                                <option value="{{ profile.id }}" {{ selected_profile and selected_profile.id == profile.id ? 'selected' : '' }}>
                                    {{ profile.name }}{% if profile.platform %} / {{ profile.platform.name }}{% endif %}
                                </option>
                            {% endfor %}
                        </select>
                    </label>
                    <noscript><button class="button button--ghost" type="submit">Przełącz</button></noscript>
                </form>
                <div class="presta-warning-box">
                    Dla custom tagów generowany jest także embedding. Jeśli zmienisz nazwę tagu lub kartę pomocniczą, odśwież semantykę.
                </div>
            </div>
        </section>

        <section class="ai-instructions-section">
            <div class="ai-instructions-section__head ai-instructions-section__head--inline">
                <div>
                    <span class="ai-instructions-section__kicker">Tag router</span>
                    <h3>Custom tagi PrestaShop</h3>
                    <p>Lista pokazuje pierwsze {{ stats.tags_shown }} aktywnych tagów. Generator tworzy opis semantyczny i embedding używany do wyszukania top kandydatów przed rerankingiem AI.</p>
                </div>
                <span class="ai-instructions-count">Braki: {{ stats.tags_missing }}</span>
            </div>

            <form method="post" action="{{ path('app_ai_semantic_generate') }}" class="stack-form">
                <input type="hidden" name="_token" value="{{ csrf_token('ai_semantic_generate') }}">
                <input type="hidden" name="type" value="tags">
                <input type="hidden" name="profile" value="{{ selected_profile ? selected_profile.id : '' }}">
                <div class="form-actions">
                    <button class="button button--primary" name="mode" value="selected" type="submit">Generuj dla wybranych</button>
                    <button class="button button--ghost" name="mode" value="missing" type="submit">Generuj brakujące</button>
                    <button class="button button--ghost" name="mode" value="all" type="submit">Odśwież wszystkie aktywne</button>
                </div>
                <div class="table-responsive">
                    <table class="data-table ai-studio-table">
                        <thead><tr><th></th><th>Tag</th><th>Status AI</th><th>Semantyka</th></tr></thead>
                        <tbody>
                        {% for tag in tags %}
                            {% set missing = tag.aiHelperJson is empty or tag.aiEmbeddingJson is empty %}
                            <tr>
                                <td><input type="checkbox" name="ids[]" value="{{ tag.id }}"></td>
                                <td><strong>{{ tag.name }}</strong><br><span class="text-muted">Presta ID: {{ tag.prestaIdTag }}</span></td>
                                <td>
                                    {% if missing %}
                                        <span class="status-pill status-pill--muted">brak / niepełne</span>
                                    {% else %}
                                        <span class="status-pill status-pill--success">gotowe</span>
                                    {% endif %}
                                    {% if tag.aiHelperUpdatedAt %}<br><small>{{ tag.aiHelperUpdatedAt|date('Y-m-d H:i') }}</small>{% endif %}
                                </td>
                                <td>
                                    {% if tag.aiHelperJson %}
                                        <details>
                                            <summary>{{ tag.aiHelperJson.short_description|default('Pokaż JSON') }}</summary>
                                            <pre class="ai-code-preview">{{ tag.aiHelperJson|json_encode(constant('JSON_UNESCAPED_UNICODE')) }}</pre>
                                        </details>
                                    {% else %}
                                        <span class="text-muted">Brak karty pomocniczej.</span>
                                    {% endif %}
                                </td>
                            </tr>
                        {% else %}
                            <tr><td colspan="4"><div class="empty-state empty-state--compact"><strong>Brak aktywnych custom tagów.</strong></div></td></tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
            </form>
        </section>

        <section class="ai-instructions-section">
            <div class="ai-instructions-section__head ai-instructions-section__head--inline">
                <div>
                    <span class="ai-instructions-section__kicker">Style router</span>
                    <h3>Style komunikacji</h3>
                    <p>Te karty są wysyłane w skrócie na etapie wyboru stylu. Dzięki temu model nie musi czytać pełnych instrukcji stylu przy każdej decyzji.</p>
                </div>
                <span class="ai-instructions-count">Braki: {{ stats.styles_missing }}</span>
            </div>

            <form method="post" action="{{ path('app_ai_semantic_generate') }}" class="stack-form">
                <input type="hidden" name="_token" value="{{ csrf_token('ai_semantic_generate') }}">
                <input type="hidden" name="type" value="styles">
                <input type="hidden" name="profile" value="{{ selected_profile ? selected_profile.id : '' }}">
                <div class="form-actions">
                    <button class="button button--primary" name="mode" value="selected" type="submit">Generuj dla wybranych</button>
                    <button class="button button--ghost" name="mode" value="missing" type="submit">Generuj brakujące</button>
                    <button class="button button--ghost" name="mode" value="all" type="submit">Odśwież wszystkie</button>
                </div>
                <div class="ai-field-grid">
                    {% for style in styles %}
                        <label class="ai-config-card stack-form">
                            <span class="ai-config-card__top"><span><input type="checkbox" name="ids[]" value="{{ style.id }}"> <strong>{{ style.name }}</strong></span><span class="mono-badge">{{ style.code }}</span></span>
                            {% if style.aiHelperJson %}
                                <small>{{ style.aiHelperJson.short_description|default('Karta gotowa') }}</small>
                                <details><summary>Pokaż JSON</summary><pre class="ai-code-preview">{{ style.aiHelperJson|json_encode(constant('JSON_UNESCAPED_UNICODE')) }}</pre></details>
                            {% else %}
                                <small class="text-muted">Brak karty use_when / avoid_when.</small>
                            {% endif %}
                        </label>
                    {% else %}
                        <div class="empty-state empty-state--compact"><strong>Brak aktywnych stylów dla profilu.</strong></div>
                    {% endfor %}
                </div>
            </form>
        </section>

        <section class="ai-instructions-section">
            <div class="ai-instructions-section__head ai-instructions-section__head--inline">
                <div>
                    <span class="ai-instructions-section__kicker">Block planner</span>
                    <h3>Puzzle długiego opisu</h3>
                    <p>Karty bloków pomagają AI wybrać najlepsze sekcje przed etapem pisania. Pełne instrukcje wybranych bloków są wysyłane dopiero później.</p>
                </div>
                <span class="ai-instructions-count">Braki: {{ stats.blocks_missing }}</span>
            </div>

            <form method="post" action="{{ path('app_ai_semantic_generate') }}" class="stack-form">
                <input type="hidden" name="_token" value="{{ csrf_token('ai_semantic_generate') }}">
                <input type="hidden" name="type" value="blocks">
                <input type="hidden" name="profile" value="{{ selected_profile ? selected_profile.id : '' }}">
                <div class="form-actions">
                    <button class="button button--primary" name="mode" value="selected" type="submit">Generuj dla wybranych</button>
                    <button class="button button--ghost" name="mode" value="missing" type="submit">Generuj brakujące</button>
                    <button class="button button--ghost" name="mode" value="all" type="submit">Odśwież wszystkie</button>
                </div>
                <div class="table-responsive">
                    <table class="data-table ai-studio-table">
                        <thead><tr><th></th><th>Blok</th><th>Typ</th><th>Karta decyzyjna</th></tr></thead>
                        <tbody>
                        {% for block in blocks %}
                            <tr>
                                <td><input type="checkbox" name="ids[]" value="{{ block.id }}"></td>
                                <td><strong>{{ block.name }}</strong><br><span class="mono-badge">{{ block.code }}</span></td>
                                <td>{{ block.blockType }}{% if block.required %}<br><span class="status-pill status-pill--success">required</span>{% endif %}</td>
                                <td>
                                    {% if block.aiHelperJson %}
                                        <details>
                                            <summary>{{ block.aiHelperJson.short_description|default('Pokaż JSON') }}</summary>
                                            <pre class="ai-code-preview">{{ block.aiHelperJson|json_encode(constant('JSON_UNESCAPED_UNICODE')) }}</pre>
                                        </details>
                                    {% else %}
                                        <span class="text-muted">Brak karty decyzyjnej.</span>
                                    {% endif %}
                                </td>
                            </tr>
                        {% else %}
                            <tr><td colspan="4"><div class="empty-state empty-state--compact"><strong>Brak aktywnych bloków dla profilu.</strong></div></td></tr>
                        {% endfor %}
                        </tbody>
                    </table>
                </div>
            </form>
        </section>
    </div>
{% endblock %}