feat(annotaions): refactor after code review

Author: sebastianmusial

apps/spa/src/app/components/chat/chat-annotation/chat-annotation.component.spec.ts

@@ -8,10 +8,7 @@ describe('ChatAnnotationComponent', () => {
 
   beforeEach(async () => {
     await TestBed.configureTestingModule({
-      imports: [
-        ChatAnnotationComponent, 
-        HttpClientTestingModule,
-      ],
+      imports: [ChatAnnotationComponent, HttpClientTestingModule],
     }).compileComponents();
 
     fixture = TestBed.createComponent(ChatAnnotationComponent);

apps/spa/src/app/components/chat/chat-annotations/chat-annotations.component.html

@@ -1,7 +1,10 @@
 @if (message && message.type === 'text' && message.text.annotations.length) {
   <div class="title">Annotations:</div>
   <div class="content">
-    @for (annotation of message.text.annotations; track annotation.text) {
+    @for (
+      annotation of message.text.annotations;
+      track annotation.text + $index
+    ) {
       <ai-chat-annotation [annotation]="annotation" [index]="$index + 1">
         [{{ $index + 1 }}]
       </ai-chat-annotation>

apps/spa/src/app/components/chat/chat-message/chat-message.component.html

@@ -4,7 +4,7 @@
   }
 
   <div class="chat-message">
-    @for (msg of message.content; track msg) {
+    @for (msg of message.content; track $index) {
       @if (msg.type === 'text') {
         <span markdown [data]="msg | annotation"></span>
       }

apps/spa/src/app/components/chat/chat-messages/chat-messages.component.html

@@ -1,5 +1,5 @@
 <div class="messages">
-  @for (message of initialMessages.concat(messages); track message) {
+  @for (message of initialMessages.concat(messages); track message.id) {
     <span #item>
       <ai-chat-message [message]="message"></ai-chat-message>
     </span>

apps/spa/src/app/components/chat/chat-tips/chat-tips.component.html

@@ -1,5 +1,5 @@
-@for (tip of tips; track tip) {
-<ai-chat-tip (click)="tipSelected$.emit(tip)">
-  {{ tip }}
-</ai-chat-tip>
+@for (tip of tips; track $index) {
+  <ai-chat-tip (click)="tipSelected$.emit(tip)">
+    {{ tip }}
+  </ai-chat-tip>
 }

apps/spa/src/app/components/controls/files/files.service.ts

@@ -6,9 +6,12 @@ export class FilesService {
   files$ = new BehaviorSubject<File[]>([]);
 
   add(files: FileList) {
+    const convertedFiles = Object.keys(files).map(
+      key => files[key as unknown as number],
+    );
     const updatedFiles = [
       ...this.files$.value,
-      ...Object.keys(files).map(key => files[key as unknown as number]),
+      ...convertedFiles,
     ];
 
     this.files$.next(updatedFiles);

apps/spa/src/app/components/controls/message-content/message-content.service.ts

@@ -10,10 +10,10 @@ export class MessageContentService {
   constructor(private readonly chatClientService: ChatClientService) {}
 
   add(files: FileList) {
-    const updatedFiles = [
-      ...this.data$.value,
-      ...Object.keys(files).map(key => files[key as unknown as number]),
-    ];
+    const convertedFiles = Object.keys(files).map(
+      key => files[key as unknown as number],
+    );
+    const updatedFiles = [...this.data$.value, ...convertedFiles];
     this.data$.next(updatedFiles);
   }