This repository has been archived on 2024-02-08. You can view files and clone it, but cannot push or open issues or pull requests.
frontend/src/router/index.ts

519 lines
14 KiB
TypeScript
Raw Normal View History

2022-04-11 20:08:28 +00:00
import { createRouter, createWebHistory } from 'vue-router'
import type { RouteLocation } from 'vue-router'
import {saveLastVisited} from '@/helpers/saveLastVisited'
import {saveListView, getListView} from '@/helpers/saveListView'
import {parseDateOrString} from '@/helpers/time/parseDateOrString'
import {getNextWeekDate} from '@/helpers/time/getNextWeekDate'
import {setTitle} from '@/helpers/setTitle'
import {useListStore} from '@/stores/lists'
2022-09-21 01:37:39 +00:00
import {useAuthStore} from '@/stores/auth'
import {useBaseStore} from '@/stores/base'
2021-11-14 20:33:53 +00:00
import HomeComponent from '@/views/Home.vue'
import NotFoundComponent from '@/views/404.vue'
const About = () => import('@/views/About.vue')
2018-09-08 20:27:13 +00:00
// User Handling
import LoginComponent from '@/views/user/Login.vue'
import RegisterComponent from '@/views/user/Register.vue'
import OpenIdAuth from '@/views/user/OpenIdAuth.vue'
const DataExportDownload = () => import('@/views/user/DataExportDownload.vue')
// Tasks
import UpcomingTasksComponent from '@/views/tasks/ShowTasks.vue'
import LinkShareAuthComponent from '@/views/sharing/LinkSharingAuth.vue'
const ListNamespaces = () => import('@/views/namespaces/ListNamespaces.vue')
const TaskDetailView = () => import('@/views/tasks/TaskDetailView.vue')
// Team Handling
const ListTeamsComponent = () => import('@/views/teams/ListTeams.vue')
// Label Handling
const ListLabelsComponent = () => import('@/views/labels/ListLabels.vue')
const NewLabelComponent = () => import('@/views/labels/NewLabel.vue')
// Migration
const MigrationComponent = () => import('@/views/migrate/Migration.vue')
const MigrationHandlerComponent = () => import('@/views/migrate/MigrationHandler.vue')
// List Views
const ListList = () => import('@/views/list/ListList.vue')
const ListGantt = () => import('@/views/list/ListGantt.vue')
const ListTable = () => import('@/views/list/ListTable.vue')
const ListKanban = () => import('@/views/list/ListKanban.vue')
const ListInfo = () => import('@/views/list/ListInfo.vue')
2021-11-01 17:19:59 +00:00
// List Settings
const ListSettingEdit = () => import('@/views/list/settings/edit.vue')
const ListSettingBackground = () => import('@/views/list/settings/background.vue')
const ListSettingDuplicate = () => import('@/views/list/settings/duplicate.vue')
const ListSettingShare = () => import('@/views/list/settings/share.vue')
const ListSettingDelete = () => import('@/views/list/settings/delete.vue')
const ListSettingArchive = () => import('@/views/list/settings/archive.vue')
// Namespace Settings
const NamespaceSettingEdit = () => import('@/views/namespaces/settings/edit.vue')
const NamespaceSettingShare = () => import('@/views/namespaces/settings/share.vue')
const NamespaceSettingArchive = () => import('@/views/namespaces/settings/archive.vue')
const NamespaceSettingDelete = () => import('@/views/namespaces/settings/delete.vue')
// Saved Filters
const FilterNew = () => import('@/views/filters/FilterNew.vue')
const FilterEdit = () => import('@/views/filters/FilterEdit.vue')
const FilterDelete = () => import('@/views/filters/FilterDelete.vue')
2020-07-27 17:53:19 +00:00
const PasswordResetComponent = () => import('@/views/user/PasswordReset.vue')
const GetPasswordResetComponent = () => import('@/views/user/RequestPasswordReset.vue')
const UserSettingsComponent = () => import('@/views/user/Settings.vue')
const UserSettingsAvatarComponent = () => import('@/views/user/settings/Avatar.vue')
const UserSettingsCaldavComponent = () => import('@/views/user/settings/Caldav.vue')
const UserSettingsDataExportComponent = () => import('@/views/user/settings/DataExport.vue')
const UserSettingsDeletionComponent = () => import('@/views/user/settings/Deletion.vue')
const UserSettingsEmailUpdateComponent = () => import('@/views/user/settings/EmailUpdate.vue')
const UserSettingsGeneralComponent = () => import('@/views/user/settings/General.vue')
const UserSettingsPasswordUpdateComponent = () => import('@/views/user/settings/PasswordUpdate.vue')
const UserSettingsTOTPComponent = () => import('@/views/user/settings/TOTP.vue')
2018-09-08 21:33:23 +00:00
// List Handling
const NewListComponent = () => import('@/views/list/NewList.vue')
2018-09-11 17:20:07 +00:00
// Namespace Handling
const NewNamespaceComponent = () => import('@/views/namespaces/NewNamespace.vue')
2020-07-27 17:53:19 +00:00
const EditTeamComponent = () => import('@/views/teams/EditTeam.vue')
const NewTeamComponent = () => import('@/views/teams/NewTeam.vue')
2021-08-20 13:17:19 +00:00
const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL),
Kanban (#118) Add error message when trying to create an invalid new task in a bucket Prevent creation of new buckets if the bucket title is empty Disable deleting a bucket if it's the last one Disable dragging tasks when they are being updated Fix transition when opening tasks Send the user to list view by default Show loading spinner when updating multiple tasks Add loading spinner when moving tasks Add loading animation when bucket is loading / updating etc Add bucket title edit Fix creating new buckets Add loading animation Add removing buckets Fix creating a new bucket after tasks were moved Fix warning about labels on tasks Fix labels on tasks not updating after retrieval from api Fix property width Add closing and mobile design Make the task detail popup look good Move list views Move task detail view in a popup Add link to tasks Add saving the new task position after it was moved Fix creating new bucket Fix creating a new task Cleanup Disable user selection for task cards Fix drag placeholder Add dragging style to task Add placeholder + change animation duration More cleanup Cleanup / docs Working of dragging and dropping tasks Adjust markup and styling for new library Change kanban library to something that works Add basic calculation of new positions Don't try to create empty tasks Add indicator if a task is done Add moving tasks between buckets Make empty buckets a little smaller Add gimmick for button description Fix color Fix scrolling bucket layout Add creating a new bucket Add hiding the task input field Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/118
2020-04-25 23:11:34 +00:00
scrollBehavior(to, from, savedPosition) {
2019-10-20 19:40:44 +00:00
// If the user is using their forward/backward keys to navigate, we want to restore the scroll view
Kanban (#118) Add error message when trying to create an invalid new task in a bucket Prevent creation of new buckets if the bucket title is empty Disable deleting a bucket if it's the last one Disable dragging tasks when they are being updated Fix transition when opening tasks Send the user to list view by default Show loading spinner when updating multiple tasks Add loading spinner when moving tasks Add loading animation when bucket is loading / updating etc Add bucket title edit Fix creating new buckets Add loading animation Add removing buckets Fix creating a new bucket after tasks were moved Fix warning about labels on tasks Fix labels on tasks not updating after retrieval from api Fix property width Add closing and mobile design Make the task detail popup look good Move list views Move task detail view in a popup Add link to tasks Add saving the new task position after it was moved Fix creating new bucket Fix creating a new task Cleanup Disable user selection for task cards Fix drag placeholder Add dragging style to task Add placeholder + change animation duration More cleanup Cleanup / docs Working of dragging and dropping tasks Adjust markup and styling for new library Change kanban library to something that works Add basic calculation of new positions Don't try to create empty tasks Add indicator if a task is done Add moving tasks between buckets Make empty buckets a little smaller Add gimmick for button description Fix color Fix scrolling bucket layout Add creating a new bucket Add hiding the task input field Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/118
2020-04-25 23:11:34 +00:00
if (savedPosition) {
2019-10-20 19:40:44 +00:00
return savedPosition
}
// Scroll to anchor should still work
Kanban (#118) Add error message when trying to create an invalid new task in a bucket Prevent creation of new buckets if the bucket title is empty Disable deleting a bucket if it's the last one Disable dragging tasks when they are being updated Fix transition when opening tasks Send the user to list view by default Show loading spinner when updating multiple tasks Add loading spinner when moving tasks Add loading animation when bucket is loading / updating etc Add bucket title edit Fix creating new buckets Add loading animation Add removing buckets Fix creating a new bucket after tasks were moved Fix warning about labels on tasks Fix labels on tasks not updating after retrieval from api Fix property width Add closing and mobile design Make the task detail popup look good Move list views Move task detail view in a popup Add link to tasks Add saving the new task position after it was moved Fix creating new bucket Fix creating a new task Cleanup Disable user selection for task cards Fix drag placeholder Add dragging style to task Add placeholder + change animation duration More cleanup Cleanup / docs Working of dragging and dropping tasks Adjust markup and styling for new library Change kanban library to something that works Add basic calculation of new positions Don't try to create empty tasks Add indicator if a task is done Add moving tasks between buckets Make empty buckets a little smaller Add gimmick for button description Fix color Fix scrolling bucket layout Add creating a new bucket Add hiding the task input field Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/118
2020-04-25 23:11:34 +00:00
if (to.hash) {
2022-01-30 15:48:02 +00:00
return {el: to.hash}
2019-10-20 19:40:44 +00:00
}
// Otherwise just scroll to the top
2021-08-20 13:17:19 +00:00
return {left: 0, top: 0}
2019-10-20 19:40:44 +00:00
},
2019-03-07 19:48:40 +00:00
routes: [
{
path: '/',
name: 'home',
component: HomeComponent,
2019-03-07 19:48:40 +00:00
},
2020-03-02 19:30:49 +00:00
{
2021-08-20 13:17:19 +00:00
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',
2020-03-02 19:30:49 +00:00
component: NotFoundComponent,
},
2019-03-07 19:48:40 +00:00
{
path: '/login',
name: 'user.login',
component: LoginComponent,
meta: {
title: 'user.auth.login',
},
2019-03-07 19:48:40 +00:00
},
{
path: '/get-password-reset',
name: 'user.password-reset.request',
component: GetPasswordResetComponent,
meta: {
title: 'user.auth.resetPassword',
},
2019-03-07 19:48:40 +00:00
},
{
path: '/password-reset',
name: 'user.password-reset.reset',
component: PasswordResetComponent,
meta: {
title: 'user.auth.resetPassword',
},
2019-03-07 19:48:40 +00:00
},
{
path: '/register',
name: 'user.register',
component: RegisterComponent,
meta: {
2021-11-28 15:35:59 +00:00
title: 'user.auth.createAccount',
},
2019-03-07 19:48:40 +00:00
},
{
path: '/user/settings',
name: 'user.settings',
component: UserSettingsComponent,
redirect: {name: 'user.settings.general'},
children: [
{
path: '/user/settings/avatar',
name: 'user.settings.avatar',
component: UserSettingsAvatarComponent,
},
{
path: '/user/settings/caldav',
name: 'user.settings.caldav',
component: UserSettingsCaldavComponent,
},
{
path: '/user/settings/data-export',
name: 'user.settings.data-export',
component: UserSettingsDataExportComponent,
},
{
path: '/user/settings/deletion',
name: 'user.settings.deletion',
component: UserSettingsDeletionComponent,
},
{
path: '/user/settings/email-update',
name: 'user.settings.email-update',
component: UserSettingsEmailUpdateComponent,
},
{
path: '/user/settings/general',
name: 'user.settings.general',
component: UserSettingsGeneralComponent,
},
{
path: '/user/settings/password-update',
name: 'user.settings.password-update',
component: UserSettingsPasswordUpdateComponent,
},
{
path: '/user/settings/totp',
name: 'user.settings.totp',
component: UserSettingsTOTPComponent,
},
],
},
{
path: '/user/export/download',
name: 'user.export.download',
component: DataExportDownload,
},
{
path: '/share/:share/auth',
name: 'link-share.auth',
component: LinkShareAuthComponent,
},
{
path: '/namespaces',
name: 'namespaces.index',
component: ListNamespaces,
},
{
path: '/namespaces/new',
name: 'namespace.create',
2021-11-01 17:19:59 +00:00
component: NewNamespaceComponent,
meta: {
showAsModal: true,
},
},
2019-03-07 19:48:40 +00:00
{
path: '/namespaces/:id/settings/edit',
name: 'namespace.settings.edit',
2021-11-01 17:19:59 +00:00
component: NamespaceSettingEdit,
meta: {
showAsModal: true,
},
2022-09-15 10:52:38 +00:00
props: route => ({ namespaceId: Number(route.params.id as string) }),
},
{
2021-11-30 15:58:15 +00:00
path: '/namespaces/:namespaceId/settings/share',
name: 'namespace.settings.share',
2021-11-01 17:19:59 +00:00
component: NamespaceSettingShare,
meta: {
showAsModal: true,
},
},
{
path: '/namespaces/:id/settings/archive',
name: 'namespace.settings.archive',
2021-11-01 17:19:59 +00:00
component: NamespaceSettingArchive,
meta: {
showAsModal: true,
},
props: route => ({ namespaceId: parseInt(route.params.id as string) }),
},
{
path: '/namespaces/:id/settings/delete',
name: 'namespace.settings.delete',
2021-11-01 17:19:59 +00:00
component: NamespaceSettingDelete,
meta: {
showAsModal: true,
},
props: route => ({ namespaceId: Number(route.params.id as string) }),
2019-03-07 19:48:40 +00:00
},
{
path: '/tasks/:id',
name: 'task.detail',
component: TaskDetailView,
2022-09-15 10:52:38 +00:00
props: route => ({ taskId: Number(route.params.id as string) }),
},
{
path: '/tasks/by/upcoming',
name: 'tasks.range',
component: UpcomingTasksComponent,
props: route => ({
2022-02-09 16:52:27 +00:00
dateFrom: parseDateOrString(route.query.from as string, new Date()),
dateTo: parseDateOrString(route.query.to as string, getNextWeekDate()),
showNulls: route.query.showNulls === 'true',
showOverdue: route.query.showOverdue === 'true',
2022-02-06 19:32:21 +00:00
}),
},
2021-11-01 17:19:59 +00:00
{
2021-11-17 17:04:53 +00:00
path: '/lists/new/:namespaceId/',
2021-11-01 17:19:59 +00:00
name: 'list.create',
component: NewListComponent,
meta: {
showAsModal: true,
},
},
{
path: '/lists/:listId/settings/edit',
name: 'list.settings.edit',
2021-11-01 17:19:59 +00:00
component: ListSettingEdit,
2022-09-15 10:52:38 +00:00
props: route => ({ listId: Number(route.params.listId as string) }),
2021-11-01 17:19:59 +00:00
meta: {
showAsModal: true,
},
},
{
path: '/lists/:listId/settings/background',
name: 'list.settings.background',
2021-11-01 17:19:59 +00:00
component: ListSettingBackground,
meta: {
showAsModal: true,
},
},
{
path: '/lists/:listId/settings/duplicate',
name: 'list.settings.duplicate',
2021-11-01 17:19:59 +00:00
component: ListSettingDuplicate,
meta: {
showAsModal: true,
},
},
{
path: '/lists/:listId/settings/share',
name: 'list.settings.share',
2021-11-01 17:19:59 +00:00
component: ListSettingShare,
meta: {
showAsModal: true,
},
},
{
path: '/lists/:listId/settings/delete',
name: 'list.settings.delete',
2021-11-01 17:19:59 +00:00
component: ListSettingDelete,
meta: {
showAsModal: true,
},
},
{
path: '/lists/:listId/settings/archive',
name: 'list.settings.archive',
2021-11-01 17:19:59 +00:00
component: ListSettingArchive,
meta: {
showAsModal: true,
},
},
{
path: '/lists/:listId/settings/edit',
name: 'filter.settings.edit',
2021-11-01 17:19:59 +00:00
component: FilterEdit,
meta: {
showAsModal: true,
},
props: route => ({ listId: Number(route.params.listId as string) }),
},
{
path: '/lists/:listId/settings/delete',
name: 'filter.settings.delete',
2021-11-01 17:19:59 +00:00
component: FilterDelete,
meta: {
showAsModal: true,
},
props: route => ({ listId: Number(route.params.listId as string) }),
},
{
path: '/lists/:listId/info',
name: 'list.info',
component: ListInfo,
meta: {
showAsModal: true,
},
props: route => ({ listId: Number(route.params.listId as string) }),
},
2019-04-29 21:41:39 +00:00
{
Kanban (#118) Add error message when trying to create an invalid new task in a bucket Prevent creation of new buckets if the bucket title is empty Disable deleting a bucket if it's the last one Disable dragging tasks when they are being updated Fix transition when opening tasks Send the user to list view by default Show loading spinner when updating multiple tasks Add loading spinner when moving tasks Add loading animation when bucket is loading / updating etc Add bucket title edit Fix creating new buckets Add loading animation Add removing buckets Fix creating a new bucket after tasks were moved Fix warning about labels on tasks Fix labels on tasks not updating after retrieval from api Fix property width Add closing and mobile design Make the task detail popup look good Move list views Move task detail view in a popup Add link to tasks Add saving the new task position after it was moved Fix creating new bucket Fix creating a new task Cleanup Disable user selection for task cards Fix drag placeholder Add dragging style to task Add placeholder + change animation duration More cleanup Cleanup / docs Working of dragging and dropping tasks Adjust markup and styling for new library Change kanban library to something that works Add basic calculation of new positions Don't try to create empty tasks Add indicator if a task is done Add moving tasks between buckets Make empty buckets a little smaller Add gimmick for button description Fix color Fix scrolling bucket layout Add creating a new bucket Add hiding the task input field Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/118
2020-04-25 23:11:34 +00:00
path: '/lists/:listId',
name: 'list.index',
redirect(to) {
2021-11-14 20:33:53 +00:00
// Redirect the user to list view by default
const savedListView = getListView(to.params.listId)
console.debug('Replaced list view with', savedListView)
return {
name: router.hasRoute(savedListView)
? savedListView
: 'list.list',
2021-11-14 20:33:53 +00:00
params: {listId: to.params.listId},
}
},
},
{
path: '/lists/:listId/list',
name: 'list.list',
component: ListList,
beforeEnter: (to) => saveListView(to.params.listId, to.name),
2022-09-15 10:52:38 +00:00
props: route => ({ listId: Number(route.params.listId as string) }),
2021-11-14 20:33:53 +00:00
},
{
path: '/lists/:listId/gantt',
name: 'list.gantt',
component: ListGantt,
beforeEnter: (to) => saveListView(to.params.listId, to.name),
// FIXME: test if `useRoute` would be the same. If it would use it instead.
props: route => ({route}),
2021-11-14 20:33:53 +00:00
},
{
path: '/lists/:listId/table',
name: 'list.table',
component: ListTable,
beforeEnter: (to) => saveListView(to.params.listId, to.name),
2022-09-15 10:52:38 +00:00
props: route => ({ listId: Number(route.params.listId as string) }),
2021-11-14 20:33:53 +00:00
},
{
path: '/lists/:listId/kanban',
name: 'list.kanban',
component: ListKanban,
beforeEnter: (to) => {
saveListView(to.params.listId, to.name)
// Properly set the page title when a task popup is closed
const listStore = useListStore()
const listFromStore = listStore.getListById(Number(to.params.listId))
if(listFromStore) {
setTitle(listFromStore.title)
}
},
2022-09-15 10:52:38 +00:00
props: route => ({ listId: Number(route.params.listId as string) }),
2019-04-29 21:41:39 +00:00
},
2019-03-07 19:48:40 +00:00
{
path: '/teams',
name: 'teams.index',
component: ListTeamsComponent,
2019-03-07 19:48:40 +00:00
},
{
path: '/teams/new',
name: 'teams.create',
2021-11-01 17:19:59 +00:00
component: NewTeamComponent,
meta: {
showAsModal: true,
},
2019-03-07 19:48:40 +00:00
},
{
path: '/teams/:id/edit',
name: 'teams.edit',
component: EditTeamComponent,
2019-03-07 19:48:40 +00:00
},
{
path: '/labels',
name: 'labels.index',
component: ListLabelsComponent,
2019-09-09 17:55:43 +00:00
},
{
path: '/labels/new',
name: 'labels.create',
2021-11-01 17:19:59 +00:00
component: NewLabelComponent,
meta: {
showAsModal: true,
},
},
{
path: '/migrate',
name: 'migrate.start',
component: MigrationComponent,
},
{
2020-05-24 13:31:27 +00:00
path: '/migrate/:service',
name: 'migrate.service',
component: MigrationHandlerComponent,
props: route => ({
service: route.params.service as string,
code: route.query.code as string,
}),
},
{
path: '/filters/new',
name: 'filters.create',
2021-11-01 17:19:59 +00:00
component: FilterNew,
meta: {
showAsModal: true,
},
},
{
path: '/auth/openid/:provider',
name: 'openid.auth',
component: OpenIdAuth,
},
{
path: '/about',
name: 'about',
component: About,
},
],
2021-08-20 13:17:19 +00:00
})
export async function getAuthForRoute(route: RouteLocation) {
2022-09-21 01:37:39 +00:00
const authStore = useAuthStore()
if (authStore.authUser || authStore.authLinkShare) {
return
}
const baseStore = useBaseStore()
// When trying this before the current user was fully loaded we might get a flash of the login screen
// in the user shell. To make shure this does not happen we check if everything is ready before trying.
if (!baseStore.ready) {
return
}
2021-08-20 13:17:19 +00:00
// Check if the user is already logged in and redirect them to the home page if not
if (
![
'user.login',
'user.password-reset.request',
'user.password-reset.reset',
'user.register',
'link-share.auth',
'openid.auth',
].includes(route.name as string) &&
localStorage.getItem('passwordResetToken') === null &&
2022-10-20 14:15:58 +00:00
localStorage.getItem('emailConfirmToken') === null &&
2022-10-20 14:19:19 +00:00
!(route.name === 'home' && (typeof route.query.userPasswordReset !== 'undefined' || typeof route.query.userEmailConfirm !== 'undefined'))
) {
2022-10-23 11:12:04 +00:00
saveLastVisited(route.name as string, route.params, route.query)
return {name: 'user.login'}
}
2022-10-20 14:15:58 +00:00
if(localStorage.getItem('passwordResetToken') !== null && route.name !== 'user.password-reset.reset') {
return {name: 'user.password-reset.reset'}
}
if(localStorage.getItem('emailConfirmToken') !== null && route.name !== 'user.login') {
return {name: 'user.login'}
}
}
2021-08-20 13:17:19 +00:00
router.beforeEach(async (to) => {
return getAuthForRoute(to)
})
2021-08-20 13:17:19 +00:00
export default router