{% extends 'base/layout.html' %}
{% load helpers %}
{% load render_table from django_tables2 %}
{% load i18n %}

{% block header %}
  {% if new_release %}
    {# new_release is set only if the current user is a superuser or staff member #}
    <div class="header-alert-container">
      <div class="alert alert-info text-center mw-md-50" role="alert">
        <h6 class="alert-heading">
          <i class="mdi mdi-information-outline"></i><br/>{% trans "New Release Available" %}
        </h6>
        <small><a href="{{ new_release.url }}">NetBox v{{ new_release.version }}</a> {% trans "is available" %}.</small>
        <hr class="my-2" />
        <small class="mb-0">
          <a href="https://docs.netbox.dev/en/stable/installation/upgrading/">{% trans "Upgrade Instructions" context "Document title" %}</a>
        </small>
      </div>
    </div>
  {% endif %}
{% endblock %}

{% block title %}{% trans "Home" %}{% endblock %}

{% block content-wrapper %}
  {# Render the user's customized dashboard #}
  <div class="grid-stack" id="dashboard">
    {% for widget in dashboard %}
      {% include 'extras/dashboard/widget.html' %}
    {% endfor %}
  </div>
  <div class="collapse multi-collapse show">
    <div class="d-flex px-3">
      <div class="flex-grow-1">
        <button type="button" id="unlock_dashboard" class="btn btn-light btn-sm" data-bs-toggle="collapse" data-bs-target=".multi-collapse">
          <i class="mdi mdi-lock-open-outline"></i> {% trans "Unlock Dashboard" %}
        </button>
      </div>
    </div>
  </div>
  <div class="collapse multi-collapse">
    <div class="d-flex px-3">
      <div class="flex-grow-1">
        <button type="button" id="lock_dashboard" class="btn btn-light btn-sm" data-bs-toggle="collapse" data-bs-target=".multi-collapse">
          <i class="mdi mdi-lock-outline"></i> {% trans "Lock Dashboard" %}
        </button>
      </div>
      <div>
        <a href="#"
          hx-get="{% url 'extras:dashboardwidget_add' %}"
          hx-target="#htmx-modal-content"
          data-bs-toggle="modal"
          data-bs-target="#htmx-modal"
          class="btn btn-success btn-sm"
        >
          <i class="mdi mdi-plus"></i> {% trans "Add Widget" %}
        </a>
        <button id="save_dashboard" class="btn btn-primary btn-sm" data-url="{% url 'extras-api:dashboard' %}">
          <i class="mdi mdi-content-save-outline"></i> {% trans "Save Layout" %}
        </button>
        <a href="{% url 'extras:dashboard_reset' %}" class="btn btn-danger btn-sm">
          <i class="mdi mdi-backspace"></i>  {% trans "Reset Dashboard" %}
        </a>
      </div>
    </div>
  </div>
{% endblock content-wrapper %}

{% block modals %}
  {% include 'inc/htmx_modal.html' %}
{% endblock modals %}