From 62bcd7ec4860e5000d9aa23bf72fa40757c1aeb3 Mon Sep 17 00:00:00 2001
From: Geoffrey Kwan <geoffreykwan@gmail.com>
Date: Fri, 24 Feb 2023 10:43:32 -0500
Subject: [PATCH] fix(Embedded): Auto comment does not show up immediately
 (#1060)

---
 .../components/component-student.component.ts |  8 -------
 .../embedded-student.component.ts             | 19 ++++++++++++++++-
 .../component-annotations.component.ts        | 21 +++++++++++++++----
 3 files changed, 35 insertions(+), 13 deletions(-)

diff --git a/src/assets/wise5/components/component-student.component.ts b/src/assets/wise5/components/component-student.component.ts
index f8e7a265af4..11f536a6738 100644
--- a/src/assets/wise5/components/component-student.component.ts
+++ b/src/assets/wise5/components/component-student.component.ts
@@ -727,14 +727,6 @@ export abstract class ComponentStudent {
     );
   }
 
-  updateLatestScoreAnnotation(annotation: any): void {
-    this.latestAnnotations.score = annotation;
-  }
-
-  updateLatestCommentAnnotation(annotation: any): void {
-    this.latestAnnotations.comment = annotation;
-  }
-
   registerNotebookItemChosenListener(): void {
     this.subscriptions.add(
       this.NotebookService.notebookItemChosen$.subscribe(({ requester, notebookItem }) => {
diff --git a/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts b/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts
index 730b1b64ee7..46885783116 100644
--- a/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts
+++ b/src/assets/wise5/components/embedded/embedded-student/embedded-student.component.ts
@@ -1,5 +1,5 @@
 import * as html2canvas from 'html2canvas';
-import { Component } from '@angular/core';
+import { ChangeDetectorRef, Component } from '@angular/core';
 import { AnnotationService } from '../../../services/annotationService';
 import { ConfigService } from '../../../services/configService';
 import { NodeService } from '../../../services/nodeService';
@@ -70,6 +70,7 @@ export class EmbeddedStudent extends ComponentStudent {
 
   constructor(
     protected AnnotationService: AnnotationService,
+    private changeDetectorRef: ChangeDetectorRef,
     protected ComponentService: ComponentService,
     protected ConfigService: ConfigService,
     protected dialog: MatDialog,
@@ -622,4 +623,20 @@ export class EmbeddedStudent extends ComponentStudent {
       this.sendMessageToApplication(message);
     }
   }
+
+  updateLatestScoreAnnotation(annotation: any): void {
+    this.latestAnnotations = {
+      comment: this.latestAnnotations.comment,
+      score: annotation
+    };
+    this.changeDetectorRef.detectChanges();
+  }
+
+  updateLatestCommentAnnotation(annotation: any): void {
+    this.latestAnnotations = {
+      comment: annotation,
+      score: this.latestAnnotations.score
+    };
+    this.changeDetectorRef.detectChanges();
+  }
 }
diff --git a/src/assets/wise5/directives/componentAnnotations/component-annotations.component.ts b/src/assets/wise5/directives/componentAnnotations/component-annotations.component.ts
index 1e4a70eaaed..b0bafe63c78 100644
--- a/src/assets/wise5/directives/componentAnnotations/component-annotations.component.ts
+++ b/src/assets/wise5/directives/componentAnnotations/component-annotations.component.ts
@@ -123,8 +123,8 @@ export class ComponentAnnotationsComponent {
   getLatestAnnotation() {
     let latest = null;
     if (this.annotations.comment || this.annotations.score) {
-      let commentSaveTime = this.annotations.comment ? this.annotations.comment.serverSaveTime : 0;
-      let scoreSaveTime = this.annotations.score ? this.annotations.score.serverSaveTime : 0;
+      const commentSaveTime = this.getSaveTime(this.annotations.comment);
+      const scoreSaveTime = this.getSaveTime(this.annotations.score);
       if (commentSaveTime >= scoreSaveTime) {
         latest = this.annotations.comment;
       } else if (scoreSaveTime > commentSaveTime) {
@@ -134,10 +134,23 @@ export class ComponentAnnotationsComponent {
     return latest;
   }
 
+  getSaveTime(annotation: any): number {
+    let saveTime = null;
+    if (annotation != null) {
+      if (annotation.serverSaveTime != null) {
+        saveTime = annotation.serverSaveTime;
+      }
+      if (annotation.clientSaveTime != null) {
+        saveTime = annotation.clientSaveTime;
+      }
+    }
+    return saveTime;
+  }
+
   getLatestAnnotationTime() {
     const latest = this.getLatestAnnotation();
     if (latest) {
-      return this.configService.convertToClientTimestamp(latest.serverSaveTime);
+      return this.configService.convertToClientTimestamp(this.getSaveTime(latest));
     }
     return null;
   }
@@ -163,7 +176,7 @@ export class ComponentAnnotationsComponent {
     );
     let saveTime = null;
     if (latestState) {
-      saveTime = this.configService.convertToClientTimestamp(latestState.serverSaveTime);
+      saveTime = this.configService.convertToClientTimestamp(this.getSaveTime(latestState));
     }
     return saveTime;
   }