{% extends "includes/elements/chips/base.html" %}

{% load i18n %}

{# Conditionally provide URL if there is an API v3 URL to request from. In the case of pull request versions, API requests 404 #}
{% block chip_view_params %}'{% if not version.is_external %}{% url "projects-versions-detail" version.project.slug version.slug %}{% endif %}'{% endblock %}

{% block chip_url %}
  {% url "projects_detail" version.project.slug %}?slug={{ version.slug }}
{% endblock %}

{% block chip_icon %}
  {# fmt:off #}
  <i class="fa-solid icon {% spaceless %}

    {# Show the type of the version #}
    {% if version.is_external %}
      fa-code-pull-request
    {% elif version.type == 'branch' %}
      fa-code-branch
    {% elif version.type == 'tag' %}
      fa-tag
    {% else %}
      fa-code-commit
    {% endif %}

  {% endspaceless %}"></i>
  {# fmt:off #}
{% endblock chip_icon %}

{% block chip_text %}
  {% if version.is_external %}#{% endif %}{{ version.verbose_name }}
{% endblock chip_text %}

{% block chip_detail %}
  <div class="detail">
    <i class="fa-solid icon {% spaceless %}

      {# Show some metadata on version status, almost always a check #}
                {% if version.active %}
                  {% if version.built %}
                    fa-check
                  {% else %}
                    red fa-xmark
                  {% endif %}
                {% else %}
                  light grey fa-question
                {% endif %}

              {% endspaceless %}"></i>
  </div>
{% endblock chip_detail %}

{% block popupcard_header %}
  {% if version.is_external %}
    {{ version.external_version_name | lower | capfirst }}
    {{ version.verbose_name }}
  {% else %}
    {# Translators: this renders with the version name, example "Version latest" #}
    {% blocktrans trimmed with version_name=version.verbose_name %}
      Version {{ version_name }}
    {% endblocktrans %}
  {% endif %}
{% endblock popupcard_header %}

{% block popupcard_right %}
{% endblock popupcard_right %}

{% block popupcard_meta %}
{% endblock popupcard_meta %}

{% block popupcard_content %}
  <div class="ui list">

    <div class="item">
      <i class="fa-duotone fa-box icon"></i>
      <div class="content">
        <div class="header">{% trans "Builds" %}</div>
        <div class="description">
          <a class="item" href="{% url "builds_project_list" version.project.slug %}?version__slug={{ version.slug }}">
            {% blocktrans trimmed with version_name=version.verbose_name %}
              For version {{ version_name }}
            {% endblocktrans %}
          </a>
        </div>
      </div>
    </div>

    <div class="item">
      <i class="fa-duotone {{ version.is_external|yesno:'fa-code-pull-request,fa-code-branch' }} icon"></i>
      <div class="content">
        <div class="header">{{ version.get_type_display|default:'Commit' }}</div>
        <div class="description">
          <a href="{{ version.vcs_url }}">
            {% if version.is_external %}#{% endif %}{{ version.verbose_name }}
          </a>
        </div>
      </div>
    </div>

    {# Skip the Knockout view additions from the API, it responds 404 for external versions #}
    {# TODO fix the API response or find a better way to provide a doc URL asynchronously #}
    {% if not version.is_external %}
      <div class="item" data-bind="if: urls && active && built">
        <i class="fad fa-book icon"></i>
        <div class="content">
          <div class="header">{% trans "Documentation" %}</div>
          <div class="description">
            <a data-bind="text: urls.documentation, attr: { href: urls.documentation }"></a>
          </div>
        </div>
      </div>
    {% endif %}

  </div>
{% endblock popupcard_content %}

{% block popupcard_extra %}
  {# Placeholder for the left #}
  <span></span>

  <div class="right floated">
    <span>
      {# Translators: this is a checkbox that describes whether the Version instance is enabled for building #}
      {% trans "Active" %}
      <i class="fas {{ version.active|yesno:'fa-check,red fa-xmark' }} icon"></i>
    </span>
    <span>
      {# Translators: this is a checkbox that describes whether the Version instance is successfully built #}
      {% trans "Built" %}
      <i class="fas {{ version.built|yesno:'fa-check,red fa-xmark' }} icon"></i>
    </span>
  </div>
{% endblock popupcard_extra %}