{% extends 'dashboard.html' %}
{% load static %}

{% block head_title %}Products | {% endblock %}

{% block head %}
<script src="https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js"></script>
<script type="module" src="{% static 'scripts/sorting.js' %}" defer></script>
{% endblock %}

{% block content %}
<article>
    <header class="object-header">
        <h1><img src="{% static 'images/cubes.png' %}"> Catalog</h1>
        <div class="header-menu">
            <a href="{% url 'dashboard:category-create' %}" class="btn">+ New category</a>
            <a href="{% url 'dashboard:product-create' %}" class="btn">+ New product</a>
        </div>
    </header>
    <section class="panel">
        <header class="panel-header">
            <h4>Products</h4>
        </header>
        {% include 'dashboard/product/_table.html' with product_list=product_list %}
    </section>
</article>
{% endblock content %}
