diff --git a/app/apps/transactions/views/actions.py b/app/apps/transactions/views/actions.py index 20bc8634..6ad3bd73 100644 --- a/app/apps/transactions/views/actions.py +++ b/app/apps/transactions/views/actions.py @@ -1,3 +1,4 @@ +import json from copy import deepcopy from django.contrib import messages @@ -63,7 +64,8 @@ def bulk_unpay_transactions(request): def bulk_delete_transactions(request): selected_transactions = request.GET.getlist("transactions", []) transactions = Transaction.objects.filter(id__in=selected_transactions) - count = transactions.count() + deleted_ids = [str(pk) for pk in transactions.values_list("id", flat=True)] + count = len(deleted_ids) transactions.delete() messages.success( @@ -76,9 +78,20 @@ def bulk_delete_transactions(request): % {"count": count}, ) + # The list isn't reloaded, the client removes the rows it already has and + # drops any divider left empty. + # See templates/includes/scripts/hyperscript/transactions.html return HttpResponse( status=204, - headers={"HX-Trigger": "updated"}, + headers={ + "HX-Trigger": json.dumps( + { + "transactions_deleted": {"ids": deleted_ids}, + "selective_update": None, + "toasts": None, + } + ) + }, ) diff --git a/app/apps/transactions/views/transactions.py b/app/apps/transactions/views/transactions.py index dd1e0eca..8e542051 100644 --- a/app/apps/transactions/views/transactions.py +++ b/app/apps/transactions/views/transactions.py @@ -1,4 +1,5 @@ import datetime +import json from copy import deepcopy from apps.common.decorators.demo import disabled_on_demo @@ -478,9 +479,20 @@ def transaction_delete(request, transaction_id, **kwargs): messages.success(request, _("Transaction deleted successfully")) + # The list isn't reloaded, the client removes the row it already has and + # drops any divider left empty. + # See templates/includes/scripts/hyperscript/transactions.html return HttpResponse( status=204, - headers={"HX-Trigger": "updated"}, + headers={ + "HX-Trigger": json.dumps( + { + "transactions_deleted": {"ids": [str(transaction_id)]}, + "selective_update": None, + "toasts": None, + } + ) + }, ) diff --git a/app/templates/cotton/transaction/item.html b/app/templates/cotton/transaction/item.html index 82ff696a..248bc29a 100644 --- a/app/templates/cotton/transaction/item.html +++ b/app/templates/cotton/transaction/item.html @@ -1,6 +1,7 @@ {% load markdown %} {% load i18n %}
{% if not disable_selection or not dummy %} diff --git a/app/templates/includes/scripts.html b/app/templates/includes/scripts.html index 4f324ff0..24ae3c62 100644 --- a/app/templates/includes/scripts.html +++ b/app/templates/includes/scripts.html @@ -6,6 +6,7 @@ {% include 'includes/scripts/hyperscript/init_tom_select.html' %} {% include 'includes/scripts/hyperscript/init_date_picker.html' %} {% include 'includes/scripts/hyperscript/htmx_error_handler.html' %} +{% include 'includes/scripts/hyperscript/transactions.html' %} {% include 'includes/scripts/hyperscript/sounds.html' %} {% include 'includes/scripts/hyperscript/swal.html' %} {% include 'includes/scripts/hyperscript/autosize.html' %} diff --git a/app/templates/includes/scripts/hyperscript/transactions.html b/app/templates/includes/scripts/hyperscript/transactions.html new file mode 100644 index 00000000..41659bbc --- /dev/null +++ b/app/templates/includes/scripts/hyperscript/transactions.html @@ -0,0 +1,75 @@ + diff --git a/app/templates/layouts/base.html b/app/templates/layouts/base.html index 8b8368da..41ae279b 100644 --- a/app/templates/layouts/base.html +++ b/app/templates/layouts/base.html @@ -26,6 +26,7 @@
{% include 'includes/mobile_navbar.html' %} {% include 'includes/sidebar.html' %} diff --git a/app/templates/monthly_overview/fragments/list.html b/app/templates/monthly_overview/fragments/list.html index 02273467..965659ad 100644 --- a/app/templates/monthly_overview/fragments/list.html +++ b/app/templates/monthly_overview/fragments/list.html @@ -5,6 +5,7 @@
{% if late_transactions %}
@@ -30,6 +31,7 @@ {% for x in transactions_by_date %}
diff --git a/app/templates/transactions/fragments/list_all.html b/app/templates/transactions/fragments/list_all.html index 196d4c0d..9b8a8076 100644 --- a/app/templates/transactions/fragments/list_all.html +++ b/app/templates/transactions/fragments/list_all.html @@ -5,6 +5,7 @@
{% if late_transactions %}
@@ -30,6 +31,7 @@ {% for x in transactions_by_date %}
diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml index 96828b94..53aace60 100644 --- a/docker-compose.dev.yml +++ b/docker-compose.dev.yml @@ -2,6 +2,7 @@ volumes: wygiwyh_dev_postgres_data: {} wygiwyh_temp: wygiwyh_attachments: + wygiwyh_node_modules: services: @@ -35,7 +36,7 @@ services: - ./frontend/:/usr/src/frontend - ./app/:/usr/src/app/ # http://jdlm.info/articles/2016/03/06/lessons-building-node-app-docker.html - - /usr/src/frontend/node_modules + - wygiwyh_node_modules:/usr/src/frontend/node_modules ports: - '${WEBPACK_OUTBOUND_PORT}:5173' environment: diff --git a/frontend/src/styles/_animations.scss b/frontend/src/styles/_animations.scss index caab4e93..065bcadd 100644 --- a/frontend/src/styles/_animations.scss +++ b/frontend/src/styles/_animations.scss @@ -300,4 +300,21 @@ 100% { pointer-events: auto; } -} \ No newline at end of file +} + +// Transaction rows and dividers on their way out. +// See templates/includes/scripts/hyperscript/transactions.html, which waits on +// transitionend, so every property here shares one duration and reduced motion +// shortens it rather than removing it. +.transaction-removing { + transition-property: height, opacity, transform; + transition-duration: 0.25s; + transition-timing-function: cubic-bezier(0.55, 0.085, 0.68, 0.53); + transform: translateX(-1.5rem); + opacity: 0; + pointer-events: none; + + @media (prefers-reduced-motion: reduce) { + transition-duration: 0.01s; + } +}