feat: default view setting (#2306)
This PR adds configuration of default project view in settings, which is used when the user has not visited the project and thus last view hasn't yet been saved in projects. Updates old settings and adds "First View" option with fallback. Resolves https://kolaente.dev/vikunja/vikunja/issues/2153 Co-authored-by: Elscrux <nickposer2102@gmail.com> Reviewed-on: https://kolaente.dev/vikunja/vikunja/pulls/2306 Reviewed-by: konrad <k@knt.li> Co-authored-by: Elscrux <elscrux@gmail.com> Co-committed-by: Elscrux <elscrux@gmail.com>
This commit is contained in:
@ -8,6 +8,8 @@ import ProjectList from '@/components/project/views/ProjectList.vue'
|
||||
import ProjectGantt from '@/components/project/views/ProjectGantt.vue'
|
||||
import ProjectTable from '@/components/project/views/ProjectTable.vue'
|
||||
import ProjectKanban from '@/components/project/views/ProjectKanban.vue'
|
||||
import {useAuthStore} from '@/stores/auth'
|
||||
import {DEFAULT_PROJECT_VIEW_SETTINGS} from '@/modelTypes/IProjectView'
|
||||
|
||||
const {
|
||||
projectId,
|
||||
@ -19,6 +21,7 @@ const {
|
||||
|
||||
const router = useRouter()
|
||||
const projectStore = useProjectStore()
|
||||
const authStore = useAuthStore()
|
||||
|
||||
const currentView = computed(() => {
|
||||
const project = projectStore.projects[projectId]
|
||||
@ -26,17 +29,27 @@ const currentView = computed(() => {
|
||||
return project?.views.find(v => v.id === viewId)
|
||||
})
|
||||
|
||||
function redirectToFirstViewIfNecessary() {
|
||||
function redirectToDefaultViewIfNecessary() {
|
||||
if (viewId === 0 || !projectStore.projects[projectId]?.views.find(v => v.id === viewId)) {
|
||||
// Ideally, we would do that in the router redirect, but the projects (and therefore, the views)
|
||||
// are not always loaded then.
|
||||
const firstViewId = projectStore.projects[projectId]?.views[0].id
|
||||
if (firstViewId) {
|
||||
|
||||
let view
|
||||
if (authStore.settings.frontendSettings.defaultView !== DEFAULT_PROJECT_VIEW_SETTINGS.FIRST) {
|
||||
view = projectStore.projects[projectId]?.views.find(v => v.viewKind === authStore.settings.frontendSettings.defaultView)
|
||||
}
|
||||
|
||||
// Use the first view as fallback if the default view is not available
|
||||
if (view === undefined && projectStore.projects[projectId]?.views?.length > 0) {
|
||||
view = projectStore.projects[projectId]?.views[0]
|
||||
}
|
||||
|
||||
if (view) {
|
||||
router.replace({
|
||||
name: 'project.view',
|
||||
params: {
|
||||
projectId,
|
||||
viewId: firstViewId,
|
||||
viewId: view.id,
|
||||
},
|
||||
})
|
||||
}
|
||||
@ -45,13 +58,13 @@ function redirectToFirstViewIfNecessary() {
|
||||
|
||||
watch(
|
||||
() => viewId,
|
||||
redirectToFirstViewIfNecessary,
|
||||
redirectToDefaultViewIfNecessary,
|
||||
{immediate: true},
|
||||
)
|
||||
|
||||
watch(
|
||||
() => projectStore.projects[projectId],
|
||||
redirectToFirstViewIfNecessary,
|
||||
redirectToDefaultViewIfNecessary,
|
||||
)
|
||||
|
||||
// using a watcher instead of beforeEnter because beforeEnter is not called when only the viewId changes
|
||||
|
@ -26,6 +26,22 @@
|
||||
</label>
|
||||
<ProjectSearch v-model="defaultProject" />
|
||||
</div>
|
||||
<div class="field">
|
||||
<label class="label">
|
||||
{{ $t('user.settings.general.defaultView') }}
|
||||
</label>
|
||||
<div class="select">
|
||||
<select v-model="settings.frontendSettings.defaultView">
|
||||
<option
|
||||
v-for="view in DEFAULT_PROJECT_VIEW_SETTINGS"
|
||||
:key="view"
|
||||
:value="view"
|
||||
>
|
||||
{{ $t(`project.${view}.title`) }}
|
||||
</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="hasFilters"
|
||||
class="field"
|
||||
@ -221,6 +237,7 @@ import {useProjectStore} from '@/stores/projects'
|
||||
import {useAuthStore} from '@/stores/auth'
|
||||
import type {IUserSettings} from '@/modelTypes/IUserSettings'
|
||||
import {isSavedFilter} from '@/services/savedFilter'
|
||||
import {DEFAULT_PROJECT_VIEW_SETTINGS} from '@/modelTypes/IProjectView'
|
||||
|
||||
const {t} = useI18n({useScope: 'global'})
|
||||
useTitle(() => `${t('user.settings.general.title')} - ${t('user.settings.title')}`)
|
||||
@ -253,12 +270,15 @@ function useAvailableTimezones() {
|
||||
const availableTimezones = useAvailableTimezones()
|
||||
|
||||
const authStore = useAuthStore()
|
||||
|
||||
const settings = ref<IUserSettings>({
|
||||
...authStore.settings,
|
||||
frontendSettings: {
|
||||
// Sub objects get exported as read only as well, so we need to
|
||||
// explicitly spread the object here to allow modification
|
||||
...authStore.settings.frontendSettings,
|
||||
// Add fallback for old settings that don't have the default view set
|
||||
defaultView: authStore.settings.frontendSettings.defaultView ?? DEFAULT_PROJECT_VIEW_SETTINGS.FIRST,
|
||||
},
|
||||
})
|
||||
const id = ref(createRandomID())
|
||||
|
Reference in New Issue
Block a user