{% load i18n %}

{% if post_form.non_field_errors %}
{% for error in post_form.non_field_errors %}
<div class="alert alert-danger">
  <i class="icon-exclamation-sign"></i> {{ error }}
</div>
{% endfor %}
{% endif %}
{% include "partials/form_field.html" with field=post_form.subject %}
{% include "partials/form_field.html" with field=post_form.content %}
{% if post_form.username %}
    {% include "partials/form_field.html" with field=post_form.username %}
{% endif %}
{% if post_form.update_reason %}
    {% include "partials/form_field.html" with field=post_form.update_reason %}
{% endif %}

<!-- Sub "forms" panes -->
<div class="tab-content" x-data="{ tab: '#options' }">
  <!-- Sub "forms" tabs -->
  {% if attachment_formset %}
  <ul class="flex flex-row justify-between w-full">
    <a href="#"
       :class="tab === '#options' ? 'border-b-4 border-orange text-orange' : 'border-b border-slate'"
       class="px-11 pb-4 w-1/2 text-center active"
       data-toggle="tab"
       x-on:click.prevent="tab='#options'"
    >{% trans "Options" %}</a>
    <a href="#"
       :class="tab === '#attachments' ? 'border-b-4 border-orange text-orange' : 'border-b border-slate'"
       class="px-11 pb-4 w-1/2 text-center"
       data-toggle="tab"
       x-on:click.prevent="tab='#attachments'"
    >{% trans "Attachments" %}</a>
  </ul>
  {% endif %}

  <div class="tab-pane active" id="options" x-show="tab == '#options'" x-cloak>
    <div class="form-group">
      <br />
      <div class="w-full">
        <div class="w-full">
          {% with field=post_form.enable_signature %}
          <div class="checkbox">
            <label for="{{ field.auto_id }}">
              {{ field }}
              {{ field.label }}
            </label>
          </div>
          {% endwith %}
          {% if post_form.lock_topic %}
          {% with field=post_form.lock_topic %}
          <div class="checkbox">
            <label for="{{ field.auto_id }}">
              {{ field }}
              {{ field.label }}
            </label>
          </div>
          {% endwith %}
          {% endif %}
        </div>
      </div>
    </div>
  </div>
  {% if attachment_formset %}
  <div class="tab-pane" id="attachments" x-show="tab == '#attachments'" x-cloak>
    <div class="form-group">
      <br />
      <div class="row">
        <div id="attachment_formset" class="col-md-12">
           <p class="lead attachments-title">{% trans "Attachments" %}</p>
          {% include "forum_conversation/forum_attachments/attachment_formset.html" %}
        </div>
      </div>
    </div>
  </div>
  {% endif %}
</div>
