{% extends "admin/base_site.html" %}
{% load i18n static admin_extras operator_journey staff_tasks tz widgets %}

{% block extrastyle %}
  {{ block.super }}
  <link rel="stylesheet" href="{% static 'admin/css/dashboard.css' %}">
  {% include "admin/includes/dashboard_styles.html" %}
{% endblock %}

{% block coltype %}colM{% endblock %}

{% block bodyclass %}{{ block.super }} dashboard{% endblock %}

{% block content_title %}
{% last_net_message as admin_last_net_message %}
<div id="admin-home-header">
  <h1>Home</h1>
  <div class="admin-home-status">
    {% operator_journey_status as operator_journey %}
    {% if operator_journey.has_journey %}
      <div class="admin-home-operator-journey" role="status" aria-live="polite">
        {% if operator_journey.url %}
          <span class="admin-home-operator-journey__label">{% translate "Next:" %}</span>
          <a class="admin-home-operator-journey__link" href="{{ operator_journey.url }}">{{ operator_journey.task_title|default:operator_journey.message }}</a>
        {% else %}
          <span class="admin-home-operator-journey__text">{{ operator_journey.message }}</span>
        {% endif %}
      </div>
    {% endif %}
    <div class="admin-home-net-message" role="status" aria-live="polite">
      <a
        class="admin-home-net-message__icon admin-home-net-message__link"
        href="{% url 'admin:nodes_netmessage_changelist' %}"
        aria-label="{% translate 'Net messages' %}"
        title="{% translate 'Net messages' %}"
      >
        <svg viewBox="0 0 24 24" focusable="false" aria-hidden="true">
          <path fill="currentColor" d="M3 6.75A1.75 1.75 0 0 1 4.75 5h14.5A1.75 1.75 0 0 1 21 6.75v10.5A1.75 1.75 0 0 1 19.25 19H4.75A1.75 1.75 0 0 1 3 17.25V6.75zm2.16-.25L12 11.18l6.84-4.68H5.16zM19.5 8.2l-6.93 4.74a1 1 0 0 1-1.14 0L4.5 8.2v9.05c0 .14.11.25.25.25h14.5c.14 0 .25-.11.25-.25V8.2z"/>
        </svg>
      </a>
      {% if admin_last_net_message.has_content %}
        {% if admin_last_net_message.url %}
          <a class="admin-home-net-message__content admin-home-net-message__link" href="{{ admin_last_net_message.url }}" title="{{ admin_last_net_message.text }}">{{ admin_last_net_message.text }}</a>
        {% else %}
          <span class="admin-home-net-message__content" title="{{ admin_last_net_message.text }}">{{ admin_last_net_message.text }}</span>
        {% endif %}
      {% else %}
        {% translate 'No net messages available' as no_message_text %}
        <span class="admin-home-net-message__content admin-home-net-message__content--empty" title="{{ no_message_text }}">{{ no_message_text }}</span>
      {% endif %}
    </div>
  </div>
  <div class="admin-home-actions-wrap">
    <div class="admin-home-actions">
      {% if perms.features.view_feature %}
        <a class="button" href="{% url 'admin:features_feature_changelist' %}">
          {% translate "Features" %}
        </a>
      {% endif %}
      {% if perms.ocpp.view_charger %}
        <a class="button" href="{% url 'admin:chargers-shortcut' %}">
          {% translate "Chargers" %}
        </a>
      {% endif %}
      {% if operator_journey.has_journey %}
        <a class="button" href="{% url 'ops:operator-journey-dashboard' %}">
          {% translate "Operator Journey" %}
        </a>
      {% endif %}
      {% admin_staff_tasks as staff_tasks %}
      {% for task in staff_tasks %}
        <a class="button" href="{{ task.url }}">{{ task.label }}</a>
      {% endfor %}
    </div>
  </div>
</div>
{% endblock %}

{% block nav-breadcrumbs %}{% endblock %}
{% block nav-sidebar %}{% endblock %}

{% block content %}
  <div class="dashboard" id="admin-dashboard">
    <div id="content-main" class="dashboard-main">
    {% include "admin/dashboard_app_list.html" with app_list=app_list enable_app_visibility_controls=True %}
    </div>
    {% if app_list %}
      <div class="dashboard-side" id="recent-boxes">
        <div
          id="admin-dashboard-widgets"
          hx-get="{% url 'widgets:zone' 'sidebar' %}"
          hx-trigger="load"
          hx-swap="innerHTML"
        >
          <p>{% translate "Loading widgets..." %}</p>
          <noscript>
            {% render_widgets 'sidebar' %}
          </noscript>
        </div>
        <p>
          <a href="{% url 'admin:widgets_widget_changelist' %}">
            {% translate "Configure Widgets" %}
          </a>
        </p>
      </div>
    {% endif %}
  </div>
{% endblock %}

{% block sidebar %}{% endblock %}

{% block extrahead %}
  {{ block.super }}
  <script>
    (function () {
      const dashboardStoragePrefix = "admin-dashboard-hidden-apps";
      const storageUserKey = "{{ request.user.pk|default:'anon'|escapejs }}";
      window.__adminDashboardUserKey = storageUserKey;
      const storageKey = `${dashboardStoragePrefix}:${window.location.origin}:${storageUserKey}`;
      const hiddenApps = JSON.parse(window.localStorage.getItem(storageKey) || "[]");

      if (!Array.isArray(hiddenApps) || hiddenApps.length === 0) {
        return;
      }

      const sanitizedLabels = hiddenApps
        .filter((label) => typeof label === "string" && label.length)
        .map((label) => label.replace(/[^a-zA-Z0-9_-]/g, ""));

      if (!sanitizedLabels.length) {
        return;
      }

      const styleTag = document.createElement("style");
      styleTag.id = "dashboard-app-visibility-bootstrap";
      styleTag.textContent = sanitizedLabels
        .map((label) => `#content-main .module[data-app-label=\"${label}\"]{display:none;}`)
        .join("\n");
      document.head.appendChild(styleTag);
    })();
  </script>
  <script src="{% static 'sites/js/admin_dashboard_visibility.js' %}" defer></script>
{% endblock %}