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

package/CHANGELOG.md

@@ -6,6 +6,15 @@
 ### **Copyrigth**: 
 *Tiledesk SRL*
 
+# 5.1.30-rc1
+- **bug fixed**: startHidden is not working properly
+
+# 5.1.27-rc3
+- **bug fixed**: fixed Bot/Human conversation detection by correctly classifying bot replies
+
+# 5.1.27-rc2
+- **bug fixed**: centralized fullscreen management on mobile and handled the case of the closed widget that remained fullscreen
+
 # 5.1.27-rc1
 - **added**: closeChatInConversation parameters
 - **added**: close chat button under textarea footer component

package/docs/changelog/badge_Bot_Umano.md

@@ -0,0 +1,85 @@
+# Questo branch: UX bot/umano + disaccoppiamento callout
+
+## Contesto
+
+Questo branch migliora il feedback in conversazione e rende il comportamento del callout indipendente dal sign-in del widget.
+
+## Modifiche incluse
+
+- Aggiunto un **badge Bot/Umano** nella vista conversazione.
+  - All'apertura della conversazione (e ad ogni nuovo messaggio) analizza i messaggi e determina il tipo conversazione.
+
+## Come viene identificato Bot/Umano
+
+La logica vive in `ConversationComponent` e in un modulo pure di supporto (`src/app/utils/conversation-sender-classifier.ts`).
+
+### Regole (in ordine)
+
+1) **Selezione del messaggio “server” più recente**
+- Si considerano solo i messaggi **non inviati dal client corrente** (si scartano quelli con `sender === senderId`).
+- L’“ultimo” messaggio server viene determinato in modo robusto usando `timestamp` (equivalente a ordinare per timestamp decrescente).
+
+2) **Regola speciale: handoff a operatore (Umano)**
+- Se l’ultimo messaggio server è `system` e rappresenta un handoff verso umano:
+  - `attributes.subtype === "info"`
+  - `attributes.updateconversation === true`
+  - `attributes.messagelabel.key === "MEMBER_JOINED_GROUP"`
+  - `attributes.messagelabel.parameters.member_id` **non** è `system`, **non** inizia con `bot_`, e **non** coincide con il `senderId` del client
+- allora la conversazione viene forzata a **Umano**.
+
+3) **Se l’ultimo messaggio server non è system**
+- viene classificato come **Bot** se:
+  - è presente `attributes.flowAttributes.chatbot_id` (segnale forte, anche se diverso da `sender`), oppure
+  - euristiche legacy: `sender` contiene `bot_` oppure `sender_fullname` contiene “bot”
+- altrimenti come **Umano**.
+
+4) **Se l’ultimo messaggio server è system (ma non handoff umano)**
+- si cerca il messaggio server **precedente non-system** e si applica la classificazione Bot/Umano su quello.
+
+### Risultato in UI
+- Il badge mostra **Bot** o **Umano** in base all’ultimo responder server **non-system**, con precedenza della regola handoff.
+
+- Aggiunto il feedback temporaneo **"sto pensando..."** dopo l'invio del messaggio da parte del client.
+  - Mostrato solo quando la conversazione e' classificata come **Bot**.
+  - Nascosto alla prima risposta server (nessuna durata minima).
+
+- Rimossa l'implementazione temporanea del toast "ciao" nel footer e relativo wiring.
+
+- Abilitato il percorso di avvio widget per i casi guidati da bot quando sono presenti `botsRules`.
+
+## Disaccoppiamento callout (step completati)
+
+- **Step 1**: rimossa la dipendenza da `g.senderId` nel rendering del componente callout in `app.component.html`.
+  - Prima: render solo con `g.senderId && !g.isOpenNewMessage`
+  - Dopo: render con `!g.isOpenNewMessage`
+
+- **Step 2**: scheduling del callout al caricamento delle impostazioni widget in `AppComponent`.
+  - Aggiunto `scheduleCalloutFromSettings()` basato su `g.calloutTimer`.
+  - Invocato subito dopo la disponibilita' delle settings (non legato al login).
+  - Aggiunta la pulizia del timeout in `ngOnDestroy()`.
+
+- **Step 3**: introdotte precedenze UI e rimossa la duplicazione dello scheduling callout.
+  - Aggiunta guardia `canShowCalloutNow()` in `AppComponent`:
+    - widget chiuso
+    - nessuna preview nuovo messaggio attiva
+    - stato callout abilitato
+    - callout presente nella configurazione widget
+  - Aggiornato `showCallout()` per aprire il callout solo quando le guardie passano e il componente esiste.
+  - Rimosso il timer interno (`openIfCallOutTimer`) da `EyeeyeCatcherCardComponent` per evitare doppi trigger.
+
+## Comportamento atteso dopo questo branch
+
+- Il callout puo' essere innescato da configurazione anche senza sign-in.
+- Il callout non compare quando il widget e' aperto o quando la preview nuovo messaggio e' attiva.
+- La UI della conversazione indica chiaramente se l'ultimo responder e' bot o umano.
+- "Sto pensando..." compare solo nelle conversazioni bot e ha un comportamento prevedibile.
+
+## Checklist regressioni (bot/umano)
+- **Bot con `flowAttributes.chatbot_id` diverso da `sender`** (caso reale):
+  - Atteso: classificazione **Bot** (non Human).
+- **System → bot joined** (`MEMBER_JOINED_GROUP` con `member_id` che inizia per `bot_`):
+  - Atteso: non forzare Umano (non è handoff verso operatore).
+- **System → handoff umano** (`MEMBER_JOINED_GROUP` con `member_id` umano):
+  - Atteso: forzare **Umano** anche se messaggi precedenti indicavano bot.
+- **Conversazione con soli messaggi system** (dopo aver escluso quelli del client):
+  - Atteso: nessun crash; badge Bot/Umano può essere nascosto, ma la classificazione dell’ultimo messaggio server deve restare coerente.

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chat21/chat21-web-widget",
   "author": "Tiledesk SRL",
