Merge pull request #63 from boldare/feat/initial-message

feat(chatbot): allowed to declare the initial messages

Author: sebastianmusial

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

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

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

@@ -29,6 +29,7 @@ import { ChatTipsComponent } from '../chat-tips/chat-tips.component';
   ],
 })
 export class ChatMessagesComponent implements AfterViewInit, OnChanges {
+  @Input() initialMessages: ChatMessage[] = [];
   @Input() messages: ChatMessage[] = [];
   @Input() isTyping = false;
   @Input() tips: string[] = [];

apps/spa/src/app/modules/+chat/containers/chat-iframe/chat-iframe.component.html

@@ -13,6 +13,7 @@
     <ai-configuration-form class="chat__content" />
   } @else {
     <ai-chat-messages
+      [initialMessages]="initialMessages"
       [messages]="messages()"
       [isTyping]="isTyping()"
       [tips]="tips"

apps/spa/src/app/modules/+chat/containers/chat-iframe/chat-iframe.component.ts

@@ -1,5 +1,6 @@
 import { Component, OnInit } from '@angular/core';
 import { toSignal } from '@angular/core/rxjs-interop';
+import { take } from 'rxjs';
 import { environment } from '../../../../../environments/environment';
 import { ChatService } from '../../shared/chat.service';
 import { ThreadService } from '../../shared/thread.service';
@@ -8,8 +9,8 @@ import { ChatHeaderComponent } from '../../../../components/chat/chat-header/cha
 import { ChatMessagesComponent } from '../../../../components/chat/chat-messages/chat-messages.component';
 import { ChatFooterComponent } from '../../../../components/chat/chat-footer/chat-footer.component';
 import { ConfigurationFormComponent } from '../../../+configuration/components/configuration-form/configuration-form.component';
-import { take } from 'rxjs';
 import { SpinnerComponent } from '../../../../components/spinner/spinner.component';
+import { ChatMessage } from '../../shared/chat.model';
 
 @Component({
   selector: 'ai-chat-iframe',
@@ -37,6 +38,7 @@ export class ChatIframeComponent implements OnInit {
   isAttachmentEnabled = environment.isAttachmentEnabled;
   isRefreshEnabled = environment.isRefreshEnabled;
   isConfigEnabled = environment.isConfigEnabled;
+  initialMessages: ChatMessage[] = [];
   tips = [
     'Hello! 👋 How can you help me?',
     'What’s the weather like in Warsaw?',