{% extends "projects/base.html" %}

{% load crispy from crispy_forms_tags %}
{% load trans blocktrans from i18n %}

{% load alter_field from ext_theme_tags %}

{% block title %}
  {% if version %}
    {{ version.verbose_name }} - {{ version.project.name }}
  {% else %}
    {% trans "Activate a new version" %}
  {% endif %}
{% endblock title %}

{% block content-header %}
  {% with versions_active="active" %}
    {% include "projects/partials/header.html" %}
  {% endwith %}
{% endblock content-header %}

{% block content %}
  <div class="ui very padded centered grid stackable">

    <div class="eight wide computer sixteen wide tablet sixteen wide mobile column">

      {# Common header #}
      <h2 class="ui medium dividing header">
        {% if version %}
          {% trans "Edit version" %}
        {% else %}
          {% trans "Activate a new version" %}
          <span class="sub header">{% trans "Select a version to activate" %}</span>
        {% endif %}
      </h2>

      {% if version %}
        {# Left card display when there is a version to edit #}

        <div class="ui fluid card">
          <div class="content">
            <div class="header">
              {{ version.verbose_name }}
              <i class="fas {% if version.type == "branch" %}fa-code-branch{% elif version.type == "tag" %}fa-tag{% endif %} small icon"></i>
            </div>
            <div class="meta">
              <span class="identifier">
                <code>{{ version.identifier_friendly }}</code>
              </span>
            </div>
          </div>

          <div class="content">
            {% if version.active %}
              <div class="ui warning message">
                {% url "projects_redirects_create" project_slug=project.slug as url_redirects %}
                {% blocktrans trimmed with url=url_redirects %}
                  Deactivating a version or changing its slug will result in the deletion of its documentation.
                  Make sure to <a href="{{ url }}" target="_blank">create a redirect</a> for these URLs to ensure old links continue working.
                {% endblocktrans %}
              </div>
            {% endif %}

            <form class="ui form" method="post" action=".">
              {% csrf_token %}

              {% alter_field form.active classes="ui toggle checkbox" %}
              {% alter_field form.hidden classes="ui toggle checkbox" %}

              {{ form | crispy }}

              <div class="right floated">
                <input class="ui primary button" type="submit" value="Update version">
              </div>
            </form>
          </div>

          <div class="extra content">
            {% if version.built %}
              {% blocktrans count build_count=version.builds.count %}
                {{ build_count }} build
              {% plural %}
                {{ build_count }} builds
              {% endblocktrans %}
            {% else %}
              No builds yet
            {% endif %}
          </div>
        </div>
      {% else %}
        {# Search for new version to activate #}
        {% block project_version_form_search %}
          <div data-bind="using: ProjectVersionCreateView()">

            {# Pass information from Django into site JS, avoid CSP as inline JS #}
            <script type="application/json" data-bind="jsonInit: config">
              {
                "api_url": "{% url "projects-versions-list" project.slug %}",
                "errors": {
                  "noResults": "{% filter escapejs %}{% trans "No matching versions found" %}{% endfilter %}"
                }
              }
            </script>

            <div class="ui fluid very short scrolling search"
                 data-bind="semanticui: {search: search_config()}">
              <div class="ui fluid icon large input">
                <input class="ui text"
                       type="text"
                       placeholder="{% trans "Search versions" %}"
                       tabindex="0">
                <i class="fa-duotone fa-magnifying-glass icon"></i>
              </div>
              <div class="results" tabindex="0"></div>
            </div>

            {# Placeholder until a version is selected #}
            {% block version_create_placeholder %}
              <div class="ui top attached placeholder segment">

                <div class="ui icon header">
                  {% trans "Configure a new branch or tag" %}

                  <div class="sub header">
                    <p>
                      {% blocktrans trimmed %}
                        New documentation versions can be added from existing tags or branches.
                      {% endblocktrans %}
                    </p>

                    <a href="https://docs.readthedocs.io/en/stable/versions.html"
                       class="ui primary button"
                       target="_blank">{% trans "Learn more" %}</a>
                  </div>
                </div>

              </div>
              <div class="ui small bottom attached center aligned message">

                {% trans "Are your versions out of date?" %}

                <readthedocs-button-sync-versions class="ui mini black basic compact right aligned button"
                                                  url="{% url "projects-sync-versions" project.slug %}"
                                                  csrf-token="{{ csrf_token }}">
                  <i class="fa-solid fa-arrows-rotate icon"></i>
                  {% trans "Resync versions" %}
                </readthedocs-button-sync-versions>

              </div>
            {% endblock version_create_placeholder %}
          </div>
        {% endblock project_version_form_search %}
      {% endif %}

    </div>

    {# Help display? #}
    <div class="four wide computer sixteen wide tablet sixteen wide mobile column">
      <div class="ui basic segment">
        <h2 class="ui small header">{% trans "Help topics" %}</h2>
        <div class="ui bulleted list">
          {% include "includes/elements/link.html" with url="https://docs.readthedocs.io/page/versions.html" text=_("Versions") is_external=True class="item" %}
          {% include "includes/elements/link.html" with url="https://docs.readthedocs.io/page/versions.html#version-states" text=_("Version states") is_external=True class="item" %}
          {% include "includes/elements/link.html" with url="https://docs.readthedocs.io/page/versions.html#privacy-levels" text=_("Privacy levels") is_external=True class="item" %}
          {% include "includes/elements/link.html" with url="https://docs.readthedocs.io/page/guides/automation-rules.html" text=_("Version automation rules") is_external=True class="item" %}
          {% include "includes/elements/link.html" with url="https://docs.readthedocs.io/" text=_("Documentation index") is_external=True class="item" %}
        </div>
      </div>
    </div>
  </div>
{% endblock content %}