diff --git a/app/Console/Commands/Correction/FixTransactionTypes.php b/app/Console/Commands/Correction/FixTransactionTypes.php
index 02296d3a36..8ca46f9507 100644
--- a/app/Console/Commands/Correction/FixTransactionTypes.php
+++ b/app/Console/Commands/Correction/FixTransactionTypes.php
@@ -108,7 +108,11 @@ class FixTransactionTypes extends Command
         }
         $expectedType = (string) config(sprintf('firefly.account_to_transaction.%s.%s', $source->accountType->type, $destination->accountType->type));
         if ($expectedType !== $type) {
-            $this->line(sprintf('Transaction journal #%d was of type "%s" but is corrected to "%s"', $journal->id, $type, $expectedType));
+            $this->line(
+                sprintf('Transaction journal #%d was of type "%s" but is corrected to "%s" (%s -> %s)',
+                        $journal->id, $type, $expectedType,
+                        $source->accountType->type, $destination->accountType->type,
+                        ));
             $this->changeJournal($journal, $expectedType);
 
             return true;
diff --git a/config/firefly.php b/config/firefly.php
index 0431fbad74..4163106e38 100644
--- a/config/firefly.php
+++ b/config/firefly.php
@@ -608,7 +608,10 @@ return [
             AccountType::RECONCILIATION  => TransactionTypeModel::RECONCILIATION,
         ],
         AccountType::CASH             => [
-            AccountType::ASSET => TransactionTypeEnum::DEPOSIT->value,
+            AccountType::ASSET    => TransactionTypeModel::DEPOSIT,
+            AccountType::LOAN     => TransactionTypeModel::DEPOSIT,
+            AccountType::DEBT     => TransactionTypeModel::DEPOSIT,
+            AccountType::MORTGAGE => TransactionTypeModel::DEPOSIT,
         ],
         AccountType::DEBT             => [
             AccountType::ASSET           => TransactionTypeEnum::DEPOSIT->value,
@@ -690,9 +693,10 @@ return [
             AccountType::ASSET          => [AccountType::RECONCILIATION],
         ],
         TransactionTypeModel::LIABILITY_CREDIT => [
-            AccountType::LOAN     => [AccountType::LIABILITY_CREDIT],
-            AccountType::DEBT     => [AccountType::LIABILITY_CREDIT],
-            AccountType::MORTGAGE => [AccountType::LIABILITY_CREDIT],
+            AccountType::LOAN             => [AccountType::LIABILITY_CREDIT],
+            AccountType::DEBT             => [AccountType::LIABILITY_CREDIT],
+            AccountType::MORTGAGE         => [AccountType::LIABILITY_CREDIT],
+            AccountType::LIABILITY_CREDIT => [AccountType::LOAN, AccountType::DEBT, AccountType::MORTGAGE],
         ],
     ],
     // if you add fields to this array, dont forget to update the export routine (ExportDataGenerator).
diff --git a/frontend/src/pages/accounts/Index.vue b/frontend/src/pages/accounts/Index.vue
index 6061adb765..2e3fcc9de1 100644
--- a/frontend/src/pages/accounts/Index.vue
+++ b/frontend/src/pages/accounts/Index.vue
@@ -159,18 +159,24 @@ export default {
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+
+
+
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
diff --git a/frontend/src/pages/budgets/Index.vue b/frontend/src/pages/budgets/Index.vue
index 7ace02f6d5..d7a3b73d78 100644
--- a/frontend/src/pages/budgets/Index.vue
+++ b/frontend/src/pages/budgets/Index.vue
@@ -168,7 +168,7 @@ export default {
     },
     destroyBudget: function (id) {
       (new Destroy('budgets')).destroy(id).then(() => {
-        this.store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/categories/Edit.vue b/frontend/src/pages/categories/Edit.vue
index 71a4dd48ab..9738875db1 100644
--- a/frontend/src/pages/categories/Edit.vue
+++ b/frontend/src/pages/categories/Edit.vue
@@ -76,6 +76,7 @@
 <script>
 import Get from "../../api/categories/get";
 import Put from "../../api/categories/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -91,6 +92,7 @@ export default {
       // category fields:
       id: 0,
       name: '',
+      store: null
     }
   },
   computed: {
@@ -101,6 +103,7 @@ export default {
   created() {
     this.id = parseInt(this.$route.params.id);
     this.collectCategory();
+    this.store = useFireflyIIIStore();
   },
   methods: {
     collectCategory: function() {
@@ -144,7 +147,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/categories/Index.vue b/frontend/src/pages/categories/Index.vue
index 0694781cac..dde616e249 100644
--- a/frontend/src/pages/categories/Index.vue
+++ b/frontend/src/pages/categories/Index.vue
@@ -90,6 +90,7 @@
 // import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/categories/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -118,6 +119,7 @@ export default {
         {name: 'name', label: 'Name', field: 'name', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null,
     }
   },
   computed: {
@@ -125,21 +127,27 @@ export default {
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;
+    this.store = useFireflyIIIStore();
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
+
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
+
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
@@ -156,7 +164,7 @@ export default {
     },
     destroyCategory: function (id) {
       (new Destroy('categories')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/currencies/Create.vue b/frontend/src/pages/currencies/Create.vue
index a0daed33c4..b9a60f8436 100644
--- a/frontend/src/pages/currencies/Create.vue
+++ b/frontend/src/pages/currencies/Create.vue
@@ -97,6 +97,7 @@
 
 <script>
 import Post from "../../api/currencies/post";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Create',
@@ -113,6 +114,7 @@ export default {
       name: '',
       code: '',
       symbol: '',
+      store: null,
     }
   },
   computed: {
@@ -123,6 +125,7 @@ export default {
   created() {
     this.resetForm();
     this.type = this.$route.params.type;
+    this.store = useFireflyIIIStore();
   },
   methods: {
     resetForm: function () {
@@ -175,7 +178,7 @@ export default {
       if (!response) {
         return;
       }
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       this.submitting = false;
       let message = {
         level: 'success',
diff --git a/frontend/src/pages/currencies/Edit.vue b/frontend/src/pages/currencies/Edit.vue
index 1a0bed598e..5ae88820a5 100644
--- a/frontend/src/pages/currencies/Edit.vue
+++ b/frontend/src/pages/currencies/Edit.vue
@@ -96,6 +96,7 @@
 <script>
 import Get from "../../api/currencies/get";
 import Put from "../../api/currencies/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -112,6 +113,7 @@ export default {
       code: '',
       name: '',
       symbol: '',
+      store: null,
     }
   },
   computed: {
@@ -122,6 +124,7 @@ export default {
   created() {
     this.code = this.$route.params.code;
     this.collectCurrency();
+    this.store = useFireflyIIIStore();
   },
   methods: {
     collectCurrency: function() {
@@ -172,7 +175,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/currencies/Index.vue b/frontend/src/pages/currencies/Index.vue
index e175b44e6e..53ce0d8d1c 100644
--- a/frontend/src/pages/currencies/Index.vue
+++ b/frontend/src/pages/currencies/Index.vue
@@ -90,6 +90,7 @@
 // import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/currencies/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -119,6 +120,7 @@ export default {
         {name: 'name', label: 'Code', field: 'code', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null,
     }
   },
   computed: {
@@ -126,21 +128,27 @@ export default {
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;
+    this.store = useFireflyIIIStore();
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
+
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
+
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
@@ -158,7 +166,7 @@ export default {
     },
     destroyCurrency: function (code) {
       (new Destroy('currencies')).destroy(code).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/dashboard/Boxes.vue b/frontend/src/pages/dashboard/Boxes.vue
index 5190fee9ed..5cc300ecd0 100644
--- a/frontend/src/pages/dashboard/Boxes.vue
+++ b/frontend/src/pages/dashboard/Boxes.vue
@@ -128,8 +128,8 @@ export default {
     this.store = useFireflyIIIStore();
 
     if (null === this.range.start || null === this.range.end) {
-      // subscribe, then update:
 
+      // subscribe, then update:
       this.store.$onAction(
         ({name, $store, args, after, onError,}) => {
           after((result) => {
diff --git a/frontend/src/pages/groups/Edit.vue b/frontend/src/pages/groups/Edit.vue
index e5d675bd92..8622de56c9 100644
--- a/frontend/src/pages/groups/Edit.vue
+++ b/frontend/src/pages/groups/Edit.vue
@@ -76,6 +76,7 @@
 <script>
 import Get from "../../api/groups/get";
 import Put from "../../api/groups/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -91,6 +92,7 @@ export default {
       // group fields:
       id: 0,
       title: '',
+      store: null,
     }
   },
   computed: {
@@ -101,6 +103,7 @@ export default {
   created() {
     this.id = parseInt(this.$route.params.id);
     this.collectGroup();
+    this.store = useFireflyIIIStore();
   },
   methods: {
     collectGroup: function() {
@@ -144,7 +147,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/groups/Index.vue b/frontend/src/pages/groups/Index.vue
index 19f5703c72..c60715c2d6 100644
--- a/frontend/src/pages/groups/Index.vue
+++ b/frontend/src/pages/groups/Index.vue
@@ -74,6 +74,7 @@
 // import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/groups/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -101,7 +102,8 @@ export default {
       columns: [
         {name: 'title', label: 'Title', field: 'title', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
-      ]
+      ],
+      store: null
     }
   },
   computed: {
@@ -109,21 +111,26 @@ export default {
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;
+    this.store = useFireflyIIIStore();
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
+
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
@@ -141,7 +148,7 @@ export default {
     },
     destroyGroup: function (identifier) {
       (new Destroy('object_groups')).destroy(identifier).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/piggy-banks/Create.vue b/frontend/src/pages/piggy-banks/Create.vue
index 023d07c06d..7bf42269d3 100644
--- a/frontend/src/pages/piggy-banks/Create.vue
+++ b/frontend/src/pages/piggy-banks/Create.vue
@@ -105,7 +105,7 @@
 import Post from "../../api/piggy-banks/post";
 import List from "../../api/accounts/list";
 // import {mapGetters} from "vuex";
-import {getCacheKey} from "../../store/fireflyiii/getters";
+// import {getCacheKey} from "../../store/fireflyiii/getters";
 
 export default {
   name: 'Create',
diff --git a/frontend/src/pages/piggy-banks/Edit.vue b/frontend/src/pages/piggy-banks/Edit.vue
index b5ae682983..176794c296 100644
--- a/frontend/src/pages/piggy-banks/Edit.vue
+++ b/frontend/src/pages/piggy-banks/Edit.vue
@@ -76,6 +76,7 @@
 <script>
 import Get from "../../api/piggy-banks/get";
 import Put from "../../api/piggy-banks/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -91,6 +92,7 @@ export default {
       // piggy bank fields:
       id: 0,
       name: '',
+      store: null,
     }
   },
   computed: {
@@ -101,6 +103,7 @@ export default {
   created() {
     this.id = parseInt(this.$route.params.id);
     this.collectPiggyBank();
+    this.store = useFireflyIIIStore();
   },
   methods: {
     collectPiggyBank: function() {
@@ -143,7 +146,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/piggy-banks/Index.vue b/frontend/src/pages/piggy-banks/Index.vue
index 4763c980ff..2d4d1c9769 100644
--- a/frontend/src/pages/piggy-banks/Index.vue
+++ b/frontend/src/pages/piggy-banks/Index.vue
@@ -87,6 +87,7 @@
 // import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/piggy-banks/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -115,6 +116,7 @@ export default {
         {name: 'name', label: 'Name', field: 'name', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null,
     }
   },
   computed: {
@@ -122,20 +124,24 @@ export default {
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;
+    this.store = useFireflyIIIStore();
   },
   mounted() {
-    if (null === this.getRange.start || null === this.getRange.end) {
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
@@ -152,7 +158,7 @@ export default {
     },
     destroyPiggyBank: function (id) {
       (new Destroy('piggy_banks')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/preferences/Index.vue b/frontend/src/pages/preferences/Index.vue
index 0a72fd522b..af7ffafc1b 100644
--- a/frontend/src/pages/preferences/Index.vue
+++ b/frontend/src/pages/preferences/Index.vue
@@ -147,11 +147,13 @@ import Configuration from "../../api/system/configuration";
 import Put from "../../api/preferences/put";
 import Preferences from "../../api/preferences";
 import List from "../../api/accounts/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 // import {mapGetters} from "vuex";
 
 export default {
   name: 'Index',
   mounted() {
+    this.store = useFireflyIIIStore();
     this.isOk = {
       language: true,
       accounts: true,
@@ -225,7 +227,8 @@ export default {
         date: [],
         meta: [],
         ref: []
-      }
+      },
+      store: null,
     }
   },
   watch: {
@@ -233,7 +236,7 @@ export default {
       this.isOk.language = false;
       this.isLoading.language = true;
       (new Put).put('listPageSize', value).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.isOk.pageSize = true;
         this.isLoading.pageSize = false;
         this.isFailure.pageSize = false;
@@ -256,7 +259,7 @@ export default {
       this.isOk.language = false;
       this.isLoading.language = true;
       (new Put).put('language', value).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.isOk.language = true;
         this.isLoading.language = false;
         this.isFailure.language = false;
@@ -268,7 +271,7 @@ export default {
     },
     accounts: function (value) {
       (new Put).put('frontpageAccounts', value).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.isOk.accounts = true;
         this.isLoading.accounts = false;
         this.isFailure.accounts = false;
@@ -280,7 +283,7 @@ export default {
     },
     viewRange: function (value) {
       (new Put).put('viewRange', value).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.isOk.pageSize = true;
         this.isLoading.pageSize = false;
         this.isFailure.pageSize = false;
@@ -328,7 +331,7 @@ export default {
         }
       }
       (new Put).put('transaction_journal_optional_fields', submission).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.isOk.transactionFields = true;
         this.isLoading.transactionFields = false;
         this.isFailure.transactionFields = false;
diff --git a/frontend/src/pages/recurring/Create.vue b/frontend/src/pages/recurring/Create.vue
index 58689454fa..6e785cde53 100644
--- a/frontend/src/pages/recurring/Create.vue
+++ b/frontend/src/pages/recurring/Create.vue
@@ -224,7 +224,7 @@
 <script>
 import Post from "../../api/recurring/post";
 // import {mapGetters} from "vuex";
-import {getCacheKey} from "../../store/fireflyiii/getters";
+// import {getCacheKey} from "../../store/fireflyiii/getters";
 import format from "date-fns/format";
 import List from "../../api/accounts/list";
 import {parseISO} from "date-fns";
diff --git a/frontend/src/pages/recurring/Edit.vue b/frontend/src/pages/recurring/Edit.vue
index f401a8dba5..16cf8d64b7 100644
--- a/frontend/src/pages/recurring/Edit.vue
+++ b/frontend/src/pages/recurring/Edit.vue
@@ -228,6 +228,7 @@ import Put from "../../api/recurring/put";
 import {parseISO} from "date-fns";
 import format from "date-fns/format";
 import List from "../../api/accounts/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -267,7 +268,8 @@ export default {
       nr_of_repetitions: 0,
       repeat_until: '',
       repetitions: {},
-      transactions: {}
+      transactions: {},
+      store: null,
     }
   },
   watch: {
@@ -284,6 +286,7 @@ export default {
   // TODO some forms use 'loading' others use 'submitting' or 'disabledInput', needs to be the same.
   created() {
     this.loading = true;
+    this.store = useFireflyIIIStore();
     this.resetErrors();
     this.resetForm();
     this.getAccounts().then(() => {
@@ -520,7 +523,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/recurring/Index.vue b/frontend/src/pages/recurring/Index.vue
index 732ed1ad06..2d1eda8541 100644
--- a/frontend/src/pages/recurring/Index.vue
+++ b/frontend/src/pages/recurring/Index.vue
@@ -87,6 +87,7 @@
 // import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/recurring/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -115,6 +116,7 @@ export default {
         {name: 'name', label: 'Name', field: 'name', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null
     }
   },
   computed: {
@@ -122,21 +124,25 @@ export default {
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;
+    this.store = useFireflyIIIStore();
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
@@ -153,7 +159,7 @@ export default {
     },
     destroyRecurring: function (id) {
       (new Destroy('recurrences')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/rule-groups/Create.vue b/frontend/src/pages/rule-groups/Create.vue
index 5a3dbf9ed5..e93b11c8d5 100644
--- a/frontend/src/pages/rule-groups/Create.vue
+++ b/frontend/src/pages/rule-groups/Create.vue
@@ -76,7 +76,7 @@
 <script>
 import Post from "../../api/rule-groups/post";
 // import {mapGetters} from "vuex";
-import {getCacheKey} from "../../store/fireflyiii/getters";
+// import {getCacheKey} from "../../store/fireflyiii/getters";
 
 export default {
   name: 'Create',
diff --git a/frontend/src/pages/rule-groups/Edit.vue b/frontend/src/pages/rule-groups/Edit.vue
index 222c44559f..b7dc6e564d 100644
--- a/frontend/src/pages/rule-groups/Edit.vue
+++ b/frontend/src/pages/rule-groups/Edit.vue
@@ -76,6 +76,7 @@
 <script>
 import Get from "../../api/rule-groups/get";
 import Put from "../../api/rule-groups/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -91,6 +92,7 @@ export default {
       // rule group fields:
       id: 0,
       title: '',
+      store: null,
     }
   },
   computed: {
@@ -100,6 +102,7 @@ export default {
   },
   created() {
     this.id = parseInt(this.$route.params.id);
+    this.store = useFireflyIIIStore();
     this.collectRuleGroup();
   },
   methods: {
@@ -143,7 +146,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/rules/Create.vue b/frontend/src/pages/rules/Create.vue
index c977c9b54c..3a4407363a 100644
--- a/frontend/src/pages/rules/Create.vue
+++ b/frontend/src/pages/rules/Create.vue
@@ -233,7 +233,7 @@
 <script>
 import Post from "../../api/rules/post";
 // import {mapGetters} from "vuex";
-import {getCacheKey} from "../../store/fireflyiii/getters";
+// import {getCacheKey} from "../../store/fireflyiii/getters";
 import Configuration from "../../api/system/configuration";
 import List from "../../api/rule-groups/list";
 
diff --git a/frontend/src/pages/rules/Edit.vue b/frontend/src/pages/rules/Edit.vue
index 2f2078f2a5..df5fc8f046 100644
--- a/frontend/src/pages/rules/Edit.vue
+++ b/frontend/src/pages/rules/Edit.vue
@@ -76,6 +76,7 @@
 <script>
 import Get from "../../api/rules/get";
 import Put from "../../api/rules/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -91,6 +92,7 @@ export default {
       // rule fields:
       id: 0,
       title: '',
+      store: null
     }
   },
   computed: {
@@ -100,6 +102,7 @@ export default {
   },
   created() {
     this.id = parseInt(this.$route.params.id);
+    this.store = useFireflyIIIStore();
     this.collectRule();
   },
   methods: {
@@ -143,7 +146,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/rules/Index.vue b/frontend/src/pages/rules/Index.vue
index f4cf98b563..c98402f1dd 100644
--- a/frontend/src/pages/rules/Index.vue
+++ b/frontend/src/pages/rules/Index.vue
@@ -101,6 +101,7 @@
 import List from "../../api/rule-groups/list";
 import Get from "../../api/rule-groups/get";
 import Destroy from "../../api/generic/destroy";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -113,6 +114,7 @@ export default {
     }
   },
   mounted() {
+    this.store = useFireflyIIIStore();
     this.triggerUpdate();
   },
   data() {
@@ -126,6 +128,7 @@ export default {
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
       ruleGroups: {},
+      store: null
     }
   },
   computed: {
@@ -162,13 +165,13 @@ export default {
     },
     destroyRuleGroup: function (id) {
       (new Destroy('rule_groups')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
     destroyRule: function (id) {
       (new Destroy('rules')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/subscriptions/Index.vue b/frontend/src/pages/subscriptions/Index.vue
index f834dd9a77..afd5fbe3a4 100644
--- a/frontend/src/pages/subscriptions/Index.vue
+++ b/frontend/src/pages/subscriptions/Index.vue
@@ -88,6 +88,7 @@
 // import {mapGetters, useStore} from "vuex";
 import List from "../../api/subscriptions/list";
 import Destroy from "../../api/generic/destroy";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -99,18 +100,23 @@ export default {
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+    this.store = useFireflyIIIStore();
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
+
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
@@ -129,6 +135,7 @@ export default {
         {name: 'name', label: 'Name', field: 'name', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null,
     }
   },
   methods: {
@@ -148,7 +155,7 @@ export default {
     },
     destroySubscription: function (id) {
       (new Destroy('bills')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },
diff --git a/frontend/src/pages/tags/Index.vue b/frontend/src/pages/tags/Index.vue
index e087427655..12befb3a23 100644
--- a/frontend/src/pages/tags/Index.vue
+++ b/frontend/src/pages/tags/Index.vue
@@ -76,18 +76,21 @@ export default {
   created() {
   },
   mounted() {
-    if (null === this.getRange.start || null === this.getRange.end) {
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
diff --git a/frontend/src/pages/transactions/Edit.vue b/frontend/src/pages/transactions/Edit.vue
index e376a084b5..86643becd7 100644
--- a/frontend/src/pages/transactions/Edit.vue
+++ b/frontend/src/pages/transactions/Edit.vue
@@ -120,6 +120,7 @@ import formatISO from 'date-fns/formatISO';
 import Put from "../../api/transactions/put";
 import { useQuasar } from 'quasar';
 import Get from "../../api/transactions/get";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Edit',
@@ -134,7 +135,8 @@ export default {
       index: 0,
       doResetForm: false,
       group_title: '',
-      errorMessage: ''
+      errorMessage: '',
+      store: null
     }
   },
   computed: {
@@ -144,6 +146,7 @@ export default {
   },
   created() {
     this.id = parseInt(this.$route.params.id);
+    this.store = useFireflyIIIStore();
     this.resetForm();
     this.collectTransaction();
   },
@@ -212,7 +215,7 @@ export default {
     },
     processSuccess: function (response) {
       this.submitting = false;
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       let message = {
         level: 'success',
         text: 'Updated transaction',
diff --git a/frontend/src/pages/transactions/Index.vue b/frontend/src/pages/transactions/Index.vue
index a06cb2abfb..8fb68a74c9 100644
--- a/frontend/src/pages/transactions/Index.vue
+++ b/frontend/src/pages/transactions/Index.vue
@@ -120,18 +120,24 @@ export default {
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+    if (null === this.store.getRange.start || null === this.store.getRange.end) {
+
       // subscribe, then update:
-      const $store = useStore();
-      $store.subscribe((mutation, state) => {
-        if ('fireflyiii/setRange' === mutation.type) {
-          this.range = {start: mutation.payload.start, end: mutation.payload.end};
-          this.triggerUpdate();
+      this.store.$onAction(
+        ({name, $store, args, after, onError,}) => {
+          after((result) => {
+            if (name === 'setRange') {
+              this.range = result;
+              this.triggerUpdate();
+            }
+          })
         }
-      });
+      )
+
+
     }
-    if (null !== this.getRange.start && null !== this.getRange.end) {
-      this.range = {start: this.getRange.start, end: this.getRange.end};
+    if (null !== this.store.getRange.start && null !== this.store.getRange.end) {
+      this.range = {start: this.store.getRange.start, end: this.store.getRange.end};
       this.triggerUpdate();
     }
   },
diff --git a/frontend/src/pages/webhooks/Create.vue b/frontend/src/pages/webhooks/Create.vue
index da64bcedda..cc7a166988 100644
--- a/frontend/src/pages/webhooks/Create.vue
+++ b/frontend/src/pages/webhooks/Create.vue
@@ -133,7 +133,7 @@
 <script>
 import Post from "../../api/webhooks/post";
 // import {mapGetters} from "vuex";
-import {getCacheKey} from "../../store/fireflyiii/getters";
+// import {getCacheKey} from "../../store/fireflyiii/getters";
 
 export default {
   name: 'Create',
diff --git a/frontend/src/pages/webhooks/Edit.vue b/frontend/src/pages/webhooks/Edit.vue
index 9675be9752..4871f3f1a2 100644
--- a/frontend/src/pages/webhooks/Edit.vue
+++ b/frontend/src/pages/webhooks/Edit.vue
@@ -130,6 +130,7 @@
 <script>
 import Get from "../../api/webhooks/get";
 import Put from "../../api/webhooks/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -165,6 +166,7 @@ export default {
       response: '',
       delivery: '',
       trigger: '',
+      store: null,
     }
   },
   computed: {
@@ -174,6 +176,7 @@ export default {
   },
   created() {
     this.id = parseInt(this.$route.params.id);
+    this.store = useFireflyIIIStore();
     this.collectWebhook();
   },
   methods: {
@@ -233,7 +236,7 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }
diff --git a/frontend/src/pages/webhooks/Index.vue b/frontend/src/pages/webhooks/Index.vue
index b93253c0fc..431383da37 100644
--- a/frontend/src/pages/webhooks/Index.vue
+++ b/frontend/src/pages/webhooks/Index.vue
@@ -88,6 +88,7 @@
 // import {mapGetters} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/webhooks/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -116,6 +117,7 @@ export default {
         {name: 'title', label: 'Title', field: 'title', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null,
     }
   },
   computed: {
@@ -123,6 +125,7 @@ export default {
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;
+    this.store = useFireflyIIIStore();
   },
   mounted() {
     this.triggerUpdate();
@@ -140,7 +143,7 @@ export default {
     },
     destroyWebhook: function (id) {
       (new Destroy('webhooks')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.refreshCacheKey();
         this.triggerUpdate();
       });
     },