fix: Comments are adding to FE state before api calls

packages/nc-gui/components/smartsheet/expanded-form/Comments.vue

@@ -97,8 +97,7 @@ function scrollComments() {
 }
 
 const saveComment = async () => {
-  await _saveComment()
-  scrollComments()
+  await _saveComment(() => setTimeout(() => scrollComments(), 100))
 }
 
 watch(commentsWrapperEl, () => {

packages/nc-gui/composables/useExpandedFormStore.ts

@@ -131,7 +131,7 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
     }
   }
 
-  const saveComment = async () => {
+  const saveComment = async (scrollToCreateComment?: any) => {
     try {
       if (!row.value || !comment.value) return
 
@@ -142,10 +142,11 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
       isSaving.value = true
 
       const createdDate = new Date().toISOString()
+      const createdIndex = commentsAndLogs.value.length
 
       commentsAndLogs.value.push({
         created_at: createdDate,
-        description: `The following comment has been created:${comment.value}`,
+        description: `The following comment has been created: ${comment.value}`,
         email: user?.value?.email,
         user: user?.value?.email,
         id: '',
@@ -153,19 +154,23 @@ const [useProvideExpandedFormStore, useExpandedFormStore] = useInjectionState((m
         row_id: rowId,
         updated_at: createdDate,
         op_type: 'COMMENT',
+        new: true,
       })
 
-      await api.utils.commentRow({
+      const commentValue = comment.value
+      comment.value = ''
+
+      if (scrollToCreateComment) scrollToCreateComment()
+
+      const createdComment = await api.utils.commentRow({
         fk_model_id: meta.value?.id as string,
         row_id: rowId,
-        description: `The following comment has been created: ${comment.value}`,
+        description: `The following comment has been created: ${commentValue}`,
       })
 
-      comment.value = ''
+      commentsAndLogs.value[createdIndex] = createdComment
 
       reloadTrigger?.trigger()
-
-      await loadCommentsAndLogs()
     } catch (e: any) {
       message.error(e.message)
     } finally {