Fix typescript errors

web/src/main.ts

@@ -2,7 +2,7 @@ import { createApp } from 'vue'
 import App from './App.vue'
 import './index.css'
 import router from './router'
-import { createPinia, SubscriptionCallbackMutation } from 'pinia'
+import { createPinia } from 'pinia'
 import { useBudgetsStore } from './stores/budget';
 import { useAccountStore } from './stores/budget-account'
 import PiniaLogger from './pinia-logger'

web/src/pages/Budgeting.vue

@@ -1,40 +1,31 @@
 <script lang="ts">
 import { mapState } from "pinia";
-import { defineComponent } from "vue";
+import { defineComponent, PropType } from "vue";
 import Currency from "../components/Currency.vue";
 import { useBudgetsStore } from "../stores/budget";
 import { Category, useAccountStore } from "../stores/budget-account";
 
 interface Date {
-    Year: Number,
+    Year: number,
-    Month: Number,
+    Month: number,
 }
 
 export default defineComponent({
-    mounted() {
+    props: {
-        document.title = "Budgeteer - Budget for " + this.selected.Month + "/" + this.selected.Year;
+        budgetid: {} as PropType<string>, 
-        return useAccountStore().FetchMonthBudget(this.budgetid, this.year, this.month);
+        year: {} as PropType<number>,
+        month: {} as PropType<number>,
     },
-    watch: {
-        year() {
-            return useAccountStore().FetchMonthBudget(this.budgetid, this.year, this.month);
-        },
-        month() {
-            return useAccountStore().FetchMonthBudget(this.budgetid, this.year, this.month);
-        },
-    },
-    props: ["budgetid", "year", "month"],
     computed: {
         ...mapState(useBudgetsStore, ["CurrentBudgetID"]),
-        Categories() : IterableIterator<Category> | undefined {
+        Categories() : Category[] {
             const accountStore = useAccountStore();
-            console.log(accountStore.CategoriesForMonth(this.year, this.month));
+            return [...accountStore.CategoriesForMonth(this.selected.Year, this.selected.Month)];
-            return accountStore.CategoriesForMonth(this.year, this.month);
         },
         previous() : Date {
             return {
-                Year: new Date(this.year, this.month - 1, 1).getFullYear(),
+                Year: new Date(this.selected.Year, this.selected.Month - 1, 1).getFullYear(),
-                Month: new Date(this.year, this.month - 1, 1).getMonth(),
+                Month: new Date(this.selected.Year, this.selected.Month - 1, 1).getMonth(),
             };
         },
         current() : Date {
@@ -45,17 +36,31 @@ export default defineComponent({
         },
         selected() : Date {
             return {
-                Year: this.year,
+                Year: this.year ?? this.current.Year,
-                Month: Number(this.month) + 1
+                Month: Number(this.month ?? this.current.Month) + 1
             }
         },
         next() : Date {
             return {
-                Year: new Date(this.year, Number(this.month) + 1, 1).getFullYear(),
+                Year: new Date(this.selected.Year, Number(this.month) + 1, 1).getFullYear(),
-                Month: new Date(this.year, Number(this.month) + 1, 1).getMonth(),
+                Month: new Date(this.selected.Year, Number(this.month) + 1, 1).getMonth(),
             };
         }
     },
+    mounted() : Promise<void> {
+        document.title = "Budgeteer - Budget for " + this.selected.Month + "/" + this.selected.Year;
+        return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.selected.Year, this.selected.Month);
+    },
+    watch: {
+        year() {
+            if (this.year != undefined && this.month != undefined)
+                return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.year, this.month);
+        },
+        month() {
+            if (this.year != undefined && this.month != undefined)
+                return useAccountStore().FetchMonthBudget(this.budgetid ?? "", this.year, this.month);
+        },
+    },
     components: { Currency }
 })
 

web/src/pages/Settings.vue

@@ -12,7 +12,7 @@ export default defineComponent({
         }
     },
     computed: {
-        filesIncomplete() {
+        filesIncomplete() : boolean {
             return this.$data.transactionsFile == undefined || this.$data.assignmentsFile == undefined;
         }
     },

web/src/stores/budget.ts

@@ -8,7 +8,7 @@ interface State {
 }
 
 export const useBudgetsStore = defineStore('budget', {
-    state: () => ({
+    state: (): State => ({
         CurrentBudgetID: null,
     }),
     getters: {