Various fixes

frontend/src/components/DateRange.vue

@@ -40,60 +40,17 @@
 </template>
 
 <script>
-import {mapGetters, mapMutations} from "vuex";
+// import {mapGetters, mapMutations} from "vuex";
 import {useQuasar} from 'quasar'
 import Preferences from "../api/preferences";
 import format from 'date-fns/format';
+import {useFireflyIIIStore} from "../stores/fireflyiii";
 
 export default {
   name: "DateRange",
   computed: {
-    ...mapGetters('fireflyiii', ['getRange']),
-    ...mapMutations('fireflyiii', ['setRange'])
-  },
-  created() {
-    // set dark mode:
-    const $q = useQuasar();
-    this.darkMode = $q.dark.isActive;
-
-    this.localRange = {
-      from: format(this.getRange.start, 'yyyy-MM-dd'),
-      to: format(this.getRange.end, 'yyyy-MM-dd')
-    };
-  },
-  watch: {
-    localRange: function (value) {
-      if (null !== value) {
-        const updatedRange = {
-          start: Date.parse(value.from),
-          end: Date.parse(value.to)
-        };
-        this.$store.commit('fireflyiii/setRange', updatedRange);
-      }
-    },
-  },
-  mounted() {
-
-  },
-  methods: {
-    resetRange: function () {
-      this.$store.dispatch('fireflyiii/resetRange').then(() => {
-        this.localRange = {
-          from: format(this.getRange.start, 'yyyy-MM-dd'),
-          to: format(this.getRange.end, 'yyyy-MM-dd')
-        };
-      });
-
-    },
-    setViewRange: function (value) {
-      let submission = value.value;
-      let preferences = new Preferences();
-      preferences.postByName('viewRange', submission);
-      this.$store.commit('fireflyiii/updateViewRange', submission);
-      this.$store.dispatch('fireflyiii/setDatesFromViewRange');
-    },
-    updateViewRange: function () {
-    }
+    // ...mapGetters('fireflyiii', ['getRange']),
+    // ...mapMutations('fireflyiii', ['setRange'])
   },
   data() {
     return {
@@ -122,6 +79,54 @@ export default {
           timeAdjust: '23:59:59',
         },
       },
+      store: null
+    }
+  },
+  created() {
+    this.store = useFireflyIIIStore();
+    const $q = useQuasar();
+    this.darkMode = $q.dark.isActive;
+
+    this.localRange = {
+      from: format(this.store.getRange.start, 'yyyy-MM-dd'),
+      to: format(this.store.getRange.end, 'yyyy-MM-dd')
+    };
+  },
+  watch: {
+    localRange: function (value) {
+      if (null !== value) {
+        const updatedRange = {
+          start: Date.parse(value.from),
+          end: Date.parse(value.to)
+        };
+        // FIXME new store
+        this.store.setRange(updatedRange);
+      }
+    },
+  },
+  mounted() {
+
+  },
+  methods: {
+    resetRange: function () {
+      // FIXME new store
+      this.store.resetRange().then(() => {
+        this.localRange = {
+          from: format(this.store.getRange.start, 'yyyy-MM-dd'),
+          to: format(this.store.getRange.end, 'yyyy-MM-dd')
+        };
+      });
+
+    },
+    setViewRange: function (value) {
+      let submission = value.value;
+      let preferences = new Preferences();
+      preferences.postByName('viewRange', submission);
+      // FIXME new store
+      this.store.updateViewRange(submission);
+      this.store.setDatesFromViewRange();
+    },
+    updateViewRange: function () {
     }
   },
   components: {},

frontend/src/components/transactions/LargeTable.vue

@@ -84,7 +84,8 @@
                   <q-item-label>Edit</q-item-label>
                 </q-item-section>
               </q-item>
-              <q-item clickable v-close-popup @click="deleteTransaction(props.row.group_id, props.row.description, props.row.group_title)">
+              <q-item clickable v-close-popup
+                      @click="deleteTransaction(props.row.group_id, props.row.description, props.row.group_title)">
                 <q-item-section>
                   <q-item-label>Delete</q-item-label>
                 </q-item-section>
