Only update affected media list when deleting destination in HTMX fro…

…ntend

* Update only related list when deleting destination
* Remove functionality for generic error

This was added so the
"This destination cannot be deleted error" could be shown
separate from field specific errors, but after the changes
done to the delete endpoint this is no longer used.
_render_destination_list is complicated enough as-is that
removing this makes it a bit nicer

changelog.d/1128.fixed.md

@@ -0,0 +1 @@
+Only update the related media list when deleting a destination.

src/argus/htmx/destination/views.py

@@ -29,16 +29,24 @@ def create_htmx(request) -> HttpResponse:
 @require_http_methods(["POST"])
 def delete_htmx(request, pk: int) -> HttpResponse:
     destination = get_object_or_404(request.user.destinations.all(), pk=pk)
-    template = "htmx/destination/_form_list.html"
+    media = destination.media
+    error_msg = None
     try:
         medium = api_safely_get_medium_object(destination.media.slug)
         medium.raise_if_not_deletable(destination)
     except NotificationMedium.NotDeletableError:
-        error_msg = "This destination cannot be deleted."
-        return _render_destination_list(request, errors=[error_msg], template=template)
+        error_msg = "That destination cannot be deleted."
     else:
         destination.delete()
-        return _render_destination_list(request, template=template)
+
+    forms = _get_update_forms(request.user, media=media)
+
+    context = {
+        "error_msg": error_msg,
+        "forms": forms,
+        "media": media,
+    }
+    return render(request, "htmx/destination/_collapse_with_forms.html", context=context)
 
 
 @require_http_methods(["POST"])
@@ -62,7 +70,6 @@ def _render_destination_list(
     request,
     create_form: Optional[DestinationFormCreate] = None,
     update_forms: Optional[Sequence[DestinationFormUpdate]] = None,
-    errors: Optional[Sequence[str]] = None,
     template: str = "htmx/destination/destination_list.html",
 ) -> HttpResponse:
     """Function to render the destinations page.
@@ -71,29 +78,31 @@ def _render_destination_list(
     with errors while retaining the user input. If you want a blank form, pass None.
     :param update_forms: list of update forms to display. Useful for rendering forms
     with error messages while retaining the user input.
-    If this is None, the update forms will be generated from the user's destinations.
-    :param errors: a list of error messages to display on the page. Will not be tied to
-    any form fields."""
+    If this is None, the update forms will be generated from the user's destinations."""
 
     if create_form is None:
         create_form = DestinationFormCreate()
     if update_forms is None:
         update_forms = _get_update_forms(request.user)
-    if errors is None:
-        errors = []
     grouped_forms = _group_update_forms_by_media(update_forms)
     context = {
         "create_form": create_form,
         "grouped_forms": grouped_forms,
-        "errors": errors,
         "page_title": "Destinations",
     }
     return render(request, template, context=context)
 
 
-def _get_update_forms(user) -> list[DestinationFormUpdate]:
+def _get_update_forms(user, media: Media = None) -> list[DestinationFormUpdate]:
+    """Get a list of update forms for the user's destinations.
+    :param media: if provided, only return destinations for this media.
+    """
+    if media:
+        destinations = user.destinations.filter(media=media)
+    else:
+        destinations = user.destinations.all()
     # Sort by oldest first
-    destinations = user.destinations.all().order_by("pk")
+    destinations = destinations.order_by("pk")
     return [DestinationFormUpdate(instance=destination) for destination in destinations]
 
 

src/argus/htmx/templates/htmx/destination/_collapse_with_forms.html

@@ -0,0 +1,12 @@
+<details class="collapse bg-base-200 collapse-arrow" open="">
+  <summary class="collapse-title text-xl font-medium">{{ media.name }} ({{ forms|length }})</summary>
+  <div class="collapse-content">
+    {% if error_msg %}<p class="text-error">{{ error_msg }}</p>{% endif %}
+    {% for form in forms %}
+      <div class="flex w-full h-fit items-center justify-center">
+        {% include "htmx/destination/_edit_form.html" %}
+        {% include "htmx/destination/_delete_form.html" %}
+      </div>
+    {% endfor %}
+  </div>
+</details>

src/argus/htmx/templates/htmx/destination/_content.html

@@ -1,5 +1,4 @@
 <div id="destination-content" class="flex flex-col items-center gap-4">
   {% include "htmx/destination/_create_form.html" %}
-  {% for error in errors %}<p class="text-error">{{ error }}</p>{% endfor %}
   {% include "htmx/destination/_form_list.html" %}
 </div>

src/argus/htmx/templates/htmx/destination/_delete_form.html

@@ -1,6 +1,7 @@
 <form hx-post="{% url 'htmx:htmx-delete' form.instance.id %}"
       hx-trigger="submit"
-      hx-target="#form-list">
+      hx-target="closest details"
+      hx-swap="outerHTML">
   {% csrf_token %}
   <fieldset class="menu menu-horizontal menu-md items-center gap-4">
     <input type="submit" value="Delete" class="btn btn-secondary">

src/argus/htmx/templates/htmx/destination/_form_list.html

@@ -1,15 +1,5 @@
 <div id="form-list" class="flex flex-col max-w-4xl w-full gap-4">
   {% for media, forms in grouped_forms.items %}
-    <details class="collapse bg-base-200 collapse-arrow" open="">
-      <summary class="collapse-title text-xl font-medium">{{ media.name }} ({{ forms|length }})</summary>
-      <div class="collapse-content">
-        {% for form in forms %}
-          <div class="flex w-full h-fit items-center justify-center">
-            {% include "htmx/destination/_edit_form.html" %}
-            {% include "htmx/destination/_delete_form.html" %}
-          </div>
-        {% endfor %}
-      </div>
-    </details>
+    {% include "htmx/destination/_collapse_with_forms.html" with error_msg=None %}
   {% endfor %}
 </div>