|
|
@@ -12,6 +12,7 @@ import {
|
|
|
ViewChild,
|
|
|
ElementRef,
|
|
|
AfterViewChecked,
|
|
|
+ OnInit,
|
|
|
} from '@angular/core';
|
|
|
import { CommonModule } from '@angular/common';
|
|
|
import { FormsModule } from '@angular/forms';
|
|
|
@@ -32,27 +33,48 @@ export interface ChatMessage {
|
|
|
templateUrl: './chatbot.component.html',
|
|
|
styleUrls: ['./chatbot.component.scss'],
|
|
|
})
|
|
|
-export class ChatbotComponent implements AfterViewChecked {
|
|
|
+export class ChatbotComponent implements OnInit, AfterViewChecked {
|
|
|
+ private static readonly STORAGE_KEY = 'palm_ai_chat_history';
|
|
|
+
|
|
|
@ViewChild('messageList') messageListRef!: ElementRef<HTMLDivElement>;
|
|
|
|
|
|
- messages = signal<ChatMessage[]>([
|
|
|
- {
|
|
|
- role: 'bot',
|
|
|
- text: 'RAG pipeline ready. Ask me about palm oil operational data.',
|
|
|
- timestamp: new Date(),
|
|
|
- },
|
|
|
- ]);
|
|
|
+ messages = signal<ChatMessage[]>(this.loadMessages());
|
|
|
|
|
|
inputText = '';
|
|
|
loading = signal<boolean>(false);
|
|
|
|
|
|
private shouldScrollToBottom = false;
|
|
|
|
|
|
+ ngOnInit(): void {
|
|
|
+ this.shouldScrollToBottom = true;
|
|
|
+ }
|
|
|
+
|
|
|
constructor(
|
|
|
public chatSocket: ChatSocketService,
|
|
|
public surveillance: SurveillanceService,
|
|
|
) {}
|
|
|
|
|
|
+ private loadMessages(): ChatMessage[] {
|
|
|
+ try {
|
|
|
+ const raw = localStorage.getItem(ChatbotComponent.STORAGE_KEY);
|
|
|
+ if (raw) {
|
|
|
+ const parsed: ChatMessage[] = JSON.parse(raw);
|
|
|
+ return parsed.map(m => ({ ...m, timestamp: new Date(m.timestamp) }));
|
|
|
+ }
|
|
|
+ } catch {}
|
|
|
+ return [{
|
|
|
+ role: 'bot',
|
|
|
+ text: 'RAG pipeline ready. Ask me about palm oil operational data.',
|
|
|
+ timestamp: new Date(),
|
|
|
+ }];
|
|
|
+ }
|
|
|
+
|
|
|
+ private saveMessages(msgs: ChatMessage[]): void {
|
|
|
+ try {
|
|
|
+ localStorage.setItem(ChatbotComponent.STORAGE_KEY, JSON.stringify(msgs));
|
|
|
+ } catch {}
|
|
|
+ }
|
|
|
+
|
|
|
ngAfterViewChecked(): void {
|
|
|
if (this.shouldScrollToBottom) {
|
|
|
this.scrollToBottom();
|
|
|
@@ -103,18 +125,22 @@ export class ChatbotComponent implements AfterViewChecked {
|
|
|
}
|
|
|
|
|
|
onClearChat(): void {
|
|
|
- this.messages.set([
|
|
|
- {
|
|
|
- role: 'bot',
|
|
|
- text: 'Chat cleared. RAG pipeline ready.',
|
|
|
- timestamp: new Date(),
|
|
|
- },
|
|
|
- ]);
|
|
|
+ const reset: ChatMessage[] = [{
|
|
|
+ role: 'bot',
|
|
|
+ text: 'Chat cleared. RAG pipeline ready.',
|
|
|
+ timestamp: new Date(),
|
|
|
+ }];
|
|
|
+ this.messages.set(reset);
|
|
|
+ this.saveMessages(reset);
|
|
|
this.chatSocket.clearBackendSession();
|
|
|
}
|
|
|
|
|
|
private pushMessage(msg: ChatMessage): void {
|
|
|
- this.messages.update(msgs => [...msgs, msg]);
|
|
|
+ this.messages.update(msgs => {
|
|
|
+ const updated = [...msgs, msg];
|
|
|
+ this.saveMessages(updated);
|
|
|
+ return updated;
|
|
|
+ });
|
|
|
this.shouldScrollToBottom = true;
|
|
|
}
|
|
|
|