@@ -128,6 +129,7 @@
 <script>
 import format from "date-fns/format";
 import Destroy from "../../api/generic/destroy";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "LargeTable",
@@ -164,6 +166,7 @@ export default {
         {name: 'budget', label: 'Budget', field: 'budget', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'left'},
       ],
+      store: null,
     }
   },
   mounted() {
@@ -194,9 +197,9 @@ export default {
       //this.page = props.pagination.page;
       // this.triggerUpdate();
     },
-    deleteTransaction: function(identifier, description, groupTitle) {
-      let  title  = description;
-      if('' !== groupTitle) {
+    deleteTransaction: function (identifier, description, groupTitle) {
+      let title = description;
+      if ('' !== groupTitle) {
         title = groupTitle;
       }
       this.$q.dialog({
@@ -211,8 +214,8 @@ export default {
     destroyTransaction: function (id) {
 
       (new Destroy('transactions')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
-        //this.triggerUpdate();
+        this.store = useFireflyIIIStore();
+        this.store.refreshCacheKey();
       });
     },
   },

frontend/src/pages/Index.vue

@@ -127,7 +127,8 @@ export default defineComponent(
     },
     data() {
       return {
-        assetCount: 1
+        assetCount: 1,
+        $store: null
       }
     },
     computed: {
@@ -138,9 +139,8 @@ export default defineComponent(
     },
     methods: {
       refreshThenCount: function () {
-        const store = useFireflyIIIStore();
-        store.refreshCacheKey();
-        //this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.$store = useFireflyIIIStore();
+        this.$store.refreshCacheKey();
         this.countAssetAccounts();
       },
       countAssetAccounts: function () {

frontend/src/pages/accounts/Edit.vue

@@ -86,6 +86,7 @@
 <script>
 import Get from '../../api/accounts/get';
 import Put from '../../api/accounts/put';
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -103,6 +104,7 @@ export default {
       id: 0,
       name: '',
       iban: '',
+      store: null,
     }
   },
   computed: {
@@ -161,7 +163,8 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store = useFireflyIIIStore();
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }

frontend/src/pages/accounts/Index.vue

@@ -109,9 +109,10 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import List from "../../api/accounts/list";
 import Destroy from "../../api/generic/destroy";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -146,12 +147,14 @@ export default {
         {name: 'last_activity', label: this.$t('list.lastActivity'), field: 'last_activity', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null,
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
+    this.store = useFireflyIIIStore();
     this.pagination.rowsPerPage = this.getListPageSize;
   },
   mounted() {
@@ -185,7 +188,7 @@ export default {
     destroyAccount: function (id) {
       (new Destroy('accounts')).destroy(id).then(() => {
         this.rows=  [];
-        this.$store.dispatch('fireflyiii/refreshCacheKey').then(() => {
+        this.store.refreshCacheKey().then(() => {
           this.triggerUpdate();
         });
       });

frontend/src/pages/budgets/Edit.vue

@@ -77,6 +77,7 @@
 <script>
 import Get from "../../api/budgets/get";
 import Put from "../../api/budgets/put";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: "Edit",
@@ -92,6 +93,7 @@ export default {
       // budget fields:
       id: 0,
       name: '',
+      store: null,
     }
   },
   computed: {
@@ -145,7 +147,8 @@ export default {
       this.errorMessage = '';
     },
     processSuccess: function (response) {
-      this.$store.dispatch('fireflyiii/refreshCacheKey');
+      this.store = useFireflyIIIStore();
+      this.store.refreshCacheKey();
       if (!response) {
         return;
       }

frontend/src/pages/budgets/Index.vue

@@ -80,16 +80,18 @@
         icon="fas fa-chevron-up"
         direction="up"
       >
-        <q-fab-action color="primary" square :to="{ name: 'budgets.create'}" icon="fas fa-exchange-alt" label="New budget"/>
+        <q-fab-action color="primary" square :to="{ name: 'budgets.create'}" icon="fas fa-exchange-alt"
+                      label="New budget"/>
       </q-fab>
     </q-page-sticky>
   </q-page>
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/budgets/list";
+import {useFireflyIIIStore} from "../../stores/fireflyiii";
 
 export default {
   name: 'Index',
@@ -118,28 +120,38 @@ export default {
         {name: 'name', label: 'Name', field: 'name', align: 'left'},
         {name: 'menu', label: ' ', field: 'menu', align: 'right'},
       ],
+      store: null,
+
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
+    this.store = useFireflyIIIStore();
     this.pagination.rowsPerPage = this.getListPageSize;
   },
   mounted() {
     this.type = this.$route.params.type;
-    if (null === this.getRange.start || null === this.getRange.end) {
+
+    // subscribe to range.
+    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 +168,7 @@ export default {
     },
     destroyBudget: function (id) {
       (new Destroy('budgets')).destroy(id).then(() => {
-        this.$store.dispatch('fireflyiii/refreshCacheKey');
+        this.store.dispatch('fireflyiii/refreshCacheKey');
         this.triggerUpdate();
       });
     },

frontend/src/pages/categories/Index.vue

@@ -87,7 +87,7 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/categories/list";
 
@@ -121,7 +121,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;

frontend/src/pages/currencies/Index.vue

@@ -87,7 +87,7 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/currencies/list";
 
@@ -122,7 +122,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;

frontend/src/pages/dashboard/HomeChart.vue

@@ -28,7 +28,6 @@
 
 import {defineAsyncComponent} from "vue";
 import Overview from '../../api/chart/account/overview';
-//import {mapGetters, useStore} from "vuex";
 import format from "date-fns/format";
 import {useQuasar} from "quasar";
 import {useFireflyIIIStore} from "../../stores/fireflyiii";
@@ -36,7 +35,6 @@ import {useFireflyIIIStore} from "../../stores/fireflyiii";
 export default {
   name: "HomeChart",
   computed: {
-    //...mapGetters('fireflyiii', ['getRange', 'getCacheKey']),
   },
   data() {
     return {
@@ -89,14 +87,14 @@ export default {
     this.dateFormat = this.$t('config.month_and_day_fns');
   },
   mounted() {
+    this.store = useFireflyIIIStore();
     const $q = useQuasar();
     this.options.theme.mode = $q.dark.isActive ? 'dark' : 'light';
-    this.store = useFireflyIIIStore();
     if (null === this.range.start || null === this.range.end) {
-      // subscribe, then update:
+      // subscribe to date range update:
 
       this.store.$onAction(
-        ({name, $store, args, after, onError,}) => {
+        ({name, store, args, after, onError,}) => {
           after((result) => {
             if (name === 'setRange') {
               this.range = result;

frontend/src/pages/groups/Index.vue

@@ -71,7 +71,7 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/groups/list";
 
@@ -105,7 +105,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;

frontend/src/pages/piggy-banks/Create.vue

@@ -104,7 +104,7 @@
 <script>
 import Post from "../../api/piggy-banks/post";
 import List from "../../api/accounts/list";
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 import {getCacheKey} from "../../store/fireflyiii/getters";
 
 export default {
@@ -142,7 +142,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getCacheKey']),
     disabledInput: function () {
       return this.submitting;
     }

frontend/src/pages/piggy-banks/Index.vue

@@ -84,7 +84,7 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/piggy-banks/list";
 
@@ -118,7 +118,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;

frontend/src/pages/preferences/Index.vue

@@ -147,7 +147,7 @@ import Configuration from "../../api/system/configuration";
 import Put from "../../api/preferences/put";
 import Preferences from "../../api/preferences";
 import List from "../../api/accounts/list";
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 
 export default {
   name: 'Index',
@@ -292,7 +292,7 @@ export default {
     },
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getCacheKey']),
   },
   methods: {
     getAssetAccounts: function () {

frontend/src/pages/recurring/Create.vue

@@ -223,7 +223,7 @@
 
 <script>
 import Post from "../../api/recurring/post";
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 import {getCacheKey} from "../../store/fireflyiii/getters";
 import format from "date-fns/format";
 import List from "../../api/accounts/list";
@@ -275,7 +275,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getCacheKey']),
     disabledInput: function () {
       return this.submitting;
     }

frontend/src/pages/recurring/Index.vue

@@ -84,7 +84,7 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/recurring/list";
 
@@ -118,7 +118,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;

frontend/src/pages/rule-groups/Create.vue

@@ -75,7 +75,7 @@
 
 <script>
 import Post from "../../api/rule-groups/post";
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 import {getCacheKey} from "../../store/fireflyiii/getters";
 
 export default {
@@ -94,7 +94,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getCacheKey']),
     disabledInput: function () {
       return this.submitting;
     }

frontend/src/pages/rules/Create.vue

@@ -232,7 +232,7 @@
 
 <script>
 import Post from "../../api/rules/post";
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 import {getCacheKey} from "../../store/fireflyiii/getters";
 import Configuration from "../../api/system/configuration";
 import List from "../../api/rule-groups/list";
@@ -270,7 +270,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getCacheKey']),
     disabledInput: function () {
       return this.submitting;
     }

frontend/src/pages/rules/Index.vue

@@ -97,7 +97,7 @@
 </template>
 
 <script>
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 import List from "../../api/rule-groups/list";
 import Get from "../../api/rule-groups/get";
 import Destroy from "../../api/generic/destroy";
@@ -129,7 +129,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey']),
   },
   methods: {
     triggerUpdate: function () {

frontend/src/pages/subscriptions/Index.vue

@@ -85,14 +85,14 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import List from "../../api/subscriptions/list";
 import Destroy from "../../api/generic/destroy";
 
 export default {
   name: 'Index',
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;

frontend/src/pages/tags/Index.vue

@@ -49,7 +49,7 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import List from "../../api/tags/list";
 
 export default {
@@ -71,7 +71,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey']),
   },
   created() {
   },

frontend/src/pages/transactions/Index.vue

@@ -59,7 +59,7 @@
 </template>
 
 <script>
-import {mapGetters, useStore} from "vuex";
+// import {mapGetters, useStore} from "vuex";
 import List from "../../api/transactions/list";
 import LargeTable from "../../components/transactions/LargeTable";
 import Parser from "../../api/transactions/parser";
@@ -113,7 +113,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getRange', 'getCacheKey', 'getListPageSize']),
   },
   created() {
     this.rowsPerPage = this.getListPageSize;

frontend/src/pages/webhooks/Create.vue

@@ -132,7 +132,7 @@
 
 <script>
 import Post from "../../api/webhooks/post";
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 import {getCacheKey} from "../../store/fireflyiii/getters";
 
 export default {
@@ -174,7 +174,7 @@ export default {
   },
   watch: {},
   computed: {
-    ...mapGetters('fireflyiii', ['getCacheKey']),
+    // ...mapGetters('fireflyiii', ['getCacheKey']),
     disabledInput: function () {
       return this.submitting;
     }

frontend/src/pages/webhooks/Index.vue

@@ -85,7 +85,7 @@
 </template>
 
 <script>
-import {mapGetters} from "vuex";
+// import {mapGetters} from "vuex";
 import Destroy from "../../api/generic/destroy";
 import List from "../../api/webhooks/list";
 
@@ -119,7 +119,7 @@ export default {
     }
   },
   computed: {
-    ...mapGetters('fireflyiii', ['getCacheKey', 'getListPageSize']),
+    // ...mapGetters('fireflyiii', ['getCacheKey', 'getListPageSize']),
   },
   created() {
     this.pagination.rowsPerPage = this.getListPageSize;