{% extends "wagtailadmin/generic/edit.html" %}
{% load i18n wagtailadmin_tags %}

{% block bodyclass %}page-editor{% endblock %}

{% block titletag %}{% blocktrans with instance=translation.source.as_instance locale=translation.target_locale %}Translation of {{ instance }} into {{ locale }}{% endblocktrans %}{% endblock %}

{% block content %}
    {% if not has_legacy_styling %}
        {% if is_page %}
            <div class="w-sticky w-top-0 w-z-header">
                {% include 'wagtailadmin/shared/headers/page_edit_header.html' with page=instance page_for_status=instance page_perms=page_perms content_type=instance.content_type %}
                {% include "wagtailadmin/shared/side_panels.html" with page=instance page_for_status=instance page_perms=page_perms content_type=instance.content_type %}
            </div>
        {% else %}
            <div class="w-sticky w-top-0 w-z-header">
                {% include 'wagtail_localize/admin/includes/generic_header.html' %}
                {# FIXME: include side panels #}
            </div>
            {% include "wagtailadmin/shared/header.html" with title=instance icon="snippet" merged=1 only %}
        {% endif %}
    {% endif %}
    <div class="js-translation-editor" data-props="{{ props }}">
        {# Generates the CSRF token hidden input. This is read by the JavaScript. #}
        {% csrf_token %}
    </div>
{% endblock %}

{% block extra_css %}
    {% if has_legacy_styling %}
        {% include "wagtailadmin/pages/_editor_css.html" %}
    {% endif %}
{% endblock %}

{% block extra_js %}
    {% include "wagtailadmin/pages/_editor_js.html" %}

    <script src="{% url 'wagtail_localize:javascript_catalog' %}"></script>

    {% if has_legacy_styling %}
        <script src="{% versioned_static 'wagtailadmin/js/page-chooser-modal.js' %}"></script>
        <script src="{% versioned_static 'wagtailimages/js/image-chooser-modal.js' %}"></script>
        <script src="{% versioned_static 'wagtaildocs/js/document-chooser-modal.js' %}"></script>
        <script src="{% versioned_static 'wagtailsnippets/js/snippet-chooser-modal.js' %}"></script>
    {% else %}
        <script src="{% versioned_static 'wagtailadmin/js/page-chooser-modal.js' %}"></script>
        <script src="{% versioned_static 'wagtailadmin/js/page-chooser.js' %}"></script>
        <script src="{% versioned_static 'wagtailimages/js/image-chooser-modal.js' %}"></script>
        <script src="{% versioned_static 'wagtailimages/js/image-chooser.js' %}"></script>
        <script src="{% versioned_static 'wagtaildocs/js/document-chooser-modal.js' %}"></script>
        <script src="{% versioned_static 'wagtaildocs/js/document-chooser.js' %}"></script>
        <script src="{% versioned_static 'wagtailadmin/js/chooser-modal.js' %}"></script>
        <script src="{% versioned_static 'wagtailsnippets/js/snippet-chooser.js' %}"></script>
    {% endif %}
    <script src="{% versioned_static 'wagtail_localize/js/wagtail-localize.js' %}"></script>
{% endblock %}
