From 710d77438f30ca5f2b5085ac0751469ed2809f27 Mon Sep 17 00:00:00 2001
From: andrewlalis <me@andrewlalis.com>
Date: Wed, 1 Jul 2026 14:56:10 -0400
Subject: [PATCH] Added wrapper for transaction editor action clicks to handle
 loading state.

---
 .../transaction-editor/EditTransactionPage.vue   | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/web-app/src/pages/transaction-editor/EditTransactionPage.vue b/web-app/src/pages/transaction-editor/EditTransactionPage.vue
index eef9665..0d1f395 100644
--- a/web-app/src/pages/transaction-editor/EditTransactionPage.vue
+++ b/web-app/src/pages/transaction-editor/EditTransactionPage.vue
@@ -29,11 +29,13 @@ import {
   loadEditorContextFromRoute,
   NewTransactionEditorContext,
   TransactionEditorContext,
+  type TransactionEditorAction,
   type TransactionEditorContextBase,
   type TransactionEditorFormFields,
 } from './util'
 import ButtonBar from '@/components/common/ButtonBar.vue'
 import AppButton from '@/components/common/AppButton.vue'
+import { showAlert } from '@/util/alert'
 
 const route = useRoute()
 const router = useRouter()
@@ -87,6 +89,18 @@ onMounted(async () => {
   }
   formData.value = editorContext.value.initializeFormFields(route.query)
 })
+
+function onActionClicked(action: TransactionEditorAction) {
+  loading.value = true
+  action
+    .callback(formData.value, route, router)
+    .catch((err) => {
+      showAlert(err)
+    })
+    .finally(() => {
+      loading.value = false
+    })
+}
 </script>
 <template>
   <AppPage :title="pageTitle">
@@ -240,7 +254,7 @@ onMounted(async () => {
           v-for="action in editorContext.getActions(formData)"
           :key="action.name"
           :disabled="action.disabled"
-          @click="action.callback(formData, route, router)"
+          @click="onActionClicked(action)"
         >
           {{ action.name }}
         </AppButton>