fix(chat): fix chart retary and request

src/app/elements/chat/chat.component.spec.ts

@@ -0,0 +1,212 @@
+import { BehaviorSubject, Subject } from 'rxjs';
+import { ElementChatComponent } from './chat.component';
+
+describe('ElementChatComponent', () => {
+  let component: ElementChatComponent;
+  let viewService: {
+    currentView$: BehaviorSubject<any>;
+  };
+  let settingService: {
+    globalSetting: any;
+    globalSetting$: BehaviorSubject<any>;
+  };
+  let drawerStateService: {
+    sendComponentMessage: jasmine.Spy;
+  };
+  let iframeCommunicationService: {
+    message$: Subject<any>;
+  };
+  let chatWindow: {
+    postMessage: jasmine.Spy;
+  };
+  let terminalWindow: {
+    postMessage: jasmine.Spy;
+  };
+
+  const dispatchChatMessage = (event: Partial<MessageEvent>) => {
+    (component as any).onChatWindowMessage(event as MessageEvent);
+  };
+
+  const readyMessage = (overrides: Partial<MessageEvent> = {}) => ({
+    source: chatWindow as unknown as Window,
+    origin: window.location.origin,
+    data: { name: 'CHAT_IFRAME_READY' },
+    ...overrides
+  });
+
+  beforeEach(() => {
+    viewService = {
+      currentView$: new BehaviorSubject<any>(null)
+    };
+    settingService = {
+      globalSetting: {
+        CHAT_AI_ENABLED: true,
+        CHAT_AI_METHOD: 'api'
+      },
+      globalSetting$: new BehaviorSubject<any>({
+        CHAT_AI_ENABLED: true,
+        CHAT_AI_METHOD: 'api'
+      })
+    };
+    drawerStateService = {
+      sendComponentMessage: jasmine.createSpy('sendComponentMessage')
+    };
+    iframeCommunicationService = {
+      message$: new Subject<any>()
+    };
+    chatWindow = {
+      postMessage: jasmine.createSpy('chatWindow.postMessage')
+    };
+    terminalWindow = {
+      postMessage: jasmine.createSpy('terminalWindow.postMessage')
+    };
+
+    component = new ElementChatComponent(
+      viewService as any,
+      settingService as any,
+      drawerStateService as any,
+      iframeCommunicationService as any
+    );
+    component.iframeRef = {
+      nativeElement: {
+        contentWindow: chatWindow
+      }
+    } as any;
+
+    component.ngOnInit();
+    viewService.currentView$.next({
+      id: 'view-1',
+      name: 'Terminal 1',
+      iframeElement: terminalWindow,
+      terminalContentData: {
+        content: 'ls -la',
+        command: 'ls -la'
+      }
+    });
+  });
+
+  afterEach(() => {
+    component.ngOnDestroy();
+  });
+
+  it('does not post open before the iframe is ready', () => {
+    component.showChatAI();
+
+    expect(component.chatAIShown).toBeTrue();
+    expect(chatWindow.postMessage).not.toHaveBeenCalled();
+  });
+
+  it('replays the current open state exactly once after a valid ready message', () => {
+    component.showChatAI();
+
+    dispatchChatMessage(readyMessage());
+    dispatchChatMessage(readyMessage());
+
+    expect(component.chatIframeReady).toBeTrue();
+    expect(chatWindow.postMessage).toHaveBeenCalledTimes(2);
+    expect(chatWindow.postMessage.calls.argsFor(0)).toEqual([
+      {
+        name: 'current_terminal_content',
+        data: {
+          viewId: 'view-1',
+          viewName: 'Terminal 1',
+          content: 'ls -la',
+          command: 'ls -la'
+        }
+      },
+      window.location.origin
+    ]);
+    expect(chatWindow.postMessage.calls.argsFor(1)).toEqual([
+      {
+        name: 'CHAT_PANEL_COMMAND',
+        data: { action: 'open' }
+      },
+      window.location.origin
+    ]);
+  });
+
+  it('replays only the final close state when the panel was opened then closed before ready', () => {
+    component.showChatAI();
+    (component as any).closeChatAI();
+
+    dispatchChatMessage(readyMessage());
+
+    expect(chatWindow.postMessage).toHaveBeenCalledTimes(1);
+    expect(chatWindow.postMessage).toHaveBeenCalledWith(
+      {
+        name: 'CHAT_PANEL_COMMAND',
+        data: { action: 'close' }
+      },
+      window.location.origin
+    );
+  });
+
+  it('ignores ready messages from the wrong source or origin', () => {
+    component.showChatAI();
+
+    dispatchChatMessage(
+      readyMessage({
+        source: {} as Window
+      })
+    );
+    dispatchChatMessage(
+      readyMessage({
+        origin: 'https://example.invalid'
+      })
+    );
+
+    expect(component.chatIframeReady).toBeFalse();
+    expect(chatWindow.postMessage).not.toHaveBeenCalled();
+  });
+
+  it('posts open immediately once the iframe is already ready', () => {
+    dispatchChatMessage(readyMessage());
+    chatWindow.postMessage.calls.reset();
+
+    component.showChatAI();
+
+    expect(chatWindow.postMessage.calls.argsFor(0)).toEqual([
+      {
+        name: 'current_terminal_content',
+        data: {
+          viewId: 'view-1',
+          viewName: 'Terminal 1',
+          content: 'ls -la',
+          command: 'ls -la'
+        }
+      },
+      window.location.origin
+    ]);
+    expect(chatWindow.postMessage.calls.argsFor(1)).toEqual([
+      {
+        name: 'CHAT_PANEL_COMMAND',
+        data: { action: 'open' }
+      },
+      window.location.origin
+    ]);
+  });
+
+  it('resets iframe readiness when chat ai is disabled and enabled again', () => {
+    dispatchChatMessage(readyMessage());
+    chatWindow.postMessage.calls.reset();
+
+    settingService.globalSetting = {
+      CHAT_AI_ENABLED: false,
+      CHAT_AI_METHOD: 'api'
+    };
+    settingService.globalSetting$.next(settingService.globalSetting);
+
+    expect(component.chatIframeReady).toBeFalse();
+    expect(component.iframeURL).toBe('');
+
+    settingService.globalSetting = {
+      CHAT_AI_ENABLED: true,
+      CHAT_AI_METHOD: 'api'
+    };
+    settingService.globalSetting$.next(settingService.globalSetting);
+
+    component.showChatAI();
+
+    expect(chatWindow.postMessage).not.toHaveBeenCalled();
+  });
+});

