{% load i18n wagtailadmin_tags %}
{% comment %}

    Variables accepted by this template:

    - `page` - A wagtail page object
    - `classes` - String of extra css classes to pass to this component
{% endcomment %}

{% comment %} Unable to use pageurl template tag here due to issues in unit tests where request is not yet available - see #10157 {% endcomment %}
{% if page.live and page.url is not None %}
    {% test_page_is_public page as is_public %}

    <a href="{{ page.url }}" target="_blank" rel="noreferrer"
       class="
              page-status-tag
              u-text-uppercase
              w-inline-flex
              w-items-center
              w-justify-center
              w-whitespace-nowrap
              w-px-1
              w-ml-3
              w-text-11
              w-rounded-sm
              w-bg-transparent
              w-text-text-meta
              w-border
              w-border-border-furniture
              w-no-underline
              w-font-semibold
              hover:w-border-surface-menus
              hover:w-text-text-label
              w-transition"
       aria-label="{% if is_public %}{% trans 'Visible to all. Visit the live page' %}{% else %}{% trans 'Private. Visit the live page' %}{% endif %}"
       data-controller="w-tooltip"
       data-w-tooltip-content-value="{% if is_public %}{% trans 'Visible to all' %}{% else %}{% trans 'Private' %}{% endif %}"
       data-w-tooltip-offset-value="[0, 13]"
    >

        {% with icon_classes='privacy-indicator-icon w-w-4 w-h-4 w-mr-1' %}
            {% if is_public %}
                {% icon name="view" classname=icon_classes %}
            {% else %}
                {% icon name="no-view" classname=icon_classes %}
            {% endif %}
        {% endwith %}

        {% trans 'Live' %}
    </a>
{% endif %}
