{% extends "base.html" %}
{% load relations %}
{% load static %}
{% load i18n %}

{% block main-menu %}
  {{ block.super }}

  {% block relations-menu %}
    <li class="nav-item dropdown">
      <a href="#"
         class="nav-link dropdown-toggle"
         data-bs-toggle="dropdown"
         role="button"
         aria-haspopup="true"
         aria-expanded="false">{% translate "Relations" %}
        <span class="caret" />
      </a>
      <div class="dropdown-menu" aria-labelledby="navbarDropdown">
        <a class="dropdown-item"
           href="{% url "apis_core:generic:list" "relations.relation" %}">{% translate "All relations" %}</a>
        <div class="dropdown-divider"></div>
        <form class="mx-2">
          <input type="text"
                 id="relationFilter"
                 class="form-control mb-2 form-control-sm"
                 placeholder="{% translate "Filter relations..." %}">
        </form>
        <div id="relationList">
          {% get_relation_content_types as content_types %}
          {% for content_type in content_types %}
            <a class="dropdown-item relation-item"
               href="{{ content_type.model_class.get_listview_url }}">{{ content_type.model_class.name_and_reverse_name }}</a>
          {% endfor %}
        </div>
      </div>
    </li>
  {% endblock relations-menu %}
{% endblock main-menu %}

{% block scriptHeader %}
  {{ block.super }}
  <script src="{% static 'js/filter_relations_menu.js' %}"></script>
{% endblock scriptHeader %}

{% block styles %}
  {{ block.super }}
  <link rel="stylesheet" href="{% static 'css/relations.css' %}">
{% endblock styles %}
