{#
┌───────────────────────────────────────────────────────────────────────────┐
│                            #global-container                              │
│ ┌────────┐ ┌────────────────────────────────────────────────────────────┐ │
│ │        │ │                      #main-container                       │ │
│ │        │ │ ┌────────────────────────────────────────────────────────┐ │ │
│ │        │ │ │                        #alerts                         │ │ │
│ │        │ │ └────────────────────────────────────────────────────────┘ │ │
│ │        │ │ ┌────────────────────────────────────────────────────────┐ │ │
│ │        │ │ │                        #crumbs                         │ │ │
│ │        │ │ └────────────────────────────────────────────────────────┘ │ │
│ │        │ │ ┌────────────────────────────────────────────────────────┐ │ │
│ │        │ │ │                         #main                          │ │ │
│ │        │ │ │ ┌────────────────────────────────────────────────────┐ │ │ │
│ │        │ │ │ │                   #main-form (?)                   │ │ │ │
│ │        │ │ │ │ ┌────────────────────────────────────────────────┐ │ │ │ │
│ │        │ │ │ │ │                    #header                     │ │ │ │ │
│ │        │ │ │ │ └────────────────────────────────────────────────┘ │ │ │ │
│ │        │ │ │ │ ┌────────────────────────────────────────────────┐ │ │ │ │
│ │        │ │ │ │ │                 #main-content                  │ │ │ │ │
│ │#global-│ │ │ │ │ ┌────────┐ ┌──────────────────────┐ ┌────────┐ │ │ │ │ │
│ │sidebar │ │ │ │ │ │        │ │  #content-container  │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ ┌──────────────────┐ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ │    #tabs (?)     │ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ └──────────────────┘ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ ┌──────────────────┐ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ │                  │ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │#sidebar│ │ │                  │ │ │#details│ │ │ │ │ │
│ │        │ │ │ │ │ │  (?)   │ │ │                  │ │ │  (?)   │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ │     #content     │ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ │                  │ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ │                  │ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ │                  │ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ │                  │ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ │        │ │ └──────────────────┘ │ │        │ │ │ │ │ │
│ │        │ │ │ │ │ └────────┘ └──────────────────────┘ └────────┘ │ │ │ │ │
│ │        │ │ │ │ └────────────────────────────────────────────────┘ │ │ │ │
│ │        │ │ │ └────────────────────────────────────────────────────┘ │ │ │
│ │        │ │ └────────────────────────────────────────────────────────┘ │ │
│ └────────┘ └────────────────────────────────────────────────────────────┘ │
└───────────────────────────────────────────────────────────────────────────┘
#}

{% extends "_layouts/basecp" %}

{# The CP only supports queue components that implement QueueInterface #}
{% set queue = craft.app.queue %}
{% js %}
    {% if queue is instance of("craft\\queue\\QueueInterface") %}
        Craft.cp.setJobInfo({{ queue.getJobInfo(100)|json_encode|raw }}, false);
        {% if queue.getHasReservedJobs() %}
            Craft.cp.trackJobProgress(true);
        {% elseif queue.getHasWaitingJobs() %}
            Craft.cp.runQueue();
        {% endif %}
    {% else %}
        Craft.cp.enableQueue = false;
    {% endif %}
{% endjs %}

{% set hasSystemIcon = CraftEdition == CraftPro and craft.rebrand.isIconUploaded %}

{% set forceConfirmUnload = craft.app.session.hasFlash('error') %}
{% set fullPageForm = (fullPageForm is defined and fullPageForm) %}

{% set canUpgradeEdition = craft.app.getCanUpgradeEdition() %}
{% set licensedEdition = craft.app.getLicensedEdition() %}
{% set isTrial = licensedEdition is not same as(null) and licensedEdition is not same as(CraftEdition) %}

{% set sidebar = (sidebar ?? block('sidebar') ?? '')|trim %}
{% set details = (details ?? block('details') ?? '')|trim %}
{% set crumbs = crumbs ?? null %}

{% block body %}
    <div id="global-container">
        <header id="global-sidebar" class="sidebar">
            {% if currentUser.admin and craft.app.config.general.devMode %}
                <div id="devmode" title="{{ 'Craft CMS is running in Dev Mode.'|t('app') }}"></div>
            {% endif %}

            <a id="system-info" class="menubtn" role="button" data-menu-anchor="#user-info">
                <div id="site-icon">
                    {% if hasSystemIcon %}
                        <img src="{{ craft.rebrand.icon.url }}" alt="">
                    {% else %}
                        {{ svg('@app/icons/circle-c-outline.svg') }}
                    {% endif %}
                </div>
                <div id="system-name">
                    <h2>{{ systemName }}&nbsp;<span data-icon="downangle"></span></h2>
                    <div id="user-info">
                        {% if currentUser.photoId %}
                            <div id="user-photo">
                                <img width="14" sizes="14px" srcset="{{ currentUser.getThumbUrl(14) }} 14w, {{ currentUser.getThumbUrl(28) }} 28w" alt="{{ currentUser.getName() }}">
                            </div>
                        {% endif %}
                        <div>{{ currentUser.friendlyName }}</div>
                    </div>
                </div>
            </a>

            <div class="menu" data-align="left">
                <ul>
                    <li><a href="{{ siteUrl }}" target="_blank">{{ 'View site'|t('app') }}</a></li>
                </ul>
                <hr>
                <ul>
                    <li><a href="{{ url('myaccount') }}">{{ 'My Account'|t('app') }}</a></li>
                    <li><a href="{{ url('logout') }}">{{ "Sign out"|t('app') }}</a></li>
                </ul>
            </div>

            <nav id="nav">
                <ul>
                    {% for item in craft.cp.nav() %}
                        {% set hasSubnav = (item.subnav is defined and item.subnav) %}
                        <li id="{{ item.id }}" {% if item.sel and hasSubnav %} class="has-subnav"{% endif %}>
                            <a{% if item.sel %} class="sel"{% endif %} href="{{ item.url }}">
                                <span class="icon icon-mask">
                                    {%- if item.icon is defined -%}
                                        {{ svg(item.icon) }}
                                    {%- elseif item.fontIcon is defined -%}
                                        <span data-icon="{{ item.fontIcon }}"></span>
                                    {%- else -%}
                                        {% include "_includes/defaulticon.svg" with { label: item.label } %}
                                    {%- endif -%}
                                </span>

                                <span class="label">
                                    {{- item.label -}}
                                </span>

                                {%- if not item.sel and item.badgeCount -%}
                                    <span class="badge">{{ item.badgeCount }}</span>
                                {%- endif -%}
                            </a>
                            {% if item.sel and hasSubnav %}
                                <ul class="subnav">
                                    {% for itemId, item in item.subnav %}
                                        {% set itemIsSelected = (
                                            (selectedSubnavItem is defined and selectedSubnavItem == itemId) or
                                            (selectedSubnavItem is not defined and loop.first)
                                        ) -%}

                                        <li>
                                            <a href="{{ url(item.url) }}"{% if itemIsSelected %} class="sel"{% endif %}>{{ item.label }}</a>
                                        </li>

                                    {% endfor %}
                                </ul>
                            {% endif %}
                        </li>
                    {% endfor %}
                </ul>
            </nav>

            <div id="app-info">
                <div id="edition" {% if canUpgradeEdition %}class="hot" title="{{ 'Manage your Craft CMS edition'|t('app') }}"{% else %}class="edition"{% endif %}>
                    <div id="edition-logo">
                        <div class="edition-name">{{ craft.app.getEditionName() }}</div>
                        {% if isTrial %}
                            <div class="edition-trial">{{ "Trial"|t('app') }}</div>
                        {% endif %}
                    </div>
                </div>
                <div id="version">Craft CMS {{ craft.app.version }}</div>
            </div>
        </header><!-- #global-sidebar -->

        <div id="main-container">

            {# alerts #}
            {% if craft.cp.areAlertsCached() %}
                {% set alerts = craft.cp.getAlerts() %}
                {% if alerts %}
                    <ul id="alerts">
                        {% for alert in craft.cp.getAlerts() %}
                            <li>{{ alert|raw }}</li>
                        {% endfor %}
                    </ul>
                {% endif %}
            {% else %}
                {% js %}
                Craft.cp.fetchAlerts();
                {% endjs %}
            {% endif %}

            {# notifications #}
            <div id="notifications-wrapper">
                <div id="notifications">
                    {% for type in ['notice', 'error'] %}
                        {% set message = craft.app.session.getFlash(type) %}
                        {% if message %}
                            <div class="notification {{ type }}">{{ message }}</div>
                        {% endif %}
                    {% endfor %}
                </div>
            </div>

            {# crumbs #}
            <div id="crumbs"{% if not crumbs %} class="empty"{% endif %}>
                <a id="nav-toggle" title="{{ 'Show nav'|t('app') }}"></a>
                {% if crumbs %}
                    <nav>
                        <ul>
                            {% for crumb in crumbs %}
                                <li><a href="{{ crumb.url }}">{{ crumb.label }}</a></li>
                            {% endfor %}
                        </ul>
                    </nav>
                {% endif %}
            </div>

            {# main #}
            <main id="main" role="main">

                {% if fullPageForm -%}
                    <form id="main-form" method="post" accept-charset="UTF-8" data-saveshortcut{% if saveShortcutRedirect is defined %} data-saveshortcut-redirect="{{ saveShortcutRedirect|hash }}"{% endif %} data-confirm-unload>
                        {{- csrfInput() }}
                {%- endif %}

                {# main-header #}
                <header id="header">
                    {% block header %}
                        {% block pageTitle %}
                            {% if title is defined and title|length %}
                                <h1>{{ title }}</h1>
                            {% endif %}
                        {% endblock %}
                        {% block contextMenu %}{% endblock %}
                        <div class="flex-grow"></div>
                        {% block actionButton %}
                            {% if fullPageForm %}
                                <input type="submit" class="btn submit" value="{{ 'Save'|t('app') }}">
                            {% endif %}
                        {% endblock %}
                    {% endblock %}
                </header>

                {# main-content #}
                <div id="main-content" class="{% if sidebar %}has-sidebar{% endif %} {% if details %}has-details{% endif %}">
                    {% block main %}
                        {# sidebar #}
                        {% if sidebar is not empty %}
                            <a id="sidebar-toggle"><span id="selected-sidebar-item-label"></span>&nbsp;<span data-icon="downangle"></span></a>
                            <div id="sidebar" class="sidebar">
                                {{ sidebar|raw }}
                            </div>
                        {% endif %}

                        {# content-container #}
                        <div id="content-container">
                            {% block tabs %}
                                {% if tabs is defined and tabs %}
                                    {% include "_includes/tabs" %}
                                {% endif %}
                            {% endblock %}

                            <div id="content">
                                {% block content %}
                                    {{ content is defined ? content }}
                                {% endblock %}
                            </div>
                        </div>

                        {# details #}
                        {% if details is not empty %}
                            <div id="details">
                                {{ details|raw }}
                            </div>
                        {% endif %}
                    {% endblock %}
                </div>

                {% if fullPageForm -%}
                    </form><!-- #main-form -->
                {%- endif %}
            </main><!-- #main -->
        </div><!-- #main-container -->
    </div><!-- #global-container -->
{% endblock %}


{% if currentUser.can('performUpdates') and not craft.app.updates.getIsUpdateInfoCached() %}
    {% js %}
        Craft.cp.checkForUpdates();
    {% endjs %}
{% endif %}
