{% extends "admin/base_admin.html" %}
{% set admin_page = "templates" %}

{% block title %}{{ config_data.name }} - Admin - {{ config.APP_NAME }}{% endblock %}

{% block admin_content %}
  <a href="{{ url_for('admin.templates') }}" class="text-sm text-slate">&larr; Templates</a>

  <header class="flex justify-between items-center mt-4 mb-6">
    <div>
      <h1 class="text-2xl">{{ config_data.name }}</h1>
      <p class="text-slate text-sm mono">{{ config_data.slug }}</p>
    </div>
    <div class="flex gap-2">
      <a href="{{ url_for('admin.template_generate', slug=config_data.slug) }}" class="btn">Generate Articles</a>
      <form method="post" action="{{ url_for('admin.template_regenerate', slug=config_data.slug) }}" style="display:inline" hx-boost="true">
        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
        <button type="submit" class="btn-outline"
                hx-confirm="Regenerate all articles for this template with fresh data? Existing articles will be overwritten.">
          Regenerate
        </button>
      </form>
    </div>
  </header>

  {# Config section #}
  <div class="card mb-6">
    <h2 class="text-lg mb-4">Configuration (read-only)</h2>
    <table class="table">
      <tbody>
        <tr><td class="font-semibold" style="width:200px">Content Type</td><td><span class="badge">{{ config_data.content_type }}</span></td></tr>
        <tr><td class="font-semibold">Data Table</td><td class="mono">{{ config_data.data_table }}</td></tr>
        <tr><td class="font-semibold">Natural Key</td><td class="mono">{{ config_data.natural_key }}</td></tr>
        <tr><td class="font-semibold">Languages</td><td>{{ config_data.languages | join(', ') }}</td></tr>
        <tr><td class="font-semibold">URL Pattern</td><td class="mono text-sm">{{ config_data.url_pattern }}</td></tr>
        <tr><td class="font-semibold">Title Pattern</td><td class="text-sm">{{ config_data.title_pattern }}</td></tr>
        <tr><td class="font-semibold">Meta Description</td><td class="text-sm">{{ config_data.meta_description_pattern }}</td></tr>
        <tr><td class="font-semibold">Schema Types</td><td>{{ config_data.schema_type | join(', ') }}</td></tr>
        {% if config_data.priority_column %}
        <tr><td class="font-semibold">Priority Column</td><td class="mono">{{ config_data.priority_column }}</td></tr>
        {% endif %}
      </tbody>
    </table>
    <p class="text-slate text-sm mt-4">Edit this template in the repo: <code>content/templates/{{ config_data.slug }}.md.jinja</code></p>
  </div>

  {# Stats #}
  <div class="flex gap-4 mb-6">
    <div class="card" style="flex:1; text-align:center">
      <div class="text-2xl font-bold">{{ columns | length }}</div>
      <div class="text-slate text-sm">Columns</div>
    </div>
    <div class="card" style="flex:1; text-align:center">
      <div class="text-2xl font-bold">{{ sample_rows | length }}{% if sample_rows | length >= 10 %}+{% endif %}</div>
      <div class="text-slate text-sm">Data Rows</div>
    </div>
    <div class="card" style="flex:1; text-align:center">
      <div class="text-2xl font-bold">{{ generated_count }}</div>
      <div class="text-slate text-sm">Generated</div>
    </div>
  </div>

  {# Columns #}
  <div class="card mb-6">
    <h2 class="text-lg mb-4">Available Columns</h2>
    {% if columns %}
    <div style="display:flex; flex-wrap:wrap; gap:8px">
      {% for col in columns %}
      <span class="badge" title="{{ col.type }}">{{ col.name }} <span class="text-slate">({{ col.type }})</span></span>
      {% endfor %}
    </div>
    {% else %}
    <p class="text-slate text-sm">No columns found. Is the DuckDB table <code>{{ config_data.data_table }}</code> available?</p>
    {% endif %}
  </div>

  {# Sample data #}
  <div class="card mb-6">
    <h2 class="text-lg mb-4">Sample Data (first 10 rows)</h2>
    {% if sample_rows %}
    <div style="overflow-x:auto">
      <table class="table text-sm">
        <thead>
          <tr>
            <th></th>
            {% for col in columns %}
            <th>{{ col.name }}</th>
            {% endfor %}
          </tr>
        </thead>
        <tbody>
          {% for row in sample_rows %}
          <tr>
            <td>
              <a href="{{ url_for('admin.template_preview', slug=config_data.slug, row_key=row[config_data.natural_key]) }}"
                 class="btn-outline btn-sm">Preview</a>
            </td>
            {% for col in columns %}
            <td class="mono" style="max-width:200px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap">
              {{ row[col.name] }}
            </td>
            {% endfor %}
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
    {% else %}
    <p class="text-slate text-sm">No data available. Run the data pipeline first.</p>
    {% endif %}
  </div>
{% endblock %}