src/app/elements/chat/chat.component.ts

@@ -34,6 +34,7 @@ export class ElementChatComponent implements OnInit, OnDestroy {
   chatAIShown = false;
   chatPanelExpanded = false;
   isDragging = false;
+  chatIframeReady = false;
 
   private readonly subscriptions = new Subscription();
   private readonly dragThreshold = 3;
@@ -105,11 +106,15 @@ export class ElementChatComponent implements OnInit, OnDestroy {
     this.subscriptions.add(
       this._settingSvc.globalSetting$.subscribe(setting => {
         if (!setting.CHAT_AI_ENABLED) {
+          this.chatIframeReady = false;
+          this.iframeURL = '';
           this.closeChatAI(false);
           return;
         }
 
         if (setting.CHAT_AI_METHOD === 'embed') {
+          this.chatIframeReady = false;
+          this.iframeURL = '';
           this.closeChatAI(false);
           this.insertEmbedScript();
         } else if (setting.CHAT_AI_METHOD === 'api') {
@@ -139,16 +144,10 @@ export class ElementChatComponent implements OnInit, OnDestroy {
   }
 
   showChatAI(): void {
-    const chatWindow = this.iframeRef?.nativeElement.contentWindow;
-    if (!chatWindow) {
-      return;
-    }
-
     this.currentView?.iframeElement?.postMessage({ name: 'CLOSE' }, '*');
-    this.postCurrentTerminalContextToChatAI();
-    this.postChatCommand('open');
     this.chatPanelExpanded = false;
     this.chatAIShown = true;
+    this.syncChatPanelStateToIframe();
   }
 
   handleShowDrawer(): void {
@@ -292,7 +291,12 @@ export class ElementChatComponent implements OnInit, OnDestroy {
   }
 
   private listenChatAI(): void {
-    this.iframeURL = withUIBase('#/chat/chat-ai?from=luna');
+    const iframeURL = withUIBase('#/chat/chat-ai?from=luna');
+    if (this.iframeURL !== iframeURL) {
+      this.chatIframeReady = false;
+      this.iframeURL = iframeURL;
+    }
+
     if (!this.chatMessageListenerRegistered) {
       window.addEventListener('message', this.onChatWindowMessage);
       this.chatMessageListenerRegistered = true;
@@ -320,6 +324,16 @@ export class ElementChatComponent implements OnInit, OnDestroy {
       return;
     }
 
+    if (message.name === 'CHAT_IFRAME_READY') {
+      if (this.chatIframeReady) {
+        return;
+      }
+
+      this.chatIframeReady = true;
+      this.syncChatPanelStateToIframe();
+      return;
+    }
+
     if (message.name === 'CHAT_PANEL_STATE') {
       this.chatAIShown = Boolean(message.data?.open);
       this.chatPanelExpanded = message.data?.mode === 'expanded';
@@ -335,11 +349,12 @@ export class ElementChatComponent implements OnInit, OnDestroy {
   };
 
   private closeChatAI(notifyChat = true): void {
-    if (notifyChat) {
-      this.postChatCommand('close');
-    }
     this.chatAIShown = false;
     this.chatPanelExpanded = false;
+
+    if (notifyChat) {
+      this.syncChatPanelStateToIframe();
+    }
   }
 
   private postChatCommand(action: 'open' | 'close'): void {
@@ -363,6 +378,20 @@ export class ElementChatComponent implements OnInit, OnDestroy {
     }
   }
 
+  private syncChatPanelStateToIframe(): void {
+    if (!this.chatIframeReady) {
+      return;
+    }
+
+    if (this.chatAIShown) {
+      this.postCurrentTerminalContextToChatAI();
+      this.postChatCommand('open');
+      return;
+    }
+
+    this.postChatCommand('close');
+  }
+
   private clampLauncherPosition(position: LauncherPosition): LauncherPosition {
     const rect = this.launcherRef?.nativeElement.getBoundingClientRect();
     const width = rect?.width ?? 40;