Add badges showing current filters for tables

helpdesk/helpdesk/settings.py

@@ -94,6 +94,7 @@
 INSTALLED_APPS = [
     "accounts",
     "display",
+    "helpdesk",
     "teams",
     "tickets",
     "crispy_forms",

helpdesk/helpdesk/templatetags/filter_helpers.py

@@ -0,0 +1,42 @@
+from __future__ import annotations
+
+from typing import TYPE_CHECKING, Any
+
+from django import template
+from django.forms import Field
+from django_filters.fields import ChoiceField
+
+if TYPE_CHECKING:
+    from django_filters import FilterSet
+
+register = template.Library()
+
+
+def _get_value_display_for_choices(choice_field: ChoiceField, value: Any) -> Any:
+    choices = dict(choice_field.choices.choices)
+    return choices.get(value, value)
+
+
+def _get_value_display_for_field(field: Field, value: Any) -> Any:
+    if isinstance(field, ChoiceField):
+        return _get_value_display_for_choices(field, value)
+
+    return value
+
+
+@register.inclusion_tag("inc/tags/filter_badges.html")
+def render_filter_badges(filterset: FilterSet) -> dict[str, Any]:
+    if filterset.is_valid():  # type: ignore[no-untyped-call]
+        cleaned_data = {k: v for k, v in filterset.form.cleaned_data.items() if v is not None and v != ""}
+    else:
+        cleaned_data = {}
+
+    filter_badges = {
+        (
+            filterset.form.fields[field_name].label,
+            _get_value_display_for_field(filterset.form.fields[field_name], value),
+        )
+        for field_name, value in cleaned_data.items()
+    }
+
+    return {"filter_badges": filter_badges}

helpdesk/templates/inc/tags/filter_badges.html

@@ -0,0 +1,14 @@
+{# render using the render_filter_badges templatetag #}
+{% if filter_badges %}
+    <div class="field is-grouped is-grouped-multiline">
+        {% for label, value in filter_badges %}
+            <div class="control">
+                <div class="tags has-addons">
+                    <span class="tag is-dark">{{ label }}</span>
+                    <a class="tag is-link">{{ value }}</a>
+                    <a class="tag is-delete js-modal-trigger" data-target="modal-filter"></a>
+                </div>
+            </div>
+        {% endfor %}
+    </div>
+{% endif %}

helpdesk/templates/teams/team_detail_tickets.html

@@ -1,6 +1,7 @@
 {% extends "layouts/base_app.html" %}
 {% load render_table from django_tables2 %}
 {% load crispy_forms_tags %}
+{% load filter_helpers %}
 
 {% block page_title %}{{object.tla}}: {{ object.name }}{% endblock %}
 {% block title %}{{object.tla}}: {{ object.name }}{% endblock %}
@@ -14,9 +15,12 @@
 
 {% block content %}
     {% include "inc/nav/team-tabs.html" with active="tickets" team=object %}
-    <div class="container columns">
-        <div class="column">
-            {% render_table table %}
+    <div class="container">
+        {% render_filter_badges filter %}
+        <div class="columns">
+            <div class="column">
+                {% render_table table %}
+            </div>
         </div>
     </div>
     {% include "inc/modals/filter.html" %}

helpdesk/templates/teams/team_filter.html

@@ -1,6 +1,7 @@
 {% extends "layouts/base_app.html" %}
 {% load render_table from django_tables2 %}
 {% load crispy_forms_tags %}
+{% load filter_helpers %}
 
 {% block page_title %}Teams{% endblock %}
 {% block title %}Teams{% endblock %}
@@ -10,9 +11,12 @@
 {% endblock %}
 
 {% block content %}
-    <div class="container columns">
-        <div class="column">
-            {% render_table table %}
+    <div class="container">
+        {% render_filter_badges filter %}
+        <div class="columns">
+            <div class="column">
+                {% render_table table %}
+            </div>
         </div>
     </div>
     {% include "inc/modals/filter.html" %}

helpdesk/templates/tickets/ticketqueue_assigned.html

@@ -1,5 +1,6 @@
 {% extends "layouts/base_app.html" %}
 {% load render_table from django_tables2 %}
+{% load filter_helpers %}
 
 {% block page_title %}My Tickets{% endblock %}
 {% block title %}My Tickets{% endblock %}
@@ -10,6 +11,7 @@
 
 {% block content %}
   <div class="container">
+    {% render_filter_badges filter %}
     <div class="columns">
       {% render_table table %}
     </div>

helpdesk/templates/tickets/ticketqueue_detail.html

@@ -1,5 +1,6 @@
 {% extends "layouts/base_app.html" %}
 {% load render_table from django_tables2 %}
+{% load filter_helpers %}
 
 {% block page_title %}Queue: {{ object.name }}{% endblock %}
 {% block title %}Queue: {{ object.name }}{% endblock %}
@@ -38,6 +39,7 @@
         </aside>
       </div>
       <div class="column">
+        {% render_filter_badges filter %}
         <p class="block">{{ object.description }}</p>
         {% render_table table %}
       </div>

helpdesk/templates/tickets/tickets_all.html

@@ -1,5 +1,6 @@
 {% extends "layouts/base_app.html" %}
 {% load render_table from django_tables2 %}
+{% load filter_helpers %}
 
 {% block page_title %}All Tickets{% endblock %}
 {% block title %}All Tickets{% endblock %}
@@ -13,6 +14,7 @@
 
 {% block content %}
   <div class="container">
+    {% render_filter_badges filter %}
     <div class="columns">
       {% render_table table %}
     </div>