From 8ef309243db4e37d306167455987572006858cad Mon Sep 17 00:00:00 2001
From: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
Date: Thu, 17 Nov 2022 15:31:21 +0000
Subject: [PATCH] feat: improve loadTask logic (#2715)

Co-authored-by: Dominik Pschenitschni <mail@celement.de>
Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/2715
Co-authored-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
Co-committed-by: Dominik Pschenitschni <dpschen@noreply.kolaente.de>
---
 src/views/tasks/TaskDetailView.vue | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/src/views/tasks/TaskDetailView.vue b/src/views/tasks/TaskDetailView.vue
index 0c2c4d8f7..96902742d 100644
--- a/src/views/tasks/TaskDetailView.vue
+++ b/src/views/tasks/TaskDetailView.vue
@@ -445,7 +445,7 @@
 </template>
 
 <script lang="ts" setup>
-import {ref, reactive, toRef, shallowReactive, computed, watch, watchEffect, nextTick, type PropType} from 'vue'
+import {ref, reactive, toRef, shallowReactive, computed, watch, nextTick, type PropType} from 'vue'
 import {useRouter, type RouteLocation} from 'vue-router'
 import {useI18n} from 'vue-i18n'
 import {unrefElement} from '@vueuse/core'
@@ -590,13 +590,14 @@ async function scrollToHeading() {
 
 const taskService = shallowReactive(new TaskService())
 
-async function loadTask(taskId: ITask['id']) {
-	if (taskId === undefined) {
+// load task
+watch(taskId, async (id) => {
+	if (id === undefined) {
 		return
 	}
 
 	try {
-		Object.assign(task, await taskService.get({id: taskId}))
+		Object.assign(task, await taskService.get({id}))
 		attachmentStore.set(task.attachments)
 		taskColor.value = task.hexColor
 		setActiveFields()
@@ -605,9 +606,7 @@ async function loadTask(taskId: ITask['id']) {
 		scrollToHeading()
 		visible.value = true
 	}
-}
-
-watchEffect(() => taskId.value !== undefined && loadTask(taskId.value))
+}, {immediate: true})
 
 type FieldType =
 	| 'assignees'