Fix crash when opened with no file open

src/main.ts

@@ -25,7 +25,7 @@ import { RouteRecordRaw, createRouter, createWebHistory } from 'vue-router';
 import App from './App.vue';
 import { db } from './db.ts';
 import { handleCriticalError } from './error.ts';
-import austax from './plugins/austax/plugin.ts';
+import { initPlugins } from './plugin.ts';
 
 async function initApp() {
 	// Init state
@@ -58,16 +58,13 @@ async function initApp() {
 		{ path: '/trial-balance', name: 'trial-balance', component: () => import('./reports/TrialBalanceReport.vue') },
 	];
 	
-	// Init plugin routes
-	if (db.metadata.plugins.indexOf('austax') >= 0) {
-		routes.push(...austax.getRoutes());
-	}
-	
 	const router = createRouter({
 		history: createWebHistory(),
 		routes,
 	});
 	
+	initPlugins(router);
+	
 	// Create Vue app
 	createApp(App).use(router).mount('#app');
 }

src/pages/HomeView.vue

@@ -17,7 +17,7 @@
 -->
 
 <template>
-	<div :class="{'grid divide-x divide-gray-200': true, 'grid-cols-2': db.metadata.plugins.indexOf('austax') < 0, 'grid-cols-3': db.metadata.plugins.indexOf('austax') >= 0}">
+	<div :class="{'grid divide-x divide-gray-200': true, 'grid-cols-2': loadedPlugins.indexOf('austax') < 0, 'grid-cols-3': loadedPlugins.indexOf('austax') >= 0}">
 		<div class="pr-4">
 			<h2 class="font-medium text-gray-700 mb-2">Data sources</h2>
 			<ul class="list-disc ml-6">
@@ -26,7 +26,7 @@
 				<li><RouterLink :to="{ name: 'balance-assertions' }" class="text-gray-900 hover:text-blue-700 hover:underline">Balance assertions</RouterLink></li>
 				<li><RouterLink :to="{ name: 'chart-of-accounts' }" class="text-gray-900 hover:text-blue-700 hover:underline">Chart of accounts</RouterLink></li>
 				<!-- Plugin reports -->
-				<component :is="austax.getDataSourcesLinks()" v-if="db.metadata.plugins.indexOf('austax') >= 0"></component>
+				<component :is="austax.getDataSourcesLinks()" v-if="loadedPlugins.indexOf('austax') >= 0"></component>
 			</ul>
 		</div>
 		<div class="px-4">
@@ -37,20 +37,22 @@
 				<li><RouterLink :to="{ name: 'balance-sheet' }" class="text-gray-900 hover:text-blue-700 hover:underline">Balance sheet</RouterLink></li>
 				<li><RouterLink :to="{ name: 'income-statement' }" class="text-gray-900 hover:text-blue-700 hover:underline">Income statement</RouterLink></li>
 				<!-- Plugin reports -->
-				<component :is="austax.getGeneralReportsLinks()" v-if="db.metadata.plugins.indexOf('austax') >= 0"></component>
+				<component :is="austax.getGeneralReportsLinks()" v-if="loadedPlugins.indexOf('austax') >= 0"></component>
 			</ul>
 		</div>
-		<div class="pl-4" v-if="db.metadata.plugins.indexOf('austax') >= 0">
+		<div class="pl-4" v-if="loadedPlugins.indexOf('austax') >= 0">
 			<h2 class="font-medium text-gray-700 mb-2">Advanced reports</h2>
 			<ul class="list-disc ml-6">
 				<!-- Plugin reports -->
-				<component :is="austax.getAdvancedReportsLinks()" v-if="db.metadata.plugins.indexOf('austax') >= 0"></component>
+				<component :is="austax.getAdvancedReportsLinks()" v-if="loadedPlugins.indexOf('austax') >= 0"></component>
 			</ul>
 		</div>
 	</div>
 </template>
 
 <script setup lang="ts">
-	import { db } from '../db.ts';
+	// Must use loadedPlugins not db.metadata.plugins, since we only want to update after routes are initialised
+	import { loadedPlugins } from '../plugin.ts';
+	
 	import austax from '../plugins/austax/plugin.ts';
 </script>

src/pages/NoFileView.vue

@@ -1,5 +1,5 @@
 <!--
-	DrCr: Web-based double-entry bookkeeping framework
+	DrCr: Double-entry bookkeeping framework
 	Copyright (C) 2022-2025  Lee Yingtong Li (RunasSudo)
 	
 	This program is free software: you can redistribute it and/or modify
@@ -26,8 +26,12 @@
 
 <script setup lang="ts">
 	import { open } from '@tauri-apps/plugin-dialog';
+	import { useRouter } from 'vue-router';
 	
 	import { db } from '../db.js';
+	import { initPlugins } from '../plugin.js';
+	
+	const router = useRouter();
 	
 	async function openFile() {
 		const file = await open({
@@ -41,5 +45,8 @@
 		if (file !== null) {
 			await db.init(file);
 		}
+		
+		// Re-load plugin routes in case a new plugin is enabled
+		initPlugins(router);
 	}
 </script>

src/plugin.ts

@@ -16,8 +16,13 @@
 	along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
 
-import { Component } from 'vue';
+import { Component, ref } from 'vue';
-import { RouteRecordRaw } from 'vue-router';
+import { Router, RouteRecordRaw } from 'vue-router';
+
+import { db } from './db.ts';
+import austax from './plugins/austax/plugin.ts';
+
+export const loadedPlugins = ref([] as string[]);
 
 export interface Plugin {
 	getAccountKinds: () => Promise<[string, string][]>,
@@ -26,3 +31,16 @@ export interface Plugin {
 	getGeneralReportsLinks: () => Component,
 	getRoutes: () => RouteRecordRaw[],
 }
+
+export function initPlugins(router: Router) {
+	// Add plugin routes to router
+	if (db.filename !== null) {
+		if (db.metadata.plugins.indexOf('austax') >= 0) {
+			for (const route of austax.getRoutes()) {
+				router.addRoute(route);
+			}
+		}
+		
+		loadedPlugins.value = db.metadata.plugins;
+	}
+}