@chat21/chat21-web-widget 5.1.26 → 5.1.30-rc1

package/src/app/app.component.ts

@@ -106,6 +106,11 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
   
   forceDisconnect: boolean = false;
 
+  //network status
+  isOnline: boolean = true;
+  loading: boolean = false;
+  private calloutScheduleTimeout: any = null;
+  
   // alert error message 
   isShowErrorMessage: boolean = false;
   errorMessage: string = '';
@@ -149,7 +154,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.logger.info('[APP-CONF]---------------- ngAfterViewInit: APP.COMPONENT ---------------- ')
         
         // Initialize translation map and enable buttons
-        const keys = ['MAXIMIZE', 'MINIMIZE', 'CENTER', 'BUTTON_CLOSE_TO_ICON'];
+        const keys = ['MAXIMIZE', 'MINIMIZE', 'CENTER', 'BUTTON_CLOSE_TO_ICON', 'LABEL_LOADING'];
         this.translationMap = this.translateService.translateLanguage(keys);
         this.isButtonsDisabled = false;
         
@@ -164,13 +169,13 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                     if (conversation.attributes && conversation.attributes['subtype'] === 'info') {
                         return;
                     }
-                    if (conversation.is_new && this.isInitialized) {
+                    if (conversation.is_new && that.isInitialized) {
                         that.manageTabNotification(false, 'conv-added')
                         // this.soundMessage(); 
                     }
-                    if(this.g.isOpen === false){
-                        that.lastConversation = conversation;
+                    if(this.g.isOpen === false && conversation.sender !== this.g.senderId && !isInfo(conversation)){
                         that.g.isOpenNewMessage = true;
+                        that.lastConversation = conversation;
                     }
                 } else {
                     //widget closed
@@ -218,6 +223,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                             that.lastConversation = conversation;
                             that.g.isOpenNewMessage = true;
                             that.logger.debug('[APP-COMP] lastconversationnn', that.lastConversation)
+                            that.logger.debug('[APP-COMP] lastconversationnn message' + JSON.stringify(that.lastConversation?.attributes?.commands))
                         }
                         let badgeNewConverstionNumber = that.conversationsHandlerService.countIsNew()
                         that.g.setParameter('conversationsBadge', badgeNewConverstionNumber);
@@ -316,8 +322,19 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                     this.g.setIsOpen(isOpen)
                     this.appStorageService.setItem('isOpen', isOpen)
                 }
-                
-                
+
+                if(this.g.onPageChangeVisibilityDesktop === 'last'){
+                    this.logger.debug('[APP-COMP2] ------this.g.isOpen: ', this.g.isOpen)
+                    if(this.g.isOpen){
+                        this.g.autoStart = true;
+                    }
+                }
+
+                // STEP-2: schedule callout after settings are loaded,
+                // independently from auth/sign-in.
+                this.scheduleCalloutFromSettings();
+
+
                 /**CHECK IF JWT IS IN URL PARAMETERS */
                 this.logger.debug('[APP-COMP] check if token is passed throw url: ', this.g.jwt);
                 if (this.g.jwt) {
@@ -354,10 +371,24 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.subscriptions.push(obsSettingsService);
         this.globalSettingsService.initWidgetParamiters(this.g, this.el);
 
-        // SET AUDIO
-        this.audio = new Audio();
-        this.audio.src = this.g.baseLocation + URL_SOUND_LIST_CONVERSATION;
-        this.audio.load();
+    }
+
+    private scheduleCalloutFromSettings() {
+        if (this.calloutScheduleTimeout) {
+            clearTimeout(this.calloutScheduleTimeout);
+            this.calloutScheduleTimeout = null;
+        }
+
+        const calloutTimer = Number(this.g.calloutTimer);
+        if (isNaN(calloutTimer) || calloutTimer < 0) {
+            return;
+        }
+
+        const delayMs = calloutTimer * 1000;
+        this.calloutScheduleTimeout = setTimeout(() => {
+            this.calloutScheduleTimeout = null;
+            this.showCallout();
+        }, delayMs);
     }
 
     private initAll() {
@@ -422,6 +453,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
             }
 
             const autoStart = this.g.autoStart;
