@chat21/chat21-ionic 3.4.32-rc1 → 3.4.32-rc4

package/CHANGELOG.md

@@ -8,6 +8,16 @@
 ### **Copyrigth**: 
 *Tiledesk SRL*
 
+# 3.4.32-rc4
+- **changed**: unassigned conversations page — `onImageLoaded` and `onConversationLoaded` are now invoked for each conversation in the list (avatar URLs, last message formatting, project name).
+- **bug-fixed**: navbar project dropdown — descenders (letters like g, p, q) were being clipped; added `line-height: 1.4` and vertical padding to prevent clipping.
+
+# 3.4.32-rc3
+- **bug-fixed**: unassigned conversations list was reset on each WebSocket subscription; conversations from other projects were lost when subscribing to multiple online projects. Added `skipClear` parameter to `subscriptionToWsConversations` so the list is cleared only once when subscribing to all online projects.
+- **changed**: unassigned conversations empty state — centered the "no conversations" label both vertically and horizontally within the full viewport height.
+
+# 3.4.32-rc2
+
 # 3.4.32-rc1
 - **added**: ability to change availability status for each project the logged-in user belongs to.
 - **changed**: unserved-request.page refactor html and ts refactor

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "@chat21/chat21-ionic",
     "author": "Tiledesk SRL",
