1
0

feat: move list store to pina (#2392)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/2392
Reviewed-by: konrad <k@knt.li>
Co-authored-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
Co-committed-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
This commit is contained in:
Dominik Pschenitschni
2022-09-21 16:21:25 +00:00
committed by konrad
parent f85a08afb4
commit a38075f376
23 changed files with 272 additions and 239 deletions

View File

@ -71,10 +71,12 @@ import {getHistory} from '@/modules/listHistory'
import {parseDateOrNull} from '@/helpers/parseDateOrNull'
import {formatDateShort, formatDateSince} from '@/helpers/time/formatDate'
import {useDateTimeSalutation} from '@/composables/useDateTimeSalutation'
import {useListStore} from '@/stores/lists'
const welcome = useDateTimeSalutation()
const store = useStore()
const listStore = useListStore()
const listHistory = computed(() => {
// If we don't check this, it tries to load the list background right after logging out
if(!store.state.auth.authenticated) {
@ -82,7 +84,7 @@ const listHistory = computed(() => {
}
return getHistory()
.map(l => store.getters['lists/getListById'](l.id))
.map(l => listStore.getListById(l.id))
.filter(l => l !== null)
})

View File

@ -15,11 +15,11 @@
<script lang="ts" setup>
import {computed} from 'vue'
import {useStore} from '@/store'
import {setupMarkdownRenderer} from '@/helpers/markdownRenderer'
import {marked} from 'marked'
import DOMPurify from 'dompurify'
import {createRandomID} from '@/helpers/randomId'
import {useListStore} from '@/stores/lists'
const props = defineProps({
listId: {
@ -28,8 +28,8 @@ const props = defineProps({
},
})
const store = useStore()
const list = computed(() => store.getters['lists/getListById'](props.listId))
const listStore = useListStore()
const list = computed(() => listStore.getListById(props.listId))
const htmlDescription = computed(() => {
const description = list.value?.description || ''
if (description === '') {

View File

@ -61,6 +61,7 @@ import {getListTitle} from '@/helpers/getListTitle'
import {saveListToHistory} from '@/modules/listHistory'
import {useTitle} from '@/composables/useTitle'
import {useStore} from '@/store'
import {useListStore} from '@/stores/lists'
const props = defineProps({
listId: {
@ -76,6 +77,7 @@ const props = defineProps({
const route = useRoute()
const store = useStore()
const listStore = useListStore()
const listService = ref(new ListService())
const loadedListId = ref(0)
@ -135,7 +137,7 @@ async function loadList(listIdToLoad: number) {
// 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)
const listFromStore = listStore.getListById(listData.id)
if (listFromStore !== null) {
store.commit(BACKGROUND, null)
store.commit(BLUR_HASH, null)

View File

@ -35,18 +35,17 @@
import {ref, reactive, shallowReactive} from 'vue'
import {useI18n} from 'vue-i18n'
import {useRouter, useRoute} from 'vue-router'
import {useStore} from '@/store'
import ListService from '@/services/list'
import ListModel from '@/models/list'
import CreateEdit from '@/components/misc/create-edit.vue'
import ColorPicker from '@/components/input/colorPicker.vue'
import { success } from '@/message'
import { useTitle } from '@/composables/useTitle'
import {success} from '@/message'
import {useTitle} from '@/composables/useTitle'
import {useListStore} from '@/stores/lists'
const {t} = useI18n({useScope: 'global'})
const store = useStore()
const router = useRouter()
const route = useRoute()
@ -55,6 +54,7 @@ useTitle(() => t('list.create.header'))
const showError = ref(false)
const list = reactive(new ListModel())
const listService = shallowReactive(new ListService())
const listStore = useListStore()
async function createNewList() {
if (list.title === '') {
@ -64,7 +64,7 @@ async function createNewList() {
showError.value = false
list.namespaceId = Number(route.params.namespaceId as string)
const newList = await store.dispatch('lists/createList', list)
const newList = await listStore.createList(list)
await router.push({
name: 'list.index',
params: { listId: newList.id },

View File

@ -23,18 +23,20 @@ import {useI18n} from 'vue-i18n'
import { success } from '@/message'
import { useTitle } from '@/composables/useTitle'
import { useListStore } from '@/stores/lists'
const {t} = useI18n({useScope: 'global'})
const store = useStore()
const listStore = useListStore()
const router = useRouter()
const route = useRoute()
const list = computed(() => store.getters['lists/getListById'](route.params.listId))
const list = computed(() => listStore.getListById(route.params.listId))
useTitle(() => t('list.archive.title', {list: list.value.title}))
async function archiveList() {
try {
const newList = await store.dispatch('lists/updateList', {
const newList = await listStore.updateList({
...list.value,
isArchived: !list.value.isArchived,
})

View File

@ -105,6 +105,7 @@ import {useStore} from '@/store'
import {useRoute, useRouter} from 'vue-router'
import debounce from 'lodash.debounce'
import BaseButton from '@/components/base/BaseButton.vue'
import {useListStore} from '@/stores/lists'
import BackgroundUnsplashService from '@/services/backgroundUnsplash'
import BackgroundUploadService from '@/services/backgroundUpload'
@ -141,6 +142,7 @@ const debounceNewBackgroundSearch = debounce(newBackgroundSearch, SEARCH_DEBOUNC
const backgroundUploadService = ref(new BackgroundUploadService())
const listService = ref(new ListService())
const listStore = useListStore()
const unsplashBackgroundEnabled = computed(() => store.state.config.enabledBackgroundProviders.includes('unsplash'))
const uploadBackgroundEnabled = computed(() => store.state.config.enabledBackgroundProviders.includes('upload'))
@ -176,6 +178,7 @@ async function searchBackgrounds(page = 1) {
})
}
async function setBackground(backgroundId: string) {
// Don't set a background if we're in the process of setting one
if (backgroundService.loading) {
@ -185,7 +188,7 @@ async function setBackground(backgroundId: string) {
const list = await backgroundService.update({id: backgroundId, listId: route.params.listId})
await store.dispatch(CURRENT_LIST, {list, forceUpdate: true})
store.commit('namespaces/setListInNamespaceById', list)
store.commit('lists/setList', list)
listStore.setList(list)
success({message: t('list.background.success')})
}
@ -198,7 +201,7 @@ async function uploadBackground() {
const list = await backgroundUploadService.value.create(route.params.listId, backgroundUploadInput.value?.files[0])
await store.dispatch(CURRENT_LIST, {list, forceUpdate: true})
store.commit('namespaces/setListInNamespaceById', list)
store.commit('lists/setList', list)
listStore.setList(list)
success({message: t('list.background.success')})
}
@ -206,7 +209,7 @@ async function removeBackground() {
const list = await listService.value.removeBackground(currentList.value)
await store.dispatch(CURRENT_LIST, {list, forceUpdate: true})
store.commit('namespaces/setListInNamespaceById', list)
store.commit('lists/setList', list)
listStore.setList(list)
success({message: t('list.background.removeSuccess')})
router.back()
}

View File

@ -30,24 +30,24 @@
import {computed, ref, watchEffect} from 'vue'
import {useTitle} from '@/composables/useTitle'
import {useI18n} from 'vue-i18n'
import {useStore} from '@/store'
import {useRoute, useRouter} from 'vue-router'
import {success} from '@/message'
import TaskCollectionService from '@/services/taskCollection'
import Loading from '@/components/misc/loading.vue'
import {useListStore} from '@/stores/lists'
const {t} = useI18n({useScope: 'global'})
const store = useStore()
const listStore = useListStore()
const route = useRoute()
const router = useRouter()
const totalTasks = ref<number | null>(null)
const list = computed(() => store.getters['lists/getListById'](route.params.listId))
const list = computed(() => listStore.getListById(route.params.listId))
watchEffect(
() => {
if (!route.params.lisId) {
if (!route.params.listId) {
return
}
@ -61,7 +61,11 @@ watchEffect(
useTitle(() => t('list.delete.title', {list: list?.value?.title}))
async function deleteList() {
await store.dispatch('lists/deleteList', list.value)
if (!list.value) {
return
}
await listStore.deleteList(list.value)
success({message: t('list.delete.success')})
router.push({name: 'home'})
}

View File

@ -35,6 +35,7 @@ import type {INamespace} from '@/modelTypes/INamespace'
import {success} from '@/message'
import {useTitle} from '@/composables/useTitle'
import {useNameSpaceSearch} from '@/composables/useNamespaceSearch'
import {useListStore} from '@/stores/lists'
const {t} = useI18n({useScope: 'global'})
useTitle(() => t('list.duplicate.title'))
@ -53,6 +54,7 @@ function selectNamespace(namespace: INamespace) {
const route = useRoute()
const router = useRouter()
const store = useStore()
const listStore = useListStore()
const listDuplicateService = shallowReactive(new ListDuplicateService())
@ -66,7 +68,7 @@ async function duplicateList() {
const duplicate = await listDuplicateService.create(listDuplicate)
store.commit('namespaces/addListToNamespace', duplicate.list)
store.commit('lists/setList', duplicate.list)
listStore.setList(duplicate.list)
success({message: t('list.duplicate.success')})
router.push({name: 'list.index', params: {listId: duplicate.list.id}})
}

View File

@ -45,7 +45,7 @@
<div class="field">
<label class="label" for="listdescription">{{ $t('list.edit.description') }}</label>
<div class="control">
<editor
<Editor
:class="{ 'disabled': isLoading}"
:disabled="isLoading"
:previewIsDefault="false"
@ -82,8 +82,8 @@ import CreateEdit from '@/components/misc/create-edit.vue'
import {CURRENT_LIST} from '@/store/mutation-types'
import type {IList} from '@/modelTypes/IList'
import { useList } from '@/composables/useList'
import { useTitle } from '@/composables/useTitle'
import {useList} from '@/stores/lists'
import {useTitle} from '@/composables/useTitle'
const props = defineProps({
listId: {

View File

@ -148,6 +148,7 @@
<script lang="ts">
import {defineComponent} from 'vue'
import { useListStore } from '@/stores/lists'
export default defineComponent({
name: 'user-settings-general',
@ -246,8 +247,9 @@ watch(
{immediate: true},
)
const listStore = useListStore()
const defaultList = computed({
get: () => store.getters['lists/getListById'](settings.value.defaultListId),
get: () => listStore.getListById(settings.value.defaultListId),
set(l) {
settings.value.defaultListId = l ? l.id : DEFAULT_LIST_ID
},