+            const startHidden = this.g.startHidden;
             that.stateLoggedUser = state;
             if (state && state === AUTH_STATE_ONLINE) {
                 /** sono loggato */
@@ -448,7 +480,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                 that.triggerOnAuthStateChanged(that.stateLoggedUser);
                 that.logger.debug('[APP-COMP]  1 - IMPOSTO STATO CONNESSO UTENTE ', autoStart);
                 
-                
+                this.initAudioNotification()
 
                 new Promise(async (resolve, reject)=> {
                     that.typingService.initialize(this.g.tenant);
@@ -460,7 +492,8 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
 
                 // this.initConversationsHandler(this.g.tenant, that.g.senderId);
                 /* If singleConversation mode is active wait to showWidget: do it later in initConversationsHandler */
-                if (autoStart && !that.g.singleConversation) { 
+                const hasBotsRules = Array.isArray(this.g.botsRules) && this.g.botsRules.length > 0;
+                if ((autoStart || hasBotsRules) && !that.g.singleConversation) { 
                     that.showWidget();
                 }
 
@@ -474,26 +507,39 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                     that.listenToWidgetClick()
                 }
 
+                /** DDP IF AUTOSTART IS FALSE, SHOW WIDGET */
+                if(!autoStart){
+                    that.logger.info('[APP-COMP] AUTOSTART IS FALSE AND LOGGED SUCCESSFULLY ');
+                    this.g.setParameter('isShown', true, true);
+                }
 
 
             } else if (state && state === AUTH_STATE_OFFLINE && !this.forceDisconnect) {
                 /** non sono loggato */
                 that.logger.info('[APP-COMP] OFFLINE - NO CURRENT USER AUTENTICATE: ');
                 that.g.setParameter('isLogged', false);
-                that.hideWidget();
+                // that.hideWidget();
                 // that.g.setParameter('isShown', false, true);
                 that.triggerOnAuthStateChanged(that.stateLoggedUser);
-                if (autoStart) {
+                const shouldAutoAuthenticate = autoStart ||
+                    this.g.onPageChangeVisibilityDesktop === 'open' ||
+                    this.g.onPageChangeVisibilityMobile === 'open' ||
+                    (Array.isArray(this.g.botsRules) && this.g.botsRules.length > 0)
+                    // || this.g.hasCalloutInWidgetConfig;
+                console.log('[APP-COMP] shouldAutoAuthenticate', shouldAutoAuthenticate, startHidden)
+                if (shouldAutoAuthenticate) {
                     that.authenticate();
+                    if(startHidden){ that.hideWidget(); }
+                } else {
+                    that.logger.debug('[APP-COMP] Skip auto-auth: startup conditions not met, show launcher only');
                 }
-            }else if(state && state === AUTH_STATE_CLOSE ){
+            } else if(state && state === AUTH_STATE_CLOSE ){
                 that.logger.info('[APP-COMP] CLOSE - CHANNEL CLOSED: ', this.chatManager);
                 if(this.g.recipientId){
                     this.chatManager.removeConversationHandler(this.g.recipientId)
                     this.g.recipientId = null;
                 }
-            }
-
+            }  
 
         });
         this.subscriptions.push(subAuthStateChanged);
@@ -738,6 +784,8 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         //         divWidgetContainer.style.display = 'block';
         //     }
         // }, 500);
+
+        this.loading = false;
     }
     // ========= end:: START UI ============//
 
@@ -846,7 +894,13 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.appStorageService.setItem('attributes', JSON.stringify(attributes));
         return attributes;
     }
-
+    
+    // SET AUDIO
+    private initAudioNotification(){
+        this.audio = new Audio();
+        this.audio.src = this.g.baseLocation + URL_SOUND_LIST_CONVERSATION;
+        this.audio.load();
+    }
 
     private async initConversationsHandler(tenant: string, senderId: string) {
         this.logger.debug('[APP-COMP] initialize: ListConversationsComponent');
@@ -1170,14 +1224,32 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         return this.signOut();
     }
 
