fix: setting list background in store #1616
|
@ -47,7 +47,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import {ref, computed, watchEffect} from 'vue'
|
import {ref, computed, watch, watchEffect} from 'vue'
|
||||||
import {useRoute} from 'vue-router'
|
import {useRoute} from 'vue-router'
|
||||||
|
|
||||||
import Message from '@/components/misc/message.vue'
|
import Message from '@/components/misc/message.vue'
|
||||||
|
@ -88,6 +88,21 @@ const currentList = computed(() => {
|
||||||
} : store.state.currentList
|
} : store.state.currentList
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// watchEffect would be called every time the prop would get a value assigned, even if that value was the same as before.
|
||||||
|
// This resulted in loading and setting the list multiple times, even when navigating away from it.
|
||||||
|
// This caused wired bugs where the list background would be set on the home page but only right after setting a new
|
||||||
|
// list background and then navigating to home. It also highlighted the list in the menu and didn't allow changing any
|
||||||
|
// of it, most likely due to the rights not being properly populated.
|
||||||
|
watch(
|
||||||
|
() => props.listId,
|
||||||
|
(listId) => {
|
||||||
|
loadList(listId)
|
||||||
|
},
|
||||||
|
{
|
||||||
|
immediate: true,
|
||||||
|
},
|
||||||
|
)
|
||||||
|
|
||||||
// call the method again if the listId changes
|
// call the method again if the listId changes
|
||||||
watchEffect(() => loadList(props.listId))
|
watchEffect(() => loadList(props.listId))
|
||||||
|
|||||||
|
|
||||||
|
|
|
@ -134,6 +134,7 @@ export default {
|
||||||
const list = await this.backgroundService.update({id: backgroundId, listId: this.$route.params.listId})
|
const list = await this.backgroundService.update({id: backgroundId, listId: this.$route.params.listId})
|
||||||
await this.$store.dispatch(CURRENT_LIST, list)
|
await this.$store.dispatch(CURRENT_LIST, list)
|
||||||
this.$store.commit('namespaces/setListInNamespaceById', list)
|
this.$store.commit('namespaces/setListInNamespaceById', list)
|
||||||
|
this.$store.commit('lists/setList', list)
|
||||||
this.$message.success({message: this.$t('list.background.success')})
|
this.$message.success({message: this.$t('list.background.success')})
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -145,6 +146,7 @@ export default {
|
||||||
const list = await this.backgroundUploadService.create(this.$route.params.listId, this.$refs.backgroundUploadInput.files[0])
|
const list = await this.backgroundUploadService.create(this.$route.params.listId, this.$refs.backgroundUploadInput.files[0])
|
||||||
await this.$store.dispatch(CURRENT_LIST, list)
|
await this.$store.dispatch(CURRENT_LIST, list)
|
||||||
this.$store.commit('namespaces/setListInNamespaceById', list)
|
this.$store.commit('namespaces/setListInNamespaceById', list)
|
||||||
|
this.$store.commit('lists/setList', list)
|
||||||
this.$message.success({message: this.$t('list.background.success')})
|
this.$message.success({message: this.$t('list.background.success')})
|
||||||
},
|
},
|
||||||
|
|
||||||
|
@ -152,6 +154,7 @@ export default {
|
||||||
const list = await this.listService.removeBackground(this.currentList)
|
const list = await this.listService.removeBackground(this.currentList)
|
||||||
await this.$store.dispatch(CURRENT_LIST, list)
|
await this.$store.dispatch(CURRENT_LIST, list)
|
||||||
this.$store.commit('namespaces/setListInNamespaceById', list)
|
this.$store.commit('namespaces/setListInNamespaceById', list)
|
||||||
|
this.$store.commit('lists/setList', list)
|
||||||
this.$message.success({message: this.$t('list.background.removeSuccess')})
|
this.$message.success({message: this.$t('list.background.removeSuccess')})
|
||||||
this.$router.back()
|
this.$router.back()
|
||||||
},
|
},
|
||||||
|
|
Reference in New Issue
@konrad: reading the comment: shouldn't this be removed?
Probably, yes. Not sure why this works with this line still present.
Made a pull request #1795