{% extends "base.html" %}

{% load crispy_forms_tags i18n metrics permissions translations %}

{% block nav_pills %}
  {% perm 'upload.perform' object as user_can_upload_translation %}

  <ul class="nav nav-pills">
    <li class="nav-item">
      <a class="nav-link active"
         data-bs-target="#translation"
         data-bs-toggle="tab"
         href="#">{% translate "Translation" %}</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" data-bs-target="#components" data-bs-toggle="tab" href="#">{% translate "Components" %}</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" data-bs-target="#information" data-bs-toggle="tab" href="#">{% translate "Overview" %}</a>
    </li>
    <li class="nav-item">
      <a class="nav-link" data-bs-target="#search" data-bs-toggle="tab" href="#">{% translate "Search" %}</a>
    </li>
    <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#">{% translate "Insights" %}</a>
      <ul class="dropdown-menu shadow">
        <li>
          <a class="dropdown-item" data-bs-target="#history" data-bs-toggle="tab" href="#">{% translate "History" %}</a>
        </li>
        <li>
          <a class="dropdown-item" href="{% url 'checks' path=object.get_url_path %}">{% translate "Failing checks" %}</a>
        </li>
      </ul>
    </li>
    <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#">{% translate "Files" %}</a>
      <ul class="dropdown-menu shadow">
        <li>
          <a class="dropdown-item"
             href="{% url 'download' path=object.get_url_path %}?format=zip"
             title="{% translate "Download for offline translation." %}">{% blocktranslate %}Download original translation files as ZIP file{% endblocktranslate %}</a>
        </li>
        {% if user_can_upload_translation %}
          <li>
            <a class="dropdown-item" data-bs-target="#upload" data-bs-toggle="tab" href="#">{% translate "Upload translation" %}</a>
          </li>
        {% endif %}
      </ul>
    </li>
    <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" data-bs-toggle="dropdown" href="#">{% translate "Operations" %}</a>
      <ul class="dropdown-menu shadow">
        {% if replace_form %}
          <li>
            <a class="dropdown-item" data-bs-target="#replace" data-bs-toggle="tab" href="#">{% translate "Search and replace" %}</a>
          </li>
        {% endif %}
        {% if bulk_state_form %}
          <li>
            <a class="dropdown-item" data-bs-target="#bulk-edit" data-bs-toggle="tab" href="#">{% translate "Bulk edit" %}</a>
          </li>
        {% endif %}
        {% if delete_form %}
          {% if replace_form or bulk_state_form %}
            <li>
              <hr class="dropdown-divider">
            </li>
          {% endif %}
          <li>
            <a class="dropdown-item" data-bs-target="#organize" data-bs-toggle="tab" href="#">{% translate "Organize or remove" %}</a>
          </li>
        {% endif %}
      </ul>
    </li>
    {% include "snippets/watch-dropdown.html" with project=category.project %}
  </ul>
{% endblock nav_pills %}

{% block breadcrumbs %}
  {% path_object_breadcrumbs path_object %}
{% endblock breadcrumbs %}

{% block content %}

  {% get_translate_url object as translate_url %}
  {% perm 'upload.perform' object as user_can_upload_translation %}

  <div class="tab-content">

    <div class="tab-pane active" id="translation">{% include "snippets/translation.html" %}</div>
    <div class="tab-pane" id="components">
      {% include "snippets/list-objects.html" with objects=translation_objects list_categories=categories name_source="component_name" label=_("Component") %}

      {% include "paginator.html" with page_obj=translations %}
    </div>

    <div class="tab-pane" id="information">
      {% show_info project=category.project stats=language_stats metrics=object|metrics %}
    </div>

    <div class="tab-pane" id="history">
      {% format_last_changes_content last_changes=last_changes user=user %}
      <a class="btn btn-primary" href="{% url 'changes' path=object.get_url_path %}">{% translate "Browse all changes for this language" %}</a>
    </div>

    <div class="tab-pane" id="search">

      <form action="{{ translate_url }}" method="get">
        {% include "snippets/search-form.html" %}
      </form>

    </div>

    {% if delete_form %}
      <div class="tab-pane" id="organize">{% include "trans/delete-form.html" %}</div>
    {% endif %}

    {% if replace_form %}
      <div class="tab-pane" id="replace">
        <form action="{% url 'replace' path=object.get_url_path %}"
              method="post"
              enctype="multipart/form-data">
          <div class="card">
            <div class="card-header">
              <h4 class="card-title">
                {% documentation_icon 'user/translating' 'search-replace' right=True %}
                {% translate "Search and replace" %}
              </h4>
            </div>
            <div class="card-body">{% crispy replace_form %}</div>
            <div class="card-footer">
              <input type="submit" value="{% translate "Replace" %}" class="btn btn-primary" />
            </div>
          </div>
        </form>
      </div>
    {% endif %}

    {% if bulk_state_form %}
      <div class="tab-pane" id="bulk-edit">
        <form action="{% url 'bulk-edit' path=object.get_url_path %}"
              method="post"
              enctype="multipart/form-data">
          <div class="card">
            <div class="card-header">
              <h4 class="card-title">
                {% documentation_icon 'user/translating' 'bulk-edit' right=True %}
                {% translate "Bulk edit" %}
              </h4>
            </div>
            <div class="card-body">{% crispy bulk_state_form %}</div>
            <div class="card-footer">
              <input type="submit" value="{% translate "Apply" %}" class="btn btn-primary" />
            </div>
          </div>
        </form>
      </div>
    {% endif %}

    {% if user_can_upload_translation %}
      <div class="tab-pane" id="upload">
        {% include "snippets/upload-placeholder.html" with upload_translation_tab="#components" upload_translation_label=_("Browse components") %}
      </div>
    {% endif %}

  </div>

{% endblock content %}