{% extends "layouts/base.html" %}

{% block title %}
  {{ _("Third Parties") }}
{% endblock %}

{% block stylesheets %}{% endblock %}

{% block content %}
  <main class="main-content position-relative border-radius-lg">
    <div class="container-fluid py-4">
      <div class="col-12">
        {% include "pages/third_parties/third_parties_list.html" %}
      </div>
    </div>
  </main>
{% endblock %}

{% block javascripts %}
  <script>
    window.onload = function() {
      resize_event = new Event("resize");
      window.dispatchEvent(resize_event);
    }
  </script>
  <script>
    function changePage(tab_name) {
      var tab_nav_link = document.querySelector("#" + tab_name + "-tab");
      if (tab_nav_link) {
        tab_nav_link.parentElement.parentElement.onmouseover(tab_nav_link);
        tab_nav_link.click();
      }
    }
    {% if tab_name %}
      document.addEventListener("DOMContentLoaded", function() {
        setTimeout(function() {
          changePage("{{ tab_name }}");
        }, 500);
      });
    {% endif %}
  </script>
  <script>
    $('#third-parties-tabs a[data-toggle="pill"]').on("shown.bs.tab", function (e) {
      var target_id = e.target.id.slice(0, -4);
      var new_url = "/third-parties/" + target_id;
      if (!(window.location.pathname.startsWith(new_url))) {
        // window.location.pathname = new_url;
        window.history.pushState({}, "", new_url);
      }
    });
  </script>
{% endblock %}
