{% extends "htmx_base.html" %}
{% load static %}

{% block header %}
    <header class="bg-neutral text-neutral-content">
        <nav class="navbar">
            <div class="navbar-start">
                {% block logo %}
                    <a class="link" href="{% url logo.url|default:'htmx:incident-list' %}">
                        <img class="object-scale-down h-14"
                             src="{% static logo.file|default:'logo_white.svg' %}"
                             alt="{{ logo.alt|default:'go to homepage' }}">
                    </a>
                {% endblock logo %}
            </div>
            <div class="navbar-center flex">
                <ul class="menu menu-horizontal px-1">
                    {% block navlinks %}
                        <li><a href="{% url 'htmx:incident-list' %}">Incidents</a></li>
                        <li><a href="{% url 'htmx:timeslot-placeholder' %}">Timeslots</a></li>
                        <li><a href="{% url 'htmx:notificationprofile-placeholder' %}">Profiles</a></li>
                    {% endblock navlinks %}
                </ul>
            </div>
            <div class="navbar-end">
                {% block userlink %}
                    {% if request.user.is_authenticated %}
                        <details class="dropdown dropdown-end">
                            <summary class="btn btn-base-200 btn-circle avatar placeholder"
                                     aria-description="User menu">
                                <span aria-hidden="true"
                                      class="size-10 rounded-full ring-base-200 ring-offset-primary ring ring-offset-2 text-2xl capitalize leading-9">
                                    {{ request.user|make_list|first }}
                                </span>
                            </summary>
                            <ul class="menu menu-md dropdown-content bg-base-200 text-base-content rounded-box z-[1] mt-3 w-52 p-2 shadow max-h-svh">
                                <li class="menu-title">
                                    Logged in as: <span class="text-info">{{ request.user }}</span>
                                    <div class="divider divider-secondary my-0"></div>
                                </li>
                                <li>
                                    {% include 'htmx/themes/theme_dropdown.html' %}
                                </li>
                                <li>
                                    {% include 'htmx/dateformat/_dateformat_dropdown.html' %}
                                </li>
                                <li>
                                    <form class="flex" action="{% url "htmx:logout" %}" method="POST">
                                        {% csrf_token %}
                                        <button class="flex-1 text-start" type="submit">Log out</button>
                                    </form>
                                </li>
                            </ul>
                        </details>
                    {% else %}
                        <a class="btn" href="{% url 'htmx:login' %}">Log in</a>
                    {% endif %}
                {% endblock %}
            </div>
        </nav>
    </header>
{% endblock header %}
