{% comment %}
# SPDX-License-Identifier: AGPL-3.0-or-later
{% endcomment %}

{# Template to display notifications under the navbar #}

{% load i18n %}
{% load static %}
{% load extras %}

{% if notifications %}
  <div id="notifications" class="notifications collapse no-no-js" hx-swap-oob="true">
    <ul>
      {% for note in notifications %}
        <li id="notification-{{ note.id }}"
            class="notification notification-{{ note.severity }}">
          <div class="notification-header">
            <span class="notification-time"
                  title="{{ note.last_update_time|date:'DATETIME_FORMAT' }}">
              {% blocktrans trimmed with time_since=note.last_update_time|timesince %}
                {{ time_since }} ago
              {% endblocktrans %}
            </span>

            {% if note.data.app_name %}
              <div class="app-name">
                {% if note.data.app_icon %}
                  <div class="app-icon fa {{ note.data.app_icon }}"></div>
                {% elif note.data.app_icon_filename %}
                  {% if note.app_id %}
                    {% icon note.app_id|add:'/icons/'|add:note.data.app_icon_filename|add:'.svg' alt=note.data.app_name class='notification-icon' %}
                  {% else %}
                    {% icon note.data.app_icon_filename alt=note.data.app_name class='notification-icon' %}
                  {% endif %}
                {% endif %}
                {{ note.data.app_name }}
              </div>
            {% endif %}
          </div>

          {% if note.body %}
            {{ note.body.content.decode|safe }}
          {% else %}
            <div class="notification-title">{{ note.title }}</div>

            {% if note.message %}
              <p>{{ note.message }}</p>
            {% endif %}

            {% if note.actions %}
              <div class="btn-toolbar">
                {% for action in note.actions %}
                  {% if action.type == "dismiss" %}
                    {% include 'notifications-dismiss-button.html' with id=note.id %}
                  {% else %}
                    <a href="{% url action.url %}" role="button"
                       class="btn btn-{{ action.class|default:'default' }}">
                      {{ action.text }}
                    </a>
                  {% endif %}
                {% endfor %}
              </div>
            {% endif %}
          {% endif %}
        </li>
      {% endfor %}
    </ul>
  </div>
{% endif %}
