{% extends 'panel/base.html' %}

{% block panel_title %}Tłumaczenie: {{ source_title }}{% endblock %}
{% block heading %}{{ source_title }}{% endblock %}
{% block subheading %}
  <p class="text-sm text-slate-500 dark:text-slate-400">
    {{ kind_name }} w języku: <span class="font-medium">{{ language.label }}</span>.
    Puste pole znaczy treść oryginału - tłumaczy się tylko to, co ma brzmieć inaczej.
  </p>
{% endblock %}
{% block actions %}
  <div class="flex flex-wrap gap-2">
    {% for item in languages %}
      {% if not item.is_default %}
        <a class="btn-ghost !px-3 !py-1 text-xs{% if item.code == language.code %} bg-brand-600 text-white{% endif %}"
           href="{% url 'panel:translations:edit' label=label object_id=source.pk code=item.code %}">{{ item.short }}</a>
      {% endif %}
    {% endfor %}
    <a class="btn-ghost" href="{% url 'panel:translations:index' %}?rodzaj={{ label }}">Wróć do listy</a>
  </div>
{% endblock %}

{% block content %}
<form method="post" novalidate class="max-w-3xl space-y-4">
  {% csrf_token %}

  {% if form.non_field_errors %}
    <div class="border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-800 dark:border-red-900 dark:bg-red-950 dark:text-red-200">
      {% for error in form.non_field_errors %}<p>{{ error }}</p>{% endfor %}
    </div>
  {% endif %}

  {% for pair in form.pairs %}
    <section class="card">
      <div class="card-body space-y-3">
        {% with field=pair.field %}{% include 'panel/partials/field.html' %}{% endwith %}
        {% if pair.original %}
          <div class="border-t border-slate-200 pt-3 dark:border-slate-800">
            <p class="text-xs font-semibold uppercase tracking-wide text-slate-400">Oryginał</p>
            <p class="mt-1 max-h-40 overflow-y-auto whitespace-pre-wrap text-sm text-slate-600 dark:text-slate-300">{{ pair.original }}</p>
          </div>
        {% endif %}
      </div>
    </section>
  {% endfor %}

  <section class="card">
    <div class="card-body space-y-4">
      {% with field=form.is_published %}{% include 'panel/partials/field.html' %}{% endwith %}
      {% if settings and not settings.fallback %}
        <p class="help border-t border-slate-200 pt-3 dark:border-slate-800">
          W ustawieniach tłumaczeń wyłączono zastępowanie braków oryginałem, więc treść
          bez tej wersji nie istnieje w języku {{ language.label }} - jej adres odpowiada błędem 404.
        </p>
      {% endif %}
    </div>
  </section>

  <div class="card save-bar">
    <div class="card-body flex flex-wrap items-center justify-between gap-3">
      {% include "panel/partials/dirty-note.html" %}
      <button class="btn-primary" type="submit">Zapisz tłumaczenie</button>
      <div class="flex flex-wrap items-center gap-3">
        {% if translation %}
          <p class="help">Ostatnia zmiana: {{ translation.updated_at|date:"d.m.Y H:i" }}</p>
        {% endif %}
      </div>
    </div>
  </div>
</form>

{% if translation %}
  <form method="post" class="mt-4"
        action="{% url 'panel:translations:delete' label=label object_id=source.pk code=language.code %}"
        data-confirm="Usunąć tłumaczenie ({{ language.label }})? Treść oryginalna zostanie nietknięta.">
    {% csrf_token %}
    <button class="btn-danger !px-3 !py-1 text-xs" type="submit">Usuń te wersje językowa</button>
  </form>
{% endif %}
{% endblock %}