hot fix chat text format(for course ratings demo)

open-learning-exchange · Sep 8, 2023 · 8b8a027 · 8b8a027
1 parent 3b48767
commit 8b8a027
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 4 deletions.
diff --git a/src/app/courses/add-courses/courses-add.component.html b/src/app/courses/add-courses/courses-add.component.html
@@ -42,7 +42,9 @@
     </div>
     <div class="steps-container">
       <planet-courses-step [(steps)]="steps" (addStepEvent)="addStep()"></planet-courses-step>
-      {{rating}}
+      <!-- {{sanitizeText(rating)}} -->
+      <!-- {{rating}} -->
+      <br><span [innerHTML]="rating"></span>
     </div>
     <div class="actions-container">
       <button type="submit" (click)="onSubmit()" [planetSubmit]="courseForm.valid" mat-raised-button color="primary" i18n>Submit</button>

diff --git a/src/app/courses/add-courses/courses-add.component.ts b/src/app/courses/add-courses/courses-add.component.ts
@@ -292,7 +292,7 @@ export class CoursesAddComponent implements OnInit, OnDestroy {
 
       this.chatService.getPrompt(content).subscribe(
       (rating) => {
-        this.rating = rating?.chat;
+        this.rating = this.sanitizeText(rating?.chat);
       }
     );
     } else {
@@ -301,4 +301,18 @@ export class CoursesAddComponent implements OnInit, OnDestroy {
     }
   }
 
+  sanitizeText(text: any): any {
+    // Replace newline characters with <br> tags
+    const textWithLineBreaks = text.replace(/\n/g, '<br>');
+
+    // Replace code block markers with <code> tags
+    const codeBlockStart = /```/g;
+    const codeBlockEnd = /```/g;
+    const textWithCodeBlocks = textWithLineBreaks
+      .replace(codeBlockStart, '<code>')
+      .replace(codeBlockEnd, '</code>');
+
+    return textWithCodeBlocks;
+  }
+
 }
diff --git a/src/app/courses/add-courses/courses-step.component.html b/src/app/courses/add-courses/courses-step.component.html
@@ -30,7 +30,9 @@
       </mat-chip-list>
     </ng-container>
     <button mat-raised-button color="basic" (click)="rateStep()" i18n>Rate course step</button>
-    <br><div>{{rating}}</div>
+    <!-- <br><div>{{sanitizeText(rating)}}</div> -->
+    <!-- <br><div>{{rating}}</div> -->
+    <br><div [innerHTML]="rating"></div>
   </div>
   <div planetStepListActions>
     <a mat-raised-button color="primary" (click)="addExam()" i18n>{{activeStep?.exam ? 'Update' : 'Add' }} Test</a>

diff --git a/src/app/courses/add-courses/courses-step.component.ts b/src/app/courses/add-courses/courses-step.component.ts
@@ -109,12 +109,26 @@ export class CoursesStepComponent implements OnDestroy {
 
     this.chatService.getPrompt(content).subscribe(
       (completion: any) => {
-        this.rating = completion?.chat;
+        this.rating = this.sanitizeText(completion?.chat);
       },
       (error: any) => {
         console.log(error);
       }
     );
   }
 
+  sanitizeText(text: any): any {
+    // Replace newline characters with <br> tags
+    const textWithLineBreaks = text.replace(/\n/g, '<br>');
+
+    // Replace code block markers with <code> tags
+    const codeBlockStart = /```/g;
+    const codeBlockEnd = /```/g;
+    const textWithCodeBlocks = textWithLineBreaks
+      .replace(codeBlockStart, '<code>')
+      .replace(codeBlockEnd, '</code>');
+
+    return textWithCodeBlocks;
+  }
+
 }