From cd304b9e4e643f8b4d7c384d2bfd6280d70fd020 Mon Sep 17 00:00:00 2001
From: kolaente <k@knt.li>
Date: Fri, 24 Jan 2025 13:10:38 +0100
Subject: [PATCH] feat(tasks): fetch comments with the task

---
 frontend/src/components/tasks/partials/Comments.vue | 7 +++++++
 frontend/src/modelTypes/ITask.ts                    | 2 ++
 frontend/src/models/task.ts                         | 6 +++++-
 frontend/src/views/tasks/TaskDetailView.vue         | 3 ++-
 4 files changed, 16 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/tasks/partials/Comments.vue b/frontend/src/components/tasks/partials/Comments.vue
index abb82fc47..ee5a0ae0b 100644
--- a/frontend/src/components/tasks/partials/Comments.vue
+++ b/frontend/src/components/tasks/partials/Comments.vue
@@ -231,6 +231,7 @@ import { useCopyToClipboard } from '@/composables/useCopyToClipboard'
 const props = withDefaults(defineProps<{
 	taskId: number,
 	canWrite?: boolean
+	initialComments?: ITaskComment[]
 }>(), {
 	canWrite: true,
 })
@@ -302,6 +303,12 @@ async function loadComments(taskId: ITask['id']) {
 
 	commentEdit.taskId = taskId
 	commentToDelete.taskId = taskId
+	
+	if(typeof props.initialComments !== 'undefined' && currentPage.value === 1) {
+		comments.value = props.initialComments
+		return
+	}
+
 	comments.value = await taskCommentService.getAll({taskId}, {}, currentPage.value)
 }
 
diff --git a/frontend/src/modelTypes/ITask.ts b/frontend/src/modelTypes/ITask.ts
index 6230f80b3..8479557bc 100644
--- a/frontend/src/modelTypes/ITask.ts
+++ b/frontend/src/modelTypes/ITask.ts
@@ -15,6 +15,7 @@ import type {IRepeatMode} from '@/types/IRepeatMode'
 import type {PartialWithId} from '@/types/PartialWithId'
 import type {ITaskReminder} from '@/modelTypes/ITaskReminder'
 import type {IReactionPerEntity} from '@/modelTypes/IReaction'
+import type {ITaskComment} from '@/modelTypes/ITaskComment.ts'
 
 export interface ITask extends IAbstract {
 	id: number
@@ -47,6 +48,7 @@ export interface ITask extends IAbstract {
 	position: number
 	
 	reactions: IReactionPerEntity
+	comments: ITaskComment[]
 
 	createdBy: IUser
 	created: Date
diff --git a/frontend/src/models/task.ts b/frontend/src/models/task.ts
index b8b0d3af4..701efe2a2 100644
--- a/frontend/src/models/task.ts
+++ b/frontend/src/models/task.ts
@@ -13,6 +13,7 @@ import type {IRelationKind} from '@/types/IRelationKind'
 import {TASK_REPEAT_MODES, type IRepeatMode} from '@/types/IRepeatMode'
 
 import {parseDateOrNull} from '@/helpers/parseDateOrNull'
+import {secondsToPeriod} from '@/helpers/time/period'
 
 import AbstractModel from './abstractModel'
 import LabelModel from './label'
@@ -21,7 +22,7 @@ import AttachmentModel from './attachment'
 import SubscriptionModel from './subscription'
 import type {ITaskReminder} from '@/modelTypes/ITaskReminder'
 import TaskReminderModel from '@/models/taskReminder'
-import {secondsToPeriod} from '@/helpers/time/period'
+import TaskCommentModel from '@/models/taskComment.ts'
 
 export function	getHexColor(hexColor: string): string | undefined {
 	if (hexColor === '' || hexColor === '#') {
@@ -87,6 +88,7 @@ export default class TaskModel extends AbstractModel<ITask> implements ITask {
 	position = 0
 	
 	reactions = {}
+	comments = []
 
 	createdBy: IUser = UserModel
 	created: Date = null
@@ -149,6 +151,8 @@ export default class TaskModel extends AbstractModel<ITask> implements ITask {
 		this.updated = new Date(this.updated)
 
 		this.projectId = Number(this.projectId)
+		
+		this.comments = this.comments.map(c => new TaskCommentModel(c))
 
 		// We can't convert emojis to camel case, hence we do this manually
 		this.reactions = {}
diff --git a/frontend/src/views/tasks/TaskDetailView.vue b/frontend/src/views/tasks/TaskDetailView.vue
index fabade699..199dda2ee 100644
--- a/frontend/src/views/tasks/TaskDetailView.vue
+++ b/frontend/src/views/tasks/TaskDetailView.vue
@@ -394,6 +394,7 @@
 					<Comments
 						:can-write="canWrite"
 						:task-id="taskId"
+						:initial-comments="task.comments"
 					/>
 				</div>
 				
@@ -735,7 +736,7 @@ watch(
 		}
 
 		try {
-			const loaded = await taskService.get({id}, {expand: 'reactions'})
+			const loaded = await taskService.get({id}, {expand: ['reactions', 'comments']})
 			Object.assign(task.value, loaded)
 			attachmentStore.set(task.value.attachments)
 			taskColor.value = task.value.hexColor