Make events sort updateable via modal

src/howitz/endpoints.py

@@ -764,10 +764,24 @@ def clear_flapping(i):
  raise MethodNotAllowed(description='Cant clear flapping on a non-port event.')
 
 
-
 @main.route('/events/table/change_sort_by', methods=['GET', 'POST'])
 def change_events_order():
- if request.method == 'GET':
+ if request.method == 'POST':
+ # Get new sort method from the request
+ new_sort = request.form['sort-method']
+ session["sort_by"] = new_sort
+ session.modified = True
+
+ # Rerender whole events table
+ events = current_app.cache.get("events")
+ if events:
+ table_events = get_sorted_table_event_list(events)
+ else:
+ table_events = get_current_events()
+
+ return render_template('/responses/resort-events.html', event_list=table_events)
+
+ elif request.method == 'GET':
  return render_template('/components/popups/modals/forms/sort-table-form.html', sort_methods=EventSort,
  current_sort=EventSort(session["sort_by"]))
 

src/howitz/templates/components/popups/modals/forms/sort-table-form.html

@@ -10,7 +10,7 @@
  {% for sort in sort_methods %}
  <div class="relative flex gap-x-3">
  <div class="flex h-6 items-center">
- <input id="{{ sort }}" value="{{ sort }}" type="radio" name="sort_events_by"
+ <input id="{{ sort }}" value="{{ sort }}" type="radio" name="sort-method"
  {% if sort == current_sort %}checked{% endif %}
  class="h-4 w-4 bg-sky-100/40 border-white text-sky-600 focus:ring-sky-600">
  </div>
@@ -29,9 +29,9 @@
  <div class="mt-2 flex items-center justify-start gap-x-6">
  <button
  type="submit"
- hx-post="/event/{{ id }}/update_status"
- hx-target="#event-accordion-row-{{ id }}"
- hx-swap="outerHTML show:#ol-event-{{ id }}:bottom"
+ hx-post="/events/table/change_sort_by"
+ hx-target="#eventlist-list"
+ hx-swap="innerHTML"
  hx-indicator="#bulk-update-indicator"
  class="mr-1 inline-flex items-center py-2 px-4 font-medium text-center text-white rounded-lg focus:ring-4 bg-sky-700 hover:bg-sky-800 focus:outline-none focus:ring-sky-900">
  Save

src/howitz/templates/components/popups/modals/table-operation-modal.html

@@ -4,6 +4,7 @@
  role="dialog"
  aria-modal="true"
  hx-target-error="body"
+ hx-swap-oob="true"
 >
  <div
  class="modal-underlay inset-0 bg-gray-500 bg-opacity-70 transition-opacity"

src/howitz/templates/responses/resort-events.html

@@ -0,0 +1,7 @@
+{% with event_list=event_list %}
+ {% include "/components/table/event-rows.html" %}
+{% endwith %}
+
+{% with modal_id='sort-menu-dropdown', modal_title='Sort events' %}
+ {% include "/components/popups/modals/table-operation-modal.html" %}
+{% endwith %}