-    "version": "3.4.32-rc1",
+    "version": "3.4.32-rc4",
     "license": "MIT License",
     "homepage": "https://tiledesk.com/",
     "repository": {

package/src/app/components/navbar/navbar.component.scss

@@ -94,12 +94,18 @@ ion-navbar{
     overflow: hidden;
     text-overflow: ellipsis;
     font-family: var(--header-font-family);
-    
+    line-height: 1.4;
+
     .material-icons{
         font-size: 20px;
     }
 }
 
+button.btn.project-dropdown {
+    padding-top: 4px;
+    padding-bottom: 4px;
+}
+
 li{
     position: relative;
     display: block

package/src/app/components/project-item/project-item.component.ts

@@ -16,7 +16,6 @@ import { ConvertRequestToConversation } from 'src/chat21-core/utils/convertReque
 import { compareValues, getUserStatusFromProjectUser } from 'src/chat21-core/utils/utils';
 import { ProjectService } from 'src/app/services/projects/project.service';
 import { ProjectUser } from 'src/chat21-core/models/project_user';
-import { Project } from 'src/chat21-core/models/projects';
 
 @Component({
   selector: 'app-project-item',

package/src/app/pages/unassigned-conversations/unassigned-conversations.page.html

@@ -40,11 +40,13 @@
         </ion-list-conversations>
       </ng-container>
       <ng-template #noConvs>
-        <ion-item id="no-convs" class="ion-text-center" lines="none">
-          <ion-label class="ion-text-wrap" color="medium">
-            {{ 'LABEL_MSG_PUSH_START_CHAT' | translate }}
-          </ion-label>
-        </ion-item>
+        <div class="no-convs-container">
+          <ion-item id="no-convs" class="ion-text-center" lines="none">
+            <ion-label class="ion-text-wrap" color="medium">
+              {{ 'LABEL_MSG_PUSH_START_CHAT' | translate }}
+            </ion-label>
+          </ion-item>
+        </div>
       </ng-template>
     </ion-list>
   </div>

package/src/app/pages/unassigned-conversations/unassigned-conversations.page.scss

@@ -233,3 +233,18 @@ ion-content::part(scroll) {
   min-height: calc(100vh - var(--header-height, 56px));
   height: 100%;
 }
+
+// -------------------------------------------------
+// Empty state - label centrata nell'altezza disponibile
+// -------------------------------------------------
+.no-convs-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: calc(100vh - var(--header-height, 56px));
+  width: 100%;
+
+  ion-item {
+    --background: transparent;
+  }
+}

package/src/app/pages/unassigned-conversations/unassigned-conversations.page.ts

@@ -1,4 +1,4 @@
-import { Component, Input, OnInit, SecurityContext } from '@angular/core';
+import { Component, Input, OnChanges, OnInit, SecurityContext, SimpleChanges } from '@angular/core';
 import { AlertController, ModalController } from '@ionic/angular';
 import { Router } from '@angular/router';
 import { NavProxyService } from 'src/app/services/nav-proxy.service';
@@ -11,6 +11,8 @@ import { EventsService } from 'src/app/services/events-service';
 import { ConversationModel } from 'src/chat21-core/models/conversation';
 import { TiledeskAuthService } from 'src/chat21-core/providers/tiledesk/tiledesk-auth.service';
 import { TiledeskService } from 'src/app/services/tiledesk/tiledesk.service';
+import { getProjectIdSelectedConversation, isGroup } from 'src/chat21-core/utils/utils';
+import { ImageRepoService } from 'src/chat21-core/providers/abstract/image-repo.service';
 
 
 @Component({
@@ -18,7 +20,7 @@ import { TiledeskService } from 'src/app/services/tiledesk/tiledesk.service';
   templateUrl: './unassigned-conversations.page.html',
   styleUrls: ['./unassigned-conversations.page.scss'],
 })
-export class UnassignedConversationsPage implements OnInit {
+export class UnassignedConversationsPage implements OnInit, OnChanges {
 
   @Input() iframe_URL: any;
   @Input() callerBtn: string;
@@ -35,6 +37,7 @@ export class UnassignedConversationsPage implements OnInit {
   // @Input() unassigned_convs_url: any;
 
   iframe_url_sanitized: any;
+  private loggedUserUid: string;
   private logger: LoggerService = LoggerInstance.getInstance();
   // has_loaded: boolean;
   ion_content: any;
@@ -52,8 +55,13 @@ export class UnassignedConversationsPage implements OnInit {
     private translateService: CustomTranslateService,
     private events: EventsService,
     private tiledeskAuthService: TiledeskAuthService,
-    private tiledeskService: TiledeskService
-  ) { }
+    private tiledeskService: TiledeskService,
+    public imageRepoService: ImageRepoService
+  ) {
+    if (this.tiledeskAuthService.getCurrentUser()) {
+      this.loggedUserUid = this.tiledeskAuthService.getCurrentUser().uid;
+    }
+  }
 
   ngOnInit() {
     const keys = [
@@ -63,6 +71,7 @@ export class UnassignedConversationsPage implements OnInit {
       'LABEL_MSG_PUSH_START_CHAT'
     ];
     this.translationMap = this.translateService.translateLanguage(keys);
+
     this.unassignedConversationsList = this.unassignedConversations ?? [];
     if (!this.stylesMap) {
       this.stylesMap = new Map([['themeColor', '#165CEE']]);
@@ -71,16 +80,33 @@ export class UnassignedConversationsPage implements OnInit {
       this.translationMapConversation = this.translateService.translateLanguage(['CLOSED', 'Resolve']);
     }
     this.logger.log('[UNASSIGNED-CONVS-PAGE] unassignedConversationsList', this.unassignedConversationsList);
+    this.processConversationsForDisplay();
     // this.buildIFRAME();
     this.listenToPostMsg();
     this.hideHotjarFeedbackBtn();
     this.events.subscribe('style', (data)=>this.loadStyle(data))
   }
 
+  ngOnChanges(changes: SimpleChanges) {
+    if (changes['unassignedConversations'] && changes['unassignedConversations'].currentValue) {
+      this.unassignedConversationsList = this.unassignedConversations ?? [];
+      this.processConversationsForDisplay();
+    }
+  }
+
   ngOnDestroy(){
     this.logger.log('[UNASSIGNED-CONVS-PAGE] - onDestroy called', this.iframe_URL);
   }
 
+  /** Chiama onImageLoaded e onConversationLoaded per ogni conversazione in lista */
+  private processConversationsForDisplay() {
+    if (!this.unassignedConversationsList?.length) return;
+    this.unassignedConversationsList.forEach((conv) => {
+      this.onImageLoaded(conv);
+      this.onConversationLoaded(conv);
+    });
+  }
+
   hideHotjarFeedbackBtn() {
     const hotjarFeedbackBtn = <HTMLElement>document.querySelector("#_hj_feedback_container > div > button")
     if (hotjarFeedbackBtn) {
@@ -165,8 +191,7 @@ export class UnassignedConversationsPage implements OnInit {
         }, {
           text: 'Ok',
           handler: () => {
-            let user = this.tiledeskAuthService.getCurrentUser();
-            this.tiledeskService.addParticipant(request.uid, user.uid, request.attributes.projectId).subscribe((res: any) => {
+            this.tiledeskService.addParticipant(request.uid, this.loggedUserUid, request.attributes.projectId).subscribe((res: any) => {
               this.logger.log('[APP-COMP] addParticipant - RES ', res);
               this.onClose(request);
             }, (error) => {
@@ -280,12 +305,87 @@ export class UnassignedConversationsPage implements OnInit {
     this.presentAlertConfirmJoinRequest(conversation)
   }
 
-  onImageLoaded(conversation: ConversationModel) {
-    this.logger.log('[UNASSIGNED-CONVS-PAGE] onImageLoaded', conversation);
+  onImageLoaded(conversation: any) {
+    // this.logger.log('[CONVS-LIST-PAGE] onImageLoaded', conversation)
+    let conversation_with_fullname = conversation.sender_fullname
+    let conversation_with = conversation.sender
+    if (conversation.sender === this.loggedUserUid) {
+      conversation_with = conversation.recipient
+      conversation_with_fullname = conversation.recipient_fullname
+    } else if (isGroup(conversation)) {
+      // conversation_with_fullname = conv.sender_fullname;
+      // conv.last_message_text = conv.last_message_text;
+      conversation_with = conversation.recipient
+      conversation_with_fullname = conversation.recipient_fullname
+    }
+    if (!conversation_with.startsWith('support-group')) {
+      conversation.image = this.imageRepoService.getImagePhotoUrl(conversation_with)
+    }
   }
 
   onConversationLoaded(conversation: ConversationModel) {
-    this.logger.log('[UNASSIGNED-CONVS-PAGE] onConversationLoaded', conversation);
+    this.logger.log('[CONVS-LIST-PAGE] onConversationLoaded ', conversation)
+    // this.logger.log('[CONVS-LIST-PAGE] onConversationLoaded is new? ', conversation.is_new)
+    // if (conversation.is_new === false) {
+    //   this.ionContentConvList.scrollToTop(0);
+    // }
+
+    const keys = ['YOU', 'SENT_AN_IMAGE', 'SENT_AN_ATTACHMENT']
+    const translationMap = this.translateService.translateLanguage(keys)
+    // Fixes the bug: if a snippet of code is pasted and sent it is not displayed correctly in the convesations list
+
+    var regex = /<br\s*[\/]?>/gi
+    if (conversation ) { //&& conversation.last_message_text
+      conversation.last_message_text = conversation.last_message_text.replace(regex, '',)
+
+      //FIX-BUG: 'YOU: YOU: YOU: text' on last-message-text in conversation-list
+      if (conversation.sender === this.loggedUserUid && !conversation.last_message_text.includes(': ')) {
+        // this.logger.log('[CONVS-LIST-PAGE] onConversationLoaded', conversation)
+
+        if (conversation.type !== 'image' && conversation.type !== 'file') {
+          conversation.last_message_text = translationMap.get('YOU') + ': ' + conversation.last_message_text
+        } else if (conversation.type === 'image') {
+          // this.logger.log('[CONVS-LIST-PAGE] HAS SENT AN IMAGE');
+          // this.logger.log("[CONVS-LIST-PAGE] translationMap.get('YOU')")
+          const SENT_AN_IMAGE = (conversation['last_message_text'] = translationMap.get('SENT_AN_IMAGE'))
+
+          conversation.last_message_text = translationMap.get('YOU') + ': ' + SENT_AN_IMAGE
+        } else if (conversation.type === 'file') {
+          // this.logger.log('[CONVS-LIST-PAGE] HAS SENT FILE')
+          const SENT_AN_ATTACHMENT = (conversation['last_message_text'] = translationMap.get('SENT_AN_ATTACHMENT'))
+          conversation.last_message_text = translationMap.get('YOU') + ': ' + SENT_AN_ATTACHMENT
+        }
+      } else {
+        if (conversation.type === 'image') {
+          // this.logger.log('[CONVS-LIST-PAGE] HAS SENT AN IMAGE');
+          // this.logger.log("[CONVS-LIST-PAGE] translationMap.get('YOU')")
+          const SENT_AN_IMAGE = (conversation['last_message_text'] = translationMap.get('SENT_AN_IMAGE'))
+
+          conversation.last_message_text = SENT_AN_IMAGE
+        } else if (conversation.type === 'file') {
+          // this.logger.log('[CONVS-LIST-PAGE] HAS SENT FILE')
+          const SENT_AN_ATTACHMENT = (conversation['last_message_text'] = translationMap.get('SENT_AN_ATTACHMENT'))
+          conversation.last_message_text = SENT_AN_ATTACHMENT
+        }
+      }
+    }
+    
+    if(conversation.attributes && conversation.attributes['projectId']){
+      let project = localStorage.getItem(conversation.attributes['projectId'])
+      if(project){
+        project = JSON.parse(project)
+        conversation.attributes.project_name = project['name']
+      }
+    }else if(conversation.attributes){
+      const projectId = getProjectIdSelectedConversation(conversation.uid)
+      let project = localStorage.getItem(projectId)
+      if(project){
+        project = JSON.parse(project)
+        conversation.attributes.projectId = project['_id']
+        conversation.attributes.project_name = project['name']
+      }
+    }
+
   }
 
   async onClose(conversation?: ConversationModel) {

package/src/app/services/websocket/websocket.service.ts

@@ -94,16 +94,20 @@ export class WebsocketService {
    * Sottoscrive alle conversations di un singolo progetto.
    * Mantenuto per retrocompatibilità. Preferire subscriptionToWsConversationsForOnlineProjects
    * per sottoscrivere ai progetti online con status Available.
+   * @param project_id ID del progetto
+   * @param skipClear Se true, non svuota wsRequestsList (usato quando si sottoscrivono più progetti in sequenza)
    */
-  subscriptionToWsConversations(project_id) {
+  subscriptionToWsConversations(project_id, skipClear = false) {
     // console.log("[WS-SERV] - CALLED SUBSC TO WS CONVS - PROJECT ID ", project_id);
     var self = this;
-    this.wsRequestsList = [];
+    if (!skipClear) {
+      this.wsRequestsList = [];
+    }
 
-    this.webSocketJs.ref('/' + project_id + '/requests', 'getCurrentProjectAndSubscribeTo_WsRequests',
+    this.webSocketJs.ref('/' + project_id + '/requests', 'getCurrentProjectAndSubscribeTo_WsRequests_' + project_id,
 
       function (data) {
-        // console.log("[WS-SERV] - CONVS - CREATE DATA ", data);
+        // console.log("[WS-SERV] - CONVS - CREATE DATA for project ", project_id, data);
         if (data) {
           // ------------------------------------------------
           // @ Agents - pass in data agents get from snapshot
@@ -326,7 +330,7 @@ export class WebsocketService {
       this.subscribedConversationProjectIds
     );
     this.subscribedConversationProjectIds.forEach((projectId) =>
-      this.subscriptionToWsConversations(projectId)
+      this.subscriptionToWsConversations(projectId, true)
     );
     return this.subscribedConversationProjectIds;
   }