feat: move to file-based routes

frontend/src/pages/(home).vue

@@ -73,6 +73,8 @@ import {useConfigStore} from '@/stores/config'
 import {useAuthStore} from '@/stores/auth'
 import {useTaskStore} from '@/stores/tasks'
 
+definePage({ name: 'home' })
+
 const salutation = useDaytimeSalutation()
 
 const baseStore = useBaseStore()

frontend/src/router/index.ts

@@ -11,11 +11,6 @@ import {LINK_SHARE_HASH_PREFIX} from '@/constants/linkShareHash'
 import {useAuthStore} from '@/stores/auth'
 import {useBaseStore} from '@/stores/base'
 
-import Register from '@/views/user/Register.vue'
-import LinkSharingAuth from '@/views/sharing/LinkSharingAuth.vue'
-
-import NotFoundComponent from '@/views/404.vue'
-
 const router = createRouter({
 	history: createWebHistory(import.meta.env.BASE_URL),
 	scrollBehavior(to, from, savedPosition) {
@@ -34,141 +29,6 @@ const router = createRouter({
 	},
 	routes: [
 		...routes,
-		{
-			path: '/',
-			name: 'home',
-			component: () => import('@/views/Home.vue'),
-		},
-		{
-			path: '/:pathMatch(.*)*',
-			name: 'not-found',
-			component: NotFoundComponent,
-		},
-		// if you omit the last `*`, the `/` character in params will be encoded when resolving or pushing
-		{
-			path: '/:pathMatch(.*)',
-			name: 'bad-not-found',
-			component: NotFoundComponent,
-		},
-		{
-			path: '/login',
-			name: 'user.login',
-			component: () => import('@/views/user/Login.vue'),
-			meta: {
-				title: 'user.auth.login',
-			},
-		},
-		{
-			path: '/get-password-reset',
-			name: 'user.password-reset.request',
-			component: () => import('@/views/user/RequestPasswordReset.vue'),
-			meta: {
-				title: 'user.auth.resetPassword',
-			},
-		},
-		{
-			path: '/password-reset',
-			name: 'user.password-reset.reset',
-			component: () => import('@/views/user/PasswordReset.vue'),
-			meta: {
-				title: 'user.auth.resetPassword',
-			},
-		},
-		{
-			path: '/register',
-			name: 'user.register',
-			// FIXME: use dynamic imports
-			// component: () => import('@/views/user/Register.vue'),
-			component: Register,
-			meta: {
-				title: 'user.auth.createAccount',
-			},
-		},
-		{
-			path: '/user/settings',
-			name: 'user.settings',
-			component: () => import('@/views/user/Settings.vue'),
-			redirect: {name: 'user.settings.general'},
-			children: [
-				{
-					path: '/user/settings/avatar',
-					name: 'user.settings.avatar',
-					component: () => import('@/views/user/settings/Avatar.vue'),
-				},
-				{
-					path: '/user/settings/caldav',
-					name: 'user.settings.caldav',
-					component: () => import('@/views/user/settings/Caldav.vue'),
-				},
-				{
-					path: '/user/settings/data-export',
-					name: 'user.settings.data-export',
-					component: () => import('@/views/user/settings/DataExport.vue'),
-				},
-				{
-					path: '/user/settings/deletion',
-					name: 'user.settings.deletion',
-					component: () => import('@/views/user/settings/Deletion.vue'),
-				},
-				{
-					path: '/user/settings/email-update',
-					name: 'user.settings.email-update',
-					component: () => import('@/views/user/settings/EmailUpdate.vue'),
-				},
-				{
-					path: '/user/settings/general',
-					name: 'user.settings.general',
-					component: () => import('@/views/user/settings/General.vue'),
-				},
-				{
-					path: '/user/settings/password-update',
-					name: 'user.settings.password-update',
-					component: () => import('@/views/user/settings/PasswordUpdate.vue'),
-				},
-				{
-					path: '/user/settings/totp',
-					name: 'user.settings.totp',
-					component: () => import('@/views/user/settings/TOTP.vue'),
-				},
-				{
-					path: '/user/settings/api-tokens',
-					name: 'user.settings.apiTokens',
-					component: () => import('@/views/user/settings/ApiTokens.vue'),
-				},
-				{
-					path: '/user/settings/migrate',
-					name: 'migrate.start',
-					component: () => import('@/views/migrate/Migration.vue'),
-				},
-				{
-					path: '/migrate/:service',
-					name: 'migrate.service',
-					component: () => import('@/views/migrate/MigrationHandler.vue'),
-					props: route => ({
-						service: route.params.service as string,
-						code: route.query.code as string,
-					}),
-				},
-			],
-		},
-		{
-			path: '/user/export/download',
-			name: 'user.export.download',
-			component: () => import('@/views/user/DataExportDownload.vue'),
-		},
-		{
-			path: '/share/:share/auth',
-			name: 'link-share.auth',
-			// FIXME: use dynamic imports
-			// component: () => import('@/views/sharing/LinkSharingAuth.vue'),
-			component: LinkSharingAuth,
-		},
-		{
-			path: '/tasks/:id',
-			name: 'task.detail',
-			component: () => import('@/views/tasks/TaskDetailView.vue'),
-			props: route => ({ taskId: Number(route.params.id as string) }),
-		},
 		{
 			path: '/tasks/by/upcoming',
 			name: 'tasks.range',
@@ -193,121 +53,6 @@ const router = createRouter({
 				}
 			},
 		},
-		{
-			path: '/projects',
-			name: 'projects.index',
-			component: () => import('@/views/project/ListProjects.vue'),
-		},
-		{
-			path: '/projects/new',
-			name: 'project.create',
-			component: () => import('@/views/project/NewProject.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:parentProjectId/new',
-			name: 'project.createFromParent',
-			component: () => import('@/views/project/NewProject.vue'),
-			props: route => ({ parentProjectId: Number(route.params.parentProjectId as string) }),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/edit',
-			name: 'project.settings.edit',
-			component: () => import('@/views/project/settings/ProjectSettingsEdit.vue'),
-			props: route => ({ projectId: Number(route.params.projectId as string) }),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/background',
-			name: 'project.settings.background',
-			component: () => import('@/views/project/settings/ProjectSettingsBackground.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/duplicate',
-			name: 'project.settings.duplicate',
-			component: () => import('@/views/project/settings/ProjectSettingsDuplicate.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/share',
-			name: 'project.settings.share',
-			component: () => import('@/views/project/settings/ProjectSettingsShare.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/webhooks',
-			name: 'project.settings.webhooks',
-			component: () => import('@/views/project/settings/ProjectSettingsWebhooks.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/delete',
-			name: 'project.settings.delete',
-			component: () => import('@/views/project/settings/ProjectSettingsDelete.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/archive',
-			name: 'project.settings.archive',
-			component: () => import('@/views/project/settings/ProjectSettingsArchive.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/projects/:projectId/settings/views',
-			name: 'project.settings.views',
-			component: () =>  import('@/views/project/settings/ProjectSettingsViews.vue'),
-			meta: {
-				showAsModal: true,
-			},
-			props: route => ({ projectId: Number(route.params.projectId as string) }),
-		},
-		{
-			path: '/projects/:projectId/settings/edit',
-			name: 'filter.settings.edit',
-			component: () => import('@/views/filters/FilterEdit.vue'),
-			meta: {
-				showAsModal: true,
-			},
-			props: route => ({ projectId: Number(route.params.projectId as string) }),
-		},
-		{
-			path: '/projects/:projectId/settings/delete',
-			name: 'filter.settings.delete',
-			component: () => import('@/views/filters/FilterDelete.vue'),
-			meta: {
-				showAsModal: true,
-			},
-			props: route => ({ projectId: Number(route.params.projectId as string) }),
-		},
-		{
-			path: '/projects/:projectId/info',
-			name: 'project.info',
-			component: () => import('@/views/project/ProjectInfo.vue')			,
-			meta: {
-				showAsModal: true,
-			},
-			props: route => ({ projectId: Number(route.params.projectId as string) }),
-		},
 		{
 			path: '/projects/:projectId',
 			name: 'project.index',
@@ -327,64 +72,6 @@ const router = createRouter({
 				}
 			},
 		},
-		{
-			path: '/projects/:projectId/:viewId',
-			name: 'project.view',
-			component: () => import('@/views/project/ProjectView.vue'),
-			props: route => ({ 
-				projectId: parseInt(route.params.projectId as string),
-				viewId: route.params.viewId ? parseInt(route.params.viewId as string): undefined,
-			}),
-		},
-		{
-			path: '/teams',
-			name: 'teams.index',
-			component: () => import('@/views/teams/ListTeams.vue'),
-		},
-		{
-			path: '/teams/new',
-			name: 'teams.create',
-			component: () =>  import('@/views/teams/NewTeam.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/teams/:id/edit',
-			name: 'teams.edit',
-			component: () => import('@/views/teams/EditTeam.vue'),
-		},
-		{
-			path: '/labels',
-			name: 'labels.index',
-			component: () => import('@/views/labels/ListLabels.vue'),
-		},
-		{
-			path: '/labels/new',
-			name: 'labels.create',
-			component: () => import('@/views/labels/NewLabel.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/filters/new',
-			name: 'filters.create',
-			component: () => import('@/views/filters/FilterNew.vue'),
-			meta: {
-				showAsModal: true,
-			},
-		},
-		{
-			path: '/auth/openid/:provider',
-			name: 'openid.auth',
-			component: () => import('@/views/user/OpenIdAuth.vue'),
-		},
-		{
-			path: '/about',
-			name: 'about',
-			component: () => import('@/views/About.vue'),
-		},
 	],
 })
 

frontend/typed-router.d.ts

@@ -18,5 +18,48 @@ declare module 'vue-router/auto-routes' {
    * Route name map generated by unplugin-vue-router
    */
   export interface RouteNamedMap {
+    '/[[auth]]/get-password-reset': RouteRecordInfo<'/[[auth]]/get-password-reset', '/:auth?/get-password-reset', { auth?: ParamValueZeroOrOne<true> }, { auth?: ParamValueZeroOrOne<false> }>,
+    '/[[auth]]/login': RouteRecordInfo<'/[[auth]]/login', '/:auth?/login', { auth?: ParamValueZeroOrOne<true> }, { auth?: ParamValueZeroOrOne<false> }>,
+    '/[[auth]]/password-reset': RouteRecordInfo<'/[[auth]]/password-reset', '/:auth?/password-reset', { auth?: ParamValueZeroOrOne<true> }, { auth?: ParamValueZeroOrOne<false> }>,
+    '/[[auth]]/register': RouteRecordInfo<'/[[auth]]/register', '/:auth?/register', { auth?: ParamValueZeroOrOne<true> }, { auth?: ParamValueZeroOrOne<false> }>,
+    '/[[...path]]+': RouteRecordInfo<'/[[...path]]+', '/:path(.*)*', { path?: ParamValueZeroOrMore<true> }, { path?: ParamValueZeroOrMore<false> }>,
+    'home': RouteRecordInfo<'home', '/(home)', Record<never, never>, Record<never, never>>,
+    '/about': RouteRecordInfo<'/about', '/about', Record<never, never>, Record<never, never>>,
+    '/auth/openid/[provider]': RouteRecordInfo<'/auth/openid/[provider]', '/auth/openid/:provider', { provider: ParamValue<true> }, { provider: ParamValue<false> }>,
+    '/filters/[projectId]/settings/delete': RouteRecordInfo<'/filters/[projectId]/settings/delete', '/filters/:projectId/settings/delete', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/filters/[projectId]/settings/edit': RouteRecordInfo<'/filters/[projectId]/settings/edit', '/filters/:projectId/settings/edit', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/filters/new': RouteRecordInfo<'/filters/new', '/filters/new', Record<never, never>, Record<never, never>>,
+    '/labels/(labels)': RouteRecordInfo<'/labels/(labels)', '/labels/(labels)', Record<never, never>, Record<never, never>>,
+    '/labels/new': RouteRecordInfo<'/labels/new', '/labels/new', Record<never, never>, Record<never, never>>,
+    '/migrate/[service]': RouteRecordInfo<'/migrate/[service]', '/migrate/:service', { service: ParamValue<true> }, { service: ParamValue<false> }>,
+    '/projects/[[parentProjectId]]/new': RouteRecordInfo<'/projects/[[parentProjectId]]/new', '/projects/:parentProjectId?/new', { parentProjectId?: ParamValueZeroOrOne<true> }, { parentProjectId?: ParamValueZeroOrOne<false> }>,
+    '/projects/[projectId]/[[viewId]]': RouteRecordInfo<'/projects/[projectId]/[[viewId]]', '/projects/:projectId/:viewId?', { projectId: ParamValue<true>, viewId?: ParamValueZeroOrOne<true> }, { projectId: ParamValue<false>, viewId?: ParamValueZeroOrOne<false> }>,
+    '/projects/[projectId]/info': RouteRecordInfo<'/projects/[projectId]/info', '/projects/:projectId/info', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/archive': RouteRecordInfo<'/projects/[projectId]/settings/archive', '/projects/:projectId/settings/archive', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/background': RouteRecordInfo<'/projects/[projectId]/settings/background', '/projects/:projectId/settings/background', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/delete': RouteRecordInfo<'/projects/[projectId]/settings/delete', '/projects/:projectId/settings/delete', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/duplicate': RouteRecordInfo<'/projects/[projectId]/settings/duplicate', '/projects/:projectId/settings/duplicate', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/edit': RouteRecordInfo<'/projects/[projectId]/settings/edit', '/projects/:projectId/settings/edit', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/share': RouteRecordInfo<'/projects/[projectId]/settings/share', '/projects/:projectId/settings/share', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/views': RouteRecordInfo<'/projects/[projectId]/settings/views', '/projects/:projectId/settings/views', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/[projectId]/settings/webhooks': RouteRecordInfo<'/projects/[projectId]/settings/webhooks', '/projects/:projectId/settings/webhooks', { projectId: ParamValue<true> }, { projectId: ParamValue<false> }>,
+    '/projects/(projects)': RouteRecordInfo<'/projects/(projects)', '/projects/(projects)', Record<never, never>, Record<never, never>>,
+    '/share/[share]/auth': RouteRecordInfo<'/share/[share]/auth', '/share/:share/auth', { share: ParamValue<true> }, { share: ParamValue<false> }>,
+    '/task/[id]': RouteRecordInfo<'/task/[id]', '/task/:id', { id: ParamValue<true> }, { id: ParamValue<false> }>,
+    '/teams/[id]/edit': RouteRecordInfo<'/teams/[id]/edit', '/teams/:id/edit', { id: ParamValue<true> }, { id: ParamValue<false> }>,
+    '/teams/(teams)': RouteRecordInfo<'/teams/(teams)', '/teams/(teams)', Record<never, never>, Record<never, never>>,
+    '/teams/new': RouteRecordInfo<'/teams/new', '/teams/new', Record<never, never>, Record<never, never>>,
+    '/user/export/download': RouteRecordInfo<'/user/export/download', '/user/export/download', Record<never, never>, Record<never, never>>,
+    '/user/settings': RouteRecordInfo<'/user/settings', '/user/settings', Record<never, never>, Record<never, never>>,
+    '/user/settings/api-tokens': RouteRecordInfo<'/user/settings/api-tokens', '/user/settings/api-tokens', Record<never, never>, Record<never, never>>,
+    '/user/settings/avatar': RouteRecordInfo<'/user/settings/avatar', '/user/settings/avatar', Record<never, never>, Record<never, never>>,
+    '/user/settings/caldav': RouteRecordInfo<'/user/settings/caldav', '/user/settings/caldav', Record<never, never>, Record<never, never>>,
+    '/user/settings/data-export': RouteRecordInfo<'/user/settings/data-export', '/user/settings/data-export', Record<never, never>, Record<never, never>>,
+    '/user/settings/deletion': RouteRecordInfo<'/user/settings/deletion', '/user/settings/deletion', Record<never, never>, Record<never, never>>,
+    '/user/settings/email-update': RouteRecordInfo<'/user/settings/email-update', '/user/settings/email-update', Record<never, never>, Record<never, never>>,
+    '/user/settings/general': RouteRecordInfo<'/user/settings/general', '/user/settings/general', Record<never, never>, Record<never, never>>,
+    '/user/settings/migrate': RouteRecordInfo<'/user/settings/migrate', '/user/settings/migrate', Record<never, never>, Record<never, never>>,
+    '/user/settings/password-update': RouteRecordInfo<'/user/settings/password-update', '/user/settings/password-update', Record<never, never>, Record<never, never>>,
+    '/user/settings/totp': RouteRecordInfo<'/user/settings/totp', '/user/settings/totp', Record<never, never>, Record<never, never>>,
   }
 }

frontend/vite.config.ts

@@ -101,7 +101,22 @@ export default defineConfig(({mode}) => {
 			},
 		},
 		plugins: [
-			VueRouter(),
+			VueRouter({
+				// FIXME: use dynamic imports for these components
+				importMode: (filePath) => {
+					const syncImports = [
+						pathSrc + '/pages/[[auth]]/register.vue',
+						pathSrc + '/pages/share/[share]/auth.vue',
+					]
+
+					if (syncImports.includes(filePath)) {
+						console.log('sync')
+						return 'sync'
+					}
+
+					return 'async'
+				},
+			}),
 			vue({
 				script: {
 					propsDestructure: true,