ami/tl-vikunja
1
0
Fork 0
Code

feat(navigation): persist project open state in navigation

Browse Source 
With this change, the project's collapsed open/closed state in the navigation survives a browser reload. Previously, all state would be lost after reloading.

Resolves https://kolaente.dev/vikunja/vikunja/issues/2067
This commit is contained in:
kolaente 2024-02-12 22:22:55 +01:00
parent 0b61885e89
commit d7d3ffeebd
No known key found for this signature in database
GPG Key ID: F40E70337AB24C9B
1 changed files with 14 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/components/home/ProjectsNavigationItem.vue
View File

@ -84,9 +84,10 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import {computed, ref} from 'vue' import {computed} from 'vue'
import {useProjectStore} from '@/stores/projects' import {useProjectStore} from '@/stores/projects'
import {useBaseStore} from '@/stores/base' import {useBaseStore} from '@/stores/base'
import {useStorage} from '@vueuse/core'
import type {IProject} from '@/modelTypes/IProject' import type {IProject} from '@/modelTypes/IProject'
@ -112,7 +113,18 @@ const projectStore = useProjectStore()
const baseStore = useBaseStore() const baseStore = useBaseStore()
const currentProject = computed(() => baseStore.currentProject) const currentProject = computed(() => baseStore.currentProject)
const childProjectsOpen = ref(true) // Persist open state across browser reloads. Using a seperate ref for the state
// allows us to use only one entry in local storage instead of one for every project id.
type openState = { [key: number]: boolean }
const childProjectsOpenState = useStorage<openState>('navigation-child-projects-open', {})
const childProjectsOpen = computed({
get() {
return childProjectsOpenState.value[project.id] ?? true
},
set(open) {
childProjectsOpenState.value[project.id] = open
},
})
const childProjects = computed(() => { const childProjects = computed(() => {
return projectStore.getChildProjects(project.id) return projectStore.getChildProjects(project.id)