-  "version": "5.1.27-rc1",
+  "version": "5.1.30-rc1",
   "license": "MIT",
   "homepage": "https://www.tiledesk.com",
   "repository": {

package/src/app/app.component.ts

@@ -169,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
@@ -223,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);
@@ -452,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 */
@@ -524,8 +526,10 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
                     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');
                 }
@@ -1253,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;
@@ -1708,6 +1713,7 @@ export class AppComponent implements OnInit, AfterViewInit, OnDestroy {
         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)
@@ -2174,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

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({
@@ -115,12 +116,13 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
 
   // Temporary "thinking" state after a client message is sent.
   public showThinkingMessage: boolean = false;
-  private waitingServerReply: 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;
@@ -367,129 +369,20 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
 
   }
 
-  private classifyMessageSenderKind(msg: MessageModel | null | undefined): 'bot' | 'human' | 'system' | 'unknown' {
-    if (!msg) return 'unknown';
-
-    const sender = msg.sender;
-    const senderFullname = msg.sender_fullname;
-    const senderFullnameLower = (senderFullname || '').toString().toLowerCase();
-
-    // System messages are always from "system".
-    if (sender === 'system' || senderFullnameLower === 'system') {
-      return 'system';
-    }
-
-    const chatbotId = msg?.attributes?.flowAttributes?.chatbot_id;
-    if (chatbotId && sender && String(chatbotId) === String(sender)) {
-      return 'bot';
-    }
-
-    // Fallback heuristics (used when chatbot_id is missing)
-    if (sender && String(sender).includes('bot_')) {
-      return 'bot';
-    }
-    if (senderFullnameLower.includes('bot')) {
-      return 'bot';
-    }
-
-    return 'human';
-  }
-
   /**
-   * Detects explicit handoff-to-human system messages.
-   * Example:
-   * attributes.subtype = "info"
-   * attributes.updateconversation = true
-   * attributes.messagelabel.key = "MEMBER_JOINED_GROUP"
-   * attributes.messagelabel.parameters.member_id = "<human-agent-id>"
-   */
-  private isHumanHandoffSystemMessage(msg: MessageModel | null | undefined): boolean {
-    if (!msg) return false;
-    if (msg.sender !== 'system') return false;
-
-    const attrs: any = msg.attributes || {};
-    const key = attrs?.messagelabel?.key;
-    const memberId = attrs?.messagelabel?.parameters?.member_id;
-
-    if (attrs?.subtype !== 'info') return false;
-    if (attrs?.updateconversation !== true) return false;
-    if (key !== 'MEMBER_JOINED_GROUP') return false;
-    if (!memberId || typeof memberId !== 'string') return false;
-
-    // Exclude system/bot/self joins.
-    if (memberId === 'system') return false;
-    if (memberId.startsWith('bot_')) return false;
-    if (this.senderId && memberId === this.senderId) return false;
-
-    return true;
-  }
-
-  /**
-   * Finds the last server message (sender != client) and classifies it as bot/human.
-   * If the last server message is "system", it scans backward to find the last non-system server message.
+   * Backward-compat wrappers: keep component API stable while delegating
+   * the sender classification logic to a pure utility module.
    */
   private refreshLastServerSenderBadge() {
-    const senderId = this.senderId;
-    const msgs = this.messages || [];
-
-    let found: 'bot' | 'human' | null = null;
-    let latestServerMsg: MessageModel | null = null;
-
-    // messages are kept sorted by the handler, but we still scan from the end for "latest".
-    for (let i = msgs.length - 1; i >= 0; i--) {
-      const m = msgs[i];
-      if (!m) continue;
-
-      // Skip messages sent by the current client/user.
-      if (senderId && m.sender === senderId) continue;
-
-      if (!latestServerMsg) {
-        latestServerMsg = m;
-      }
-
-      const kind = this.classifyMessageSenderKind(m);
-      if (kind === 'system') continue;
-      if (kind === 'bot' || kind === 'human') {
-        found = kind;
-        break;
-      }
-    }
-
-    // Priority rule requested: if the latest server message is a system handoff message,
-    // consider the conversation as "human".
-    if (this.isHumanHandoffSystemMessage(latestServerMsg)) {
-      found = 'human';
-    }
-
-    this.lastServerSenderKind = found;
-    this.showLastServerSenderBadge = found !== null;
-    this.lastServerSenderBadgeText = found === 'bot' ? 'Bot' : (found === 'human' ? 'Umano' : '');
+    const state = computeConversationBadgeState(this.messages || [], this.senderId);
+    this.latestServerMessageKind = state.latestServerMessageKind;
+    this.lastServerSenderKind = state.latestNonSystemResponderKind;
+    this.showLastServerSenderBadge = state.showBadge;
+    this.lastServerSenderBadgeText = state.badgeText;
   }
 
-  private startThinkingMessage() {
-    this.waitingServerReply = true;
-    this.showThinkingMessage = true;
-  }
+  // (Implementation moved to src/app/utils/conversation-sender-classifier.ts)
 
-  private stopThinkingMessageImmediately() {
-    if (!this.waitingServerReply) {
-      return;
-    }
-    this.waitingServerReply = false;
-    this.showThinkingMessage = false;
-  }
-
-  private shouldShowThinkingForBot(): boolean {
-    // Primary source: latest server-side classification already computed.
-    if (this.lastServerSenderKind === 'bot') {
-      return true;
-    }
-    // Safe fallback for bot-targeted direct conversations.
-    if (this.conversationWith && this.conversationWith.includes('bot_')) {
-      return true;
-    }
-    return false;
-  }
 
   /**
    * do per scontato che this.userId esiste!!!
@@ -506,7 +399,6 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
     // After loading/connecting, compute "ultimo messaggio ricevuto dal server"
     // (excluding messages sent by the client).
     this.refreshLastServerSenderBadge();
-    setTimeout(() => this.refreshLastServerSenderBadge(), 300);
 
     this.logger.debug('[CONV-COMP] ------ 4: initializeChatManager ------ ');
     //this.initializeChatManager();
@@ -928,7 +820,7 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
         this.logger.debug('[CONV-COMP] ***** DETAIL messageAdded *****', msg);
         if (msg) {
           if (msg.sender !== this.senderId) {
-            this.stopThinkingMessageImmediately();
+            this.showThinkingMessage = false;
           }
 
           that.newMessageAdded(msg);
@@ -1463,13 +1355,17 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
   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) {
-      if (this.shouldShowThinkingForBot()) {
-        this.startThinkingMessage();
-      } else {
-        this.showThinkingMessage = false;
-        this.waitingServerReply = false;
-      }
+      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)
   }
@@ -1529,7 +1425,6 @@ export class ConversationComponent implements OnInit, AfterViewInit, OnChanges {
     this.isConversationArchived = false;
     this.hideTextAreaContent = false;
     this.showThinkingMessage = false;
-    this.waitingServerReply = false;
     this.conversationFooter.textInputTextArea='';
     this.hideFooterTextReply = false;
     this.footerMessagePlaceholder = '';

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

@@ -16,7 +16,7 @@
         </button>
             
         <!-- ICON MENU OPTION -->
-        <button *ngIf="!isMobile" [attr.disabled]="(isButtonsDisabled)?true:null" tabindex="-1" class="c21-header-button c21-right c21-button-clean" [ngStyle]="{'display': (hideHeaderConversationOptionsMenu)?'none':'flex'}" (click)="toggleMenu()" >
+        <button [attr.disabled]="(isButtonsDisabled)?true:null" tabindex="-1" class="c21-header-button c21-right c21-button-clean" [ngStyle]="{'display': (hideHeaderConversationOptionsMenu)?'none':'flex'}" (click)="toggleMenu()" >
             <svg aria-labelledby="altIconTitle" [ngStyle]="{'fill': stylesMap?.get('foregroundColor') }" xmlns="http://www.w3.org/2000/svg"
                 width="24" height="24" viewBox="0 0 24 24">
                 <path fill="none" d="M0 0h24v24H0V0z" />

package/src/app/component/last-message/last-message.component.ts

@@ -12,7 +12,7 @@ import { MIN_WIDTH_IMAGES } from 'src/app/utils/constants';
 import { ConversationModel } from 'src/chat21-core/models/conversation';
 import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
-import { commandToMessage, conversationToMessage, isEmojii, isFrame, isImage, isSameSender } from 'src/chat21-core/utils/utils-message';
+import { commandToMessage, conversationToMessage, isEmojii, isFrame, isImage, isMine, isSameSender, isSender } from 'src/chat21-core/utils/utils-message';
 
 
 @Component({
@@ -59,6 +59,9 @@ export class LastMessageComponent implements OnInit, AfterViewInit, OnDestroy {
   ngOnChanges(changes: SimpleChanges) {
     this.logger.debug('[LASTMESSAGE] onChanges', changes)
     if(this.conversation){
+      
+      /** if the message is sent by the logged user, do not add it to the messages array */
+      if(isSender(this.conversation.sender, this.g.senderId)) return;
 
       if(this.conversation.attributes && this.conversation.attributes.commands){
         this.addCommandMessage(this.conversation)

package/src/app/providers/global-settings.service.ts

@@ -324,13 +324,13 @@ export class GlobalSettingsService {
         }
         /** set button colors */
         this.setButtonColors();
+        // Detect mobile before loading persisted values so storage policies can depend on it.
         this.globals.setParameter('isMobile', detectIfIsMobile(this.globals.windowContext));
 
         this.setVariableFromStorage(this.globals);
         this.setVariablesFromSettings(this.globals);
         this.setVariablesFromAttributeHtml(this.globals, this.el);
         this.setVariablesFromUrlParameters(this.globals);
-        this.enforceMobileFullscreenPolicy(this.globals);
         
         this.setDepartmentFromExternal();
         /** set color with gradient from theme's colors */
@@ -342,18 +342,6 @@ export class GlobalSettingsService {
         this.obsSettingsService.next(true);
     }
 
-    /**
-     * On mobile devices we always open the widget fullscreen.
-     * This also neutralizes any legacy `size` stored from previous sessions.
-     */
-    private enforceMobileFullscreenPolicy(globals: Globals) {
-        if (!globals || globals.isMobile !== true) {
-            return;
-        }
-        globals.fullscreenMode = true;
-        globals.size = 'max';
-    }
-
     private setButtonColors() {
         this.logger.debug('[GLOBAL-SET] ***** END SET PARAMETERS *****', this.globals);
         const bubbleSentBackground = this.globals?.bubbleSentBackground;
@@ -1912,7 +1900,7 @@ export class GlobalSettingsService {
         this.logger.debug('[GLOBAL-SET] setVariableFromStorage :::::::: SET VARIABLE ---------->', Object.keys(globals));
         for (const key of Object.keys(globals)) {
             if (globals.isMobile === true && key === 'size') {
-                // Backward compatibility: ignore legacy stored size on mobile.
+                // On mobile we always open fullscreen, so legacy/persisted widget size must be ignored.
                 try {
                     this.appStorageService.removeItem('size');
                 } catch (e) {

package/src/app/utils/conversation-sender-classifier.ts

@@ -0,0 +1,116 @@
+import { MessageModel } from 'src/chat21-core/models/message';
+
+export type SenderKind = 'bot' | 'human' | 'system' | 'unknown';
+export type Confidence = 'high' | 'medium' | 'low';
+
+export interface SenderClassification {
+  kind: SenderKind;
+  confidence: Confidence;
+  reasons: string[];
+}
+
+export interface ConversationBadgeState {
+  /** Kind of the latest server message (including system). */
+  latestServerMessageKind: SenderKind;
+  /** Kind of the latest non-system server responder, used for Bot/Umano badge. */
+  latestNonSystemResponderKind: 'bot' | 'human' | null;
+  showBadge: boolean;
+  badgeText: string;
+}
+
+export function classifyMessageSender(msg: MessageModel | null | undefined): SenderClassification {
+  if (!msg) return { kind: 'unknown', confidence: 'low', reasons: ['msg=null'] };
+
+  const sender = (msg as any).sender;
+  const senderFullname = (msg as any).sender_fullname;
+  const senderFullnameLower = (senderFullname || '').toString().toLowerCase();
+
+  if (sender === 'system' || senderFullnameLower === 'system') {
+    return { kind: 'system', confidence: 'high', reasons: ['sender=system'] };
+  }
+
+  const chatbotId = (msg as any)?.attributes?.flowAttributes?.chatbot_id;
+  if (chatbotId) {
+    return { kind: 'bot', confidence: 'high', reasons: ['flowAttributes.chatbot_id'] };
+  }
+
+  if (sender && String(sender).includes('bot_')) {
+    return { kind: 'bot', confidence: 'medium', reasons: ['sender includes bot_'] };
+  }
+
+  if (senderFullnameLower.includes('bot')) {
+    return { kind: 'bot', confidence: 'low', reasons: ['sender_fullname includes bot'] };
+  }
+
+  return { kind: 'human', confidence: 'low', reasons: ['fallback human'] };
+}
+
+export function isHumanHandoffSystemMessage(msg: MessageModel | null | undefined, clientSenderId?: string): boolean {
+  if (!msg) return false;
+  if ((msg as any).sender !== 'system') return false;
+
+  const attrs: any = (msg as any).attributes || {};
+  const key = attrs?.messagelabel?.key;
+  const memberId = attrs?.messagelabel?.parameters?.member_id;
+
+  if (attrs?.subtype !== 'info') return false;
+  if (attrs?.updateconversation !== true) return false;
+  if (key !== 'MEMBER_JOINED_GROUP') return false;
+  if (!memberId || typeof memberId !== 'string') return false;
+
+  // Exclude system/bot/self joins.
+  if (memberId === 'system') return false;
+  if (memberId.startsWith('bot_')) return false;
+  if (clientSenderId && memberId === clientSenderId) return false;
+
+  return true;
+}
+
+function getTimestamp(msg: MessageModel | null | undefined): number {
+  const ts = msg && (msg as any).timestamp;
+  const n = ts != null ? Number(ts) : 0;
+  return Number.isFinite(n) ? n : 0;
+}
+
+function maxByTimestamp<T extends MessageModel>(items: T[]): T {
+  return items.reduce((acc, cur) => (getTimestamp(cur) >= getTimestamp(acc) ? cur : acc), items[0]);
+}
+
+function isSystemMessage(msg: MessageModel | null | undefined): boolean {
+  if (!msg) return false;
+  const sender = (msg as any).sender;
+  const senderFullname = (msg as any).sender_fullname;
+  const senderFullnameLower = (senderFullname || '').toString().toLowerCase();
+  return sender === 'system' || senderFullnameLower === 'system';
+}
+
+export function computeConversationBadgeState(messages: MessageModel[], clientSenderId?: string): ConversationBadgeState {
+  const msgs = messages || [];
+  const serverMsgs = msgs.filter(m => !!m && (!clientSenderId || (m as any).sender !== clientSenderId));
+
+  const latestServerMsg = serverMsgs.length > 0 ? maxByTimestamp(serverMsgs) : null;
+  const latestServerMessageKind = classifyMessageSender(latestServerMsg).kind;
+
+  let latestNonSystemResponderKind: 'bot' | 'human' | null = null;
+
+  // Priority rule: if the latest server message is a system handoff to a human, force "human".
+  if (isHumanHandoffSystemMessage(latestServerMsg, clientSenderId)) {
+    latestNonSystemResponderKind = 'human';
+  } else {
+    // Otherwise, use the latest non-system server message (by timestamp) as responder.
+    const nonSystemServerMsgs = serverMsgs.filter(m => !isSystemMessage(m));
+    const latestNonSystem = nonSystemServerMsgs.length > 0 ? maxByTimestamp(nonSystemServerMsgs) : null;
+    const kind = classifyMessageSender(latestNonSystem).kind;
+    if (kind === 'bot' || kind === 'human') {
+      latestNonSystemResponderKind = kind;
+    }
+  }
+
+  return {
+    latestServerMessageKind,
+    latestNonSystemResponderKind,
+    showBadge: latestNonSystemResponderKind !== null,
+    badgeText: latestNonSystemResponderKind === 'bot' ? 'Bot' : (latestNonSystemResponderKind === 'human' ? 'Umano' : ''),
+  };
+}
+

package/src/app/utils/globals.ts

@@ -616,13 +616,35 @@ export class Globals {
     }
 
 
-    //customize position for 'tiledeskdiv' for mobile
+    // On mobile, force fullscreen while open regardless of stored `size`.
     if(isOpen && this.isMobile && divTiledeskWidget){
+      divTiledeskWidget.classList.remove('min-size')
+      divTiledeskWidget.classList.remove('max-size')
+      divTiledeskWidget.classList.remove('top-size')
+      divTiledeskWidget.classList.add('fullscreen')
+      divTiledeskWidget.style.left = '0px'
       divTiledeskWidget.style.right = '0px'
+      divTiledeskWidget.style.top = '0px'
       divTiledeskWidget.style.bottom = '0px'
+      divTiledeskWidget.style.width = '100%'
+      divTiledeskWidget.style.height = '100%'
+      divTiledeskWidget.style.maxWidth = 'none'
+      divTiledeskWidget.style.maxHeight = 'none'
     } else if(!isOpen && this.isMobile && divTiledeskWidget){
-      divTiledeskWidget.style.bottom = this.marginY
-      this.align === 'left'?  divTiledeskWidget.style.left = this.mobileMarginX : divTiledeskWidget.style.right = this.mobileMarginX; 
+      divTiledeskWidget.classList.remove('fullscreen')
+      divTiledeskWidget.style.removeProperty('top')
+      divTiledeskWidget.style.removeProperty('width')
+      divTiledeskWidget.style.removeProperty('height')
+      divTiledeskWidget.style.removeProperty('max-width')
+      divTiledeskWidget.style.removeProperty('max-height')
+      divTiledeskWidget.style.bottom = this.mobileMarginY
+      if (this.align === 'left') {
+        divTiledeskWidget.style.left = this.mobileMarginX
+        divTiledeskWidget.style.removeProperty('right')
+      } else {
+        divTiledeskWidget.style.right = this.mobileMarginX
+        divTiledeskWidget.style.removeProperty('left')
+      }
     }
 
     //customize position for 'tiledeskdiv' for desktop if fullscreenMode is not active