+    private canShowCalloutNow(): boolean {
+        if (this.g.isOpen !== false) {
+            return false;
+        }
+        if (this.g.isOpenNewMessage) {
+            return false;
+        }
+        if (!this.g.calloutStaus) {
+            return false;
+        }
+        if (!this.g.hasCalloutInWidgetConfig) {
+            return false;
+        }
+        return true;
+    }
+
     /** show callout */
     private showCallout() {
-        if (this.g.isOpen === false) {
-            // this.g.setParameter('calloutTimer', 1)
-            this.eyeeyeCatcherCardComponent.openEyeCatcher();
-            this.g.setParameter('displayEyeCatcherCard', 'block');
-            this.triggerOnOpenEyeCatcherEvent();
+        if (!this.canShowCalloutNow()) {
+            return;
+        }
+        if (!this.eyeeyeCatcherCardComponent) {
+            return;
         }
+        // Delegate visibility logic to the eye-catcher component.
+        this.eyeeyeCatcherCardComponent.openEyeCatcher();
     }
 
     /** open popup conversation */
@@ -1185,6 +1257,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         const senderId = this.g.senderId;
         this.logger.debug('[APP-COMP] f21_open senderId: ', senderId);
         if (senderId) {
+            this.enforceMobileFullscreenOnOpen();
             // chiudo callout
             this.g.setParameter('displayEyeCatcherCard', 'none');
             // this.g.isOpen = true; // !this.isOpen;
@@ -1605,23 +1678,47 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.f21_close();
     }
 
+
+    /** DDP reload widget */
+    async reloadWidget() { 
+        this.openCloseWidget();
+        this.logger.debug('[APP-COMP-1] AAA - hideWidget');
+        await Promise.all([
+                this.authenticate(),
+                // this.initAll()
+            ]);
+        this.logger.debug('[APP-COMP-1] CCC - showWidget');
+    }
+
+
     /**
      * LAUNCHER BUTTON:
      * onClick button open/close widget
      */
     onOpenCloseWidget($event) {
+        this.logger.debug('[APP-COMP] onOpenCloseWidget', $event, this.g.isLogged);
+        if(!this.g.isLogged){
+            this.reloadWidget();
+        } else {
+            this.openCloseWidget();
+        }
+    }
+
+    /** DDP show widget */
+    openCloseWidget() {
         this.g.setParameter('displayEyeCatcherCard', 'none');
         // const conversationActive: ConversationModel = JSON.parse(this.appStorageService.getItem('activeConversation'));
         const recipientId : string = this.appStorageService.getItem('recipientId')
         this.g.setParameter('recipientId', recipientId);
         this.logger.debug('[APP-COMP] openCloseWidget', recipientId, this.g.isOpen, this.g.startFromHome);
+
         if (this.g.isOpen === false) {
+            this.enforceMobileFullscreenOnOpen();
             if(this.forceDisconnect){
                 this.logger.log('[FORCE] onOpenCloseWidget --> reconnect', this.forceDisconnect)
                 this.messagingAuthService.createCustomToken(this.g.tiledeskToken)
                 this.forceDisconnect = false;
             }
-
             if (!recipientId) {
                 if(this.g.singleConversation){
                     this.isOpenHome = false;
@@ -1641,29 +1738,22 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                 this.isOpenHome = false;
                 this.isOpenConversation = true;
                 this.startUI()
-                // this.isOpenSelectionDepartment = false;
             }
-            // if (!conversationActive && !this.g.startFromHome) {
-            //     this.isOpenHome = false;
-            //     this.isOpenConversation = true;
-            //     this.startNwConversation();
-            // } else if (conversationActive) {
-            //     this.isOpenHome = false;
-            //     this.isOpenConversation = true;
-            // }
-            // this.g.startFromHome = true;
             this.triggerOnOpenEvent();
-            
         } else {
             this.triggerOnCloseEvent();
         }
         //change status to the widget
         this.g.setIsOpen(!this.g.isOpen);
         this.appStorageService.setItem('isOpen', this.g.isOpen);
-
+        //show loading if widget is open and user is not logged
+        if(this.g.isOpen === true && !this.g.isLogged){
+            this.loading = true;
+        }
         // this.saveBadgeNewConverstionNumber();
     }
 
+
     /**
      * MODAL SELECTION DEPARTMENT:
      * selected department
@@ -2039,6 +2129,12 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
     }
 
     onWidgetSizeChange(mode: any) {
+        if (this.g?.isMobile) {
+            this.g.fullscreenMode = true;
+            this.g.size = 'max';
+            return;
+        }
+
         const normalize = (val: any): 'min' | 'max' | 'top' => {
             const v = (typeof val === 'string') ? val.toLowerCase().trim() : '';
             return (v === 'min' || v === 'max' || v === 'top') ? (v as any) : 'min';
@@ -2084,6 +2180,13 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         }
     }
 
+    private enforceMobileFullscreenOnOpen() {
+        if (this.g?.isMobile) {
+            this.g.fullscreenMode = true;
+            this.g.size = 'max';
+        }
+    }
+
     /**
      * MODAL RATING WIDGET:
      * close modal page
@@ -2217,6 +2320,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         this.el.nativeElement.style.setProperty('--chat-header-height', this.g.hideHeaderConversation? '0px': null)
         this.el.nativeElement.style.setProperty('--font-size-bubble-message', this.g.fontSize)
         this.el.nativeElement.style.setProperty('--font-family-bubble-message', this.g.fontFamily)
+        this.el.nativeElement.style.setProperty('--chat-footer-close-button-height', this.g.closeChatInConversation? '30px': '0px')
 
     }
 
@@ -2266,6 +2370,10 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
     /** elimino tutte le sottoscrizioni */
     ngOnDestroy() {
         this.logger.debug('[APP-COMP] this.subscriptions', this.subscriptions);
+        if (this.calloutScheduleTimeout) {
+            clearTimeout(this.calloutScheduleTimeout);
+            this.calloutScheduleTimeout = null;
+        }
         const windowContext = this.g.windowContext;
         if (windowContext && windowContext['tiledesk']) {
             windowContext['tiledesk']['angularcomponent'] = null;

package/src/app/component/conversation-detail/conversation/conversation.component.html

@@ -30,12 +30,21 @@
         [isTypings]="isTypings"
         [nameUserTypingNow]="nameUserTypingNow"
         [typingLocation]="g?.typingLocation"
+        [isMobile]="g?.isMobile"
         (onBack)="onBackHomeFN()"
         (onCloseWidget)="onCloseWidgetFN()"
         (onMenuOptionClick)="onMenuOptionClick($event)"
         (onMenuOptionShow)="onMenuOption($event)">
     </chat-conversation-header>
 
+    <!-- Badge: natura dell'ultimo messaggio ricevuto dal server -->
+    <!-- <div
+      *ngIf="showLastServerSenderBadge"
+      id="chat21-last-server-sender-badge"
+      [ngClass]="lastServerSenderKind">
+      {{ lastServerSenderBadgeText }}
+    </div> -->
+
     <div id="dropZone_container" *ngIf="isHovering"
         [class.hideTextReply]="hideFooterTextReply && g?.poweredBy">
         <div class="drop">
@@ -54,6 +63,7 @@
         [idUserTypingNow]="idUserTypingNow"
         [nameUserTypingNow]="nameUserTypingNow"
         [typingLocation]="g?.typingLocation"
+        [showThinkingMessage]="showThinkingMessage"
         [fullscreenMode]="g?.fullscreenMode"
         [translationMap]="translationMapContent"
         [stylesMap]="stylesMap"
@@ -68,7 +78,6 @@
         (dragleave)="drag($event)" >
     </chat-conversation-content>
 
-    
 
     <!-- INTERNAL FRAME FOR SELF ACTION LINK BUTTONS-->
     <chat-internal-frame *ngIf="isButtonUrl"
@@ -128,6 +137,7 @@
             [isMobile]="g?.isMobile"
             [isEmojiiPickerShow]="isEmojiiPickerShow"
             [footerMessagePlaceholder]="footerMessagePlaceholder"
+            [closeChatInConversation]="g?.closeChatInConversation"
             [fileUploadAccept]="g?.fileUploadAccept"
             [dropEvent]="dropEvent"
             [poweredBy]="g?.poweredBy"
@@ -138,7 +148,8 @@
             (onAfterSendMessage)="onAfterSendMessageFN($event)"
             (onChangeTextArea)="onChangeTextArea($event)"
             (onAttachmentFileButtonClicked)="onAttachmentFileButtonClicked($event)"
-            (onNewConversationButtonClicked)="onNewConversationButtonClickedFN($event)">
+            (onNewConversationButtonClicked)="onNewConversationButtonClickedFN($event)"
+            (onCloseChatButtonClicked)="onCloseChatButtonClickedFN($event)">
         </chat-conversation-footer>
 
     </div>

package/src/app/component/conversation-detail/conversation/conversation.component.scss

@@ -137,7 +137,7 @@
 #dropZone_container{
     position: absolute;
     top: 52px;
-    bottom: calc(var(--chat-footer-logo-height) + var(--chat-footer-height));
+    bottom: calc(var(--chat-footer-logo-height) + var(--chat-footer-height) + var(--chat-footer-close-button-height));
     left: 0;
     right: 0;
     background-color: rgba(240,248,255,0.6);
@@ -153,6 +153,34 @@
     }
 }
 
+#chat21-last-server-sender-badge{
+    position: absolute;
+    top: 58px;
+    right: 12px;
+    z-index: 25;
+    padding: 6px 10px;
+    border-radius: 999px;
+    font-size: 0.95em;
+    font-weight: 600;
+    line-height: 1.1;
+    border: 1px solid rgba(0,0,0,0.08);
+    color: rgba(0,0,0,0.65);
+    background: rgba(0,0,0,0.03);
+    user-select: none;
+
+    &.bot{
+        border-color: rgba(0, 150, 136, 0.45);
+        color: rgba(0, 150, 136, 1);
+        background: rgba(0, 150, 136, 0.12);
+    }
+
+    &.human{
+        border-color: rgba(63, 81, 181, 0.45);
+        color: rgba(63, 81, 181, 1);
+        background: rgba(63, 81, 181, 0.12);
+    }
+}
+
 dialog:-internal-dialog-in-top-layer{
     border: 0px;
     border-radius: 16px;
@@ -212,7 +240,7 @@ dialog:-internal-dialog-in-top-layer{
 
 
     ::ng-deep .chat21-sheet-content{
-        bottom: calc(var(--chat-footer-logo-height) + var(--chat-footer-height) + 34px)!important;
+        bottom: calc(var(--chat-footer-logo-height) + var(--chat-footer-height) + var(--chat-footer-close-button-height) + 34px)!important;
     }
     
 }

package/src/app/component/conversation-detail/conversation/conversation.component.ts

@@ -40,6 +40,7 @@ import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance'
 import { TiledeskRequestsService } from 'src/chat21-core/providers/tiledesk/tiledesk-requests.service';
 import { ConversationContentComponent } from '../conversation-content/conversation-content.component';
 import { checkAcceptedFile } from 'src/app/utils/utils';
+import { computeConversationBadgeState } from 'src/app/utils/conversation-sender-classifier';
 // import { TranslateService } from '@ngx-translate/core';
 
 @Component({
@@ -113,6 +114,16 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
   // availableAgentsStatus = false; // indica quando è impostato lo stato degli agenti nel subscribe
   messages: Array<MessageModel> = [];
 
+  // Temporary "thinking" state after a client message is sent.
+  public showThinkingMessage: boolean = false;
+
+  // Badge "ultimo messaggio ricevuto dal server" (bot/umano)
+  public showLastServerSenderBadge: boolean = false;
+  public lastServerSenderKind: 'bot' | 'human' | null = null;
+  public lastServerSenderBadgeText: string = '';
+  // Diagnostics/internal state: kind of the latest *server* message (including system).
+  public latestServerMessageKind: 'bot' | 'human' | 'system' | 'unknown' = 'unknown';
+
 
   CLIENT_BROWSER: string = navigator.userAgent;
 
@@ -235,7 +246,8 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       'CONTINUE',
       'EMOJI_NOT_ELLOWED',
       'ATTACHMENT',
-      'EMOJI'
+      'EMOJI',
+      'CLOSE_CHAT'
     ];
 
     const keysContent = [
@@ -252,6 +264,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       'LABEL_TODAY',
       'LABEL_TOMORROW',
       'LABEL_LOADING',
+      'LABEL_THINKING',
       'LABEL_TO',
       'ARRAY_DAYS',
     ];
@@ -356,6 +369,21 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
 
   }
 
+  /**
+   * Backward-compat wrappers: keep component API stable while delegating
+   * the sender classification logic to a pure utility module.
+   */
+  private refreshLastServerSenderBadge() {
+    const state = computeConversationBadgeState(this.messages || [], this.senderId);
+    this.latestServerMessageKind = state.latestServerMessageKind;
+    this.lastServerSenderKind = state.latestNonSystemResponderKind;
+    this.showLastServerSenderBadge = state.showBadge;
+    this.lastServerSenderBadgeText = state.badgeText;
+  }
+
+  // (Implementation moved to src/app/utils/conversation-sender-classifier.ts)
+
+
   /**
    * do per scontato che this.userId esiste!!!
    */
@@ -368,6 +396,10 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
     // this.connectConversation();
     await this.initConversationHandler();
 
+    // After loading/connecting, compute "ultimo messaggio ricevuto dal server"
+    // (excluding messages sent by the client).
+    this.refreshLastServerSenderBadge();
+
     this.logger.debug('[CONV-COMP] ------ 4: initializeChatManager ------ ');
     //this.initializeChatManager();
 
@@ -470,7 +502,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       return this.isConversationArchived;
     }
 
-    //FALLBACK TO TILEDESK
+    //   //FALLBACK TO TILEDESK
     const requests_list = await this.tiledeskRequestService.getMyRequests().catch(err => {
       this.logger.error('[CONV-COMP] getConversationDetail: error getting request from Tiledesk', err);
       this.isConversationArchived=true
@@ -488,9 +520,9 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       return this.isConversationArchived
     }
 
-    this.isConversationArchived = true;
-    return null;
-  }
+      this.isConversationArchived = false;
+      return null;
+    }
 
   /**
     * this.g.recipientId:
@@ -787,8 +819,14 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       subscribtion = this.conversationHandlerService.messageAdded.pipe(takeUntil(this.unsubscribe$)).subscribe((msg: MessageModel) => {
         this.logger.debug('[CONV-COMP] ***** DETAIL messageAdded *****', msg);
         if (msg) {
+          if (msg.sender !== this.senderId) {
+            this.showThinkingMessage = false;
+          }
 
           that.newMessageAdded(msg);
+          // Update badge based on the latest message received from the server.
+          // We rely on `messages` being kept in-sync by the conversation handler.
+          that.refreshLastServerSenderBadge();
           this.checkMessagesLegntForTranscriptDownloadMenuOption();
           this.resetTimeout();
           
@@ -840,6 +878,20 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
       this.subscriptions.push(subscribe);
     }
 
+    subscribtionKey = 'conversationsAdded';
+    subscribtion = this.subscriptions.find(item => item.key === subscribtionKey);
+    if(!subscribtion){
+
+      subscribtion = this.chatManager.conversationsHandlerService.conversationChanged.pipe(takeUntil(this.unsubscribe$)).subscribe((conversation) => {
+        this.logger.debug('[CONV-COMP] ***** DATAIL conversationsChanged *****', conversation, this.conversationWith, this.isConversationArchived);
+        if(conversation && conversation.recipient === this.conversationId){
+          this.isConversationArchived = false
+        }
+      });
+      const subscribe = {key: subscribtionKey, value: subscribtion };
+      this.subscriptions.push(subscribe);
+    }
+
     subscribtionKey = 'messageWait';
     subscribtion = this.subscriptions.find(item => item.key === subscribtionKey);
     if (!subscribtion) {
@@ -1088,6 +1140,13 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
   }
   /** CALLED BY: conv-header component */
   onWidgetSizeChange(mode: any){
+    if (this.g?.isMobile) {
+      this.g.fullscreenMode = true;
+      this.g.size = 'max';
+      this.isMenuShow = false;
+      return;
+    }
+
     const normalize = (val: any): 'min' | 'max' | 'top' => {
       const v = (typeof val === 'string') ? val.toLowerCase().trim() : '';
       return (v === 'min' || v === 'max' || v === 'top') ? (v as any) : 'min';
@@ -1294,6 +1353,20 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
   }
   /** CALLED BY: conv-footer component */ 
   onAfterSendMessageFN(message: MessageModel){
+    // Manage thinking state only for messages sent by the current client.
+    // Do not force-hide here for other message types/events.
+    this.logger.debug('[CONV-COMP] onAfterSendMessageFN::::')
+    if (message && message.sender === this.senderId) {
+      this.logger.debug('[CONV-COMP] onAfterSendMessageFN:::: message', message)
+      // if (this.shouldShowThinkingForBot()) {
+      //   this.logger.debug('[CONV-COMP] shouldShowThinkingForBot::::', true)
+      //   this.startThinkingMessage();
+      // } else {
+      //   this.logger.debug('[CONV-COMP] shouldShowThinkingForBot::::', false)
+      //   this.showThinkingMessage = false;
+      // }
+      this.showThinkingMessage = true;
+    }
     this.onAfterSendMessage.emit(message)
   }
   /** CALLED BY: conv-footer component */ 
@@ -1325,6 +1398,12 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
     this.logger.debug('[CONV-COMP] floating onNewConversationButtonClicked')
     this.onNewConversationButtonClicked.emit()
   }
+
+  /** CALLED BY: conv-footer component */
+  onCloseChatButtonClickedFN(event){
+    this.logger.debug('[CONV-COMP] onCloseChatButtonClicked::::', event)
+    this.onCloseChat()
+  }
   // =========== END: event emitter function ====== //
 
 
@@ -1345,6 +1424,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
     //this.storageService.removeItem('activeConversation');
     this.isConversationArchived = false;
     this.hideTextAreaContent = false;
+    this.showThinkingMessage = false;
     this.conversationFooter.textInputTextArea='';
     this.hideFooterTextReply = false;
     this.footerMessagePlaceholder = '';