diff --git a/src/views/list/ListWrapper.vue b/src/views/list/ListWrapper.vue
index 9b3911a7c..cac6e54b0 100644
--- a/src/views/list/ListWrapper.vue
+++ b/src/views/list/ListWrapper.vue
@@ -42,7 +42,7 @@
-
+
@@ -55,12 +55,12 @@ import Message from '@/components/misc/message.vue'
import ListModel from '@/models/list'
import ListService from '@/services/list'
-import {store} from '@/store'
-import {CURRENT_LIST} from '@/store/mutation-types'
+import {BACKGROUND, CURRENT_LIST} from '@/store/mutation-types'
import {getListTitle} from '@/helpers/getListTitle'
import {saveListToHistory} from '@/modules/listHistory'
-import { useTitle } from '@/composables/useTitle'
+import {useTitle} from '@/composables/useTitle'
+import {useStore} from 'vuex'
const props = defineProps({
listId: {
@@ -74,6 +74,7 @@ const props = defineProps({
})
const route = useRoute()
+const store = useStore()
const listService = shallowRef(new ListService())
const loadedListId = ref(0)
@@ -87,7 +88,7 @@ const currentList = computed(() => {
} : store.state.currentList
})
-// call again the method if the listId changes
+// call the method again if the listId changes
watchEffect(() => loadList(props.listId))
useTitle(() => currentList.value.id ? getListTitle(currentList.value) : '')
@@ -123,6 +124,14 @@ async function loadList(listIdToLoad: number) {
console.debug(`Loading list, props.viewName = ${props.viewName}, $route.params =`, route.params, `, loadedListId = ${loadedListId.value}, currentList = `, currentList.value)
+ // Put set the current list to the one we're about to load so that the title is already shown at the top
+ loadedListId.value = 0
+ const listFromStore = store.getters['lists/getListById'](listData.id)
+ if (listFromStore !== null) {
+ store.commit(BACKGROUND, null)
+ store.commit(CURRENT_LIST, listFromStore)
+ }
+
// We create an extra list object instead of creating it in list.value because that would trigger a ui update which would result in bad ux.
const list = new ListModel(listData)
try {