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

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,14 +11,18 @@ 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';
+import { Project } from 'src/chat21-core/models/projects';
+import { ProjectService } from 'src/app/services/projects/project.service';
+import { PROJECTS_STORAGE_KEY } from 'src/chat21-core/utils/constants';
 
 @Component({
   selector: 'app-unassigned-conversations',
   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 +39,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 +57,15 @@ export class UnassignedConversationsPage implements OnInit {
     private translateService: CustomTranslateService,
     private events: EventsService,
     private tiledeskAuthService: TiledeskAuthService,
-    private tiledeskService: TiledeskService
-  ) { }
+    private tiledeskService: TiledeskService,
+    private projectService: ProjectService,
+    public imageRepoService: ImageRepoService,
+    public appStorageService: AppStorageService,
+  ) {
+    if (this.tiledeskAuthService.getCurrentUser()) {
+      this.loggedUserUid = this.tiledeskAuthService.getCurrentUser().uid;
+    }
+  }
 
   ngOnInit() {
     const keys = [
@@ -63,6 +75,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 +84,100 @@ export class UnassignedConversationsPage implements OnInit {
       this.translationMapConversation = this.translateService.translateLanguage(['CLOSED', 'Resolve']);
     }
     this.logger.log('[UNASSIGNED-CONVS-PAGE] unassignedConversationsList', this.unassignedConversationsList);
+    this.processConversationsForDisplay();
+    this.loadAndStoreProjects();
     // 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);
+    });
+  }
+
+  /**
+   * Recupera tutti i progetti con getProjects e li salva in AppStorage.
+   * Se la chiave esiste già nello storage, salta la chiamata remota e usa i dati in cache.
+   * Al termine richiama processConversationsForDisplay per aggiornare i project_name.
+   */
+  private loadAndStoreProjects() {
+    const stored = this.appStorageService.getItem(PROJECTS_STORAGE_KEY);
+    if (stored) {
+      this.processConversationsForDisplay();
+      return;
+    }
+    const token = this.tiledeskAuthService.getTiledeskToken();
+    if (!token) return;
+    this.projectService.getProjects().subscribe(
+      (projects: Project[]) => {
+        if (!projects?.length) return;
+        let projectsMap: Record<string, Project> = {};
+        const stored = this.appStorageService.getItem(PROJECTS_STORAGE_KEY);
+        if (stored) {
+          try {
+            projectsMap = JSON.parse(stored) || {};
+          } catch (e) {
+            this.logger.warn('[UNASSIGNED-CONVS-PAGE] loadAndStoreProjects - failed to parse stored projects', e);
+          }
+        }
+        let hasChanges = false;
+        projects.forEach((project) => {
+          const projectId = project.id_project?._id || project.id_project?.id || project._id;
+          if (!projectId) return;
+          if (!projectsMap[projectId]) {
+            projectsMap[projectId] = project.id_project || project;
+            hasChanges = true;
+          }
+        });
+        if (hasChanges) {
+          this.appStorageService.setItem(PROJECTS_STORAGE_KEY, JSON.stringify(projectsMap));
+          this.logger.log('[UNASSIGNED-CONVS-PAGE] loadAndStoreProjects - saved', Object.keys(projectsMap).length, 'projects');
+        }
+        this.processConversationsForDisplay();
+      },
+      (err) => {
+        this.logger.error('[UNASSIGNED-CONVS-PAGE] loadAndStoreProjects - error', err);
+        this.processConversationsForDisplay();
+      }
+    );
+  }
+
+  /** Recupera il progetto dalla chiave di storage (all_projects); se non trovato restituisce null */
+  private getProjectFromStorage(conversation: ConversationModel): Project | null {
+    let projectId: string | undefined;
+    if (conversation.attributes?.['projectId']) {
+      projectId = conversation.attributes['projectId'];
+    } else if (conversation.attributes) {
+      projectId = getProjectIdSelectedConversation(conversation.uid);
+    }
+    if (!projectId) return null;
+    const stored = this.appStorageService.getItem(PROJECTS_STORAGE_KEY);
+    if (!stored) return null;
+    try {
+      const projectsMap: Record<string, Project> = JSON.parse(stored);
+      return projectsMap[projectId] || null;
+    } catch {
+      return null;
+    }
+  }
+
   hideHotjarFeedbackBtn() {
     const hotjarFeedbackBtn = <HTMLElement>document.querySelector("#_hj_feedback_container > div > button")
     if (hotjarFeedbackBtn) {
@@ -165,8 +262,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 +376,77 @@ 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
+        }
+      }
+    }
+    
+    const project = this.getProjectFromStorage(conversation);
+    if (project) {
+      if (!conversation.attributes) conversation.attributes = {};
+      conversation.attributes.projectId = project._id;
+      conversation.attributes.project_name = project.name;
+    }
   }
 
   async onClose(conversation?: ConversationModel) {

package/src/app/pipe/filter.pipe.spec.ts

@@ -0,0 +1,8 @@
+import { FilterPipe } from './filter.pipe';
+
+describe('FilterPipe', () => {
+  it('create an instance', () => {
+    const pipe = new FilterPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

package/src/app/pipe/filter.pipe.ts

@@ -0,0 +1,15 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'filter'
+})
+export class FilterPipe implements PipeTransform {
+
+  transform(items: any[], filter: Object): any {
+    if (!items || !filter) {
+      return items;
+    }
+    return items.filter(item => item[filter['key']] ===  filter['value']);
+  }
+
+}

package/src/app/pipe/find.pipe.spec.ts

@@ -0,0 +1,8 @@
+import { FindPipe } from './find.pipe';
+
+describe('FindPipe', () => {
+  it('create an instance', () => {
+    const pipe = new FindPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

package/src/app/pipe/find.pipe.ts

@@ -0,0 +1,15 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'find'
+})
+export class FindPipe implements PipeTransform {
+
+  transform(items: any[], filter: Object): any {
+    if (!items || !filter) {
+      return items;
+    }
+    return items.find(item => item[filter['key']] ===  filter['value']);
+  }
+
+}

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

@@ -7,6 +7,8 @@ import { map } from 'rxjs/operators';
 import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
 import { AppStorageService } from 'src/chat21-core/providers/abstract/app-storage.service';
+import { Project } from 'src/chat21-core/models/projects';
+import { Observable } from 'rxjs';
 
 
 @Injectable({
@@ -93,6 +95,23 @@ export class TiledeskService {
     }))
   }
 
+
+  public getProjectUsersByProjectId(project_id: string) {
+    const url = this.SERVER_BASE_URL + project_id + '/project_users/';
+    this.logger.log('[TILEDESK-SERVICE] - GET PROJECT-USER URL', url);
+    
+    const httpOptions = {
+      headers: new HttpHeaders({
+        'Content-Type': 'application/json',
+        Authorization: this.tiledeskToken
+      })
+    };
+    return this.http.get(url, httpOptions).pipe(map((res: any) => {
+      this.logger.log('[TILEDESK-SERVICE] - GET PROJECT-USER RES ', res);
+      return res
+    }))
+  }
+
   public getAllLeadsActiveWithLimit(project_id: string, limit: number) {
     const url = this.SERVER_BASE_URL + project_id + '/leads?limit=' + limit + '&with_fullname=true';
     this.logger.log('[TILEDESK-SERVICE] - GET ALL ACTIVE LEADS (LIMIT 10000) -  URL', url);

package/src/app/services/triggerEvents/triggerEvents.ts

@@ -131,4 +131,16 @@ export class TriggerEvents {
     }
 
     
+    public triggerOnConversationChanged(conversation: ConversationModel) {
+        this.logger.debug(' ---------------- triggerOnConversationChanged ---------------- ', conversation);
+        try {
+            const windowContext = this.windowContext;
+            if (windowContext) {
+                windowContext.postMessage({ type: 'onConversationChanged', data: conversation }, '*');
+            }
+        } catch (e) {
+            this.logger.error('[TRIGGER-HANDLER] > Error triggerOnConversationChanged:' + e);
+        }
+    }
+
 }

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;
   }

package/src/app/shared/shared.module.ts

@@ -25,6 +25,9 @@ import { SafeHtmlPipe } from '../directives/safe-html.pipe';
 import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
 import { createTranslateLoader } from 'src/chat21-core/utils/utils';
 import { HttpClient } from '@angular/common/http';
+import { RouterModule } from '@angular/router';
+import { FindPipe } from '../pipe/find.pipe';
+import { FilterPipe } from '../pipe/filter.pipe';
 
 @NgModule({
   declarations: [
@@ -67,12 +70,13 @@ import { HttpClient } from '@angular/common/http';
      SidebarUserDetailsComponent,
     
      //DIRECTIVES
-     AutofocusDirective,
-     TooltipDirective,
-     MarkedPipe,
-     HtmlEntitiesEncodePipe,
-     SafeHtmlPipe,
- 
+    AutofocusDirective,
+    TooltipDirective,
+    MarkedPipe,
+    HtmlEntitiesEncodePipe,
+    SafeHtmlPipe,
+    FindPipe,
+    FilterPipe,
 
 
      AvatarProfileComponent,
@@ -123,6 +127,10 @@ import { HttpClient } from '@angular/common/http';
     MarkedPipe,
     HtmlEntitiesEncodePipe,
     SafeHtmlPipe,
+    FindPipe,
+    FilterPipe,
+
+    RouterModule,
 
     //COMMON COMPONENTS
     AvatarProfileComponent,
@@ -140,16 +148,15 @@ import { HttpClient } from '@angular/common/http';
     MomentModule,
     NgSelectModule,
     FormsModule,
-
     TranslateModule.forChild({
-      loader: {
-        provide: TranslateLoader,
-        useFactory: (createTranslateLoader),
-        deps: [HttpClient]
-      }
-    })
-
-  ],
+        loader: {
+            provide: TranslateLoader,
+            useFactory: (createTranslateLoader),
+            deps: [HttpClient]
+        }
+    }),
+    RouterModule.forChild([])
+],
   schemas: [
     CUSTOM_ELEMENTS_SCHEMA,
     NO_ERRORS_SCHEMA

package/src/chat21-core/models/projects.ts

@@ -20,6 +20,7 @@ export interface Project {
     isActiveSubscription?: boolean;
     profile?: any;
     offlineMsgEmail?: boolean;
+    teammateStatus?: any;
     // subscription_end_date?: any;
     // subscription_id?: any;
     // subscription_creation_date?: any;

package/src/chat21-core/utils/constants.ts

@@ -116,6 +116,7 @@ export const PLATFORM_DESKTOP = 'desktop';
 
 // STORAGE
 export const STORAGE_PREFIX = 'tiledesk_widget_';
+export const PROJECTS_STORAGE_KEY = 'all_projects';
 
 // links
 export const FIREBASESTORAGE_BASE_URL_IMAGE = 'https://firebasestorage.googleapis.com/v0/b/' //+ 'chat-v2-dev.appspot.com/o/';
@@ -152,6 +153,6 @@ export const TEAMMATE_STATUS = [
     { id: 1, name: 'Available', avatar: 'assets/img/teammate-status/avaible.svg', label: "LABEL_AVAILABLE" },
     { id: 2, name: 'Unavailable', avatar: 'assets/img/teammate-status/unavaible.svg', label: "LABEL_NOT_AVAILABLE" },
     { id: 3, name: 'Inactive', avatar: 'assets/img/teammate-status/inactive.svg', label: "LABEL_INACTIVE" },
-  ];
+];
 
 

package/src/chat21-core/utils/convertRequestToConversation.ts

@@ -30,7 +30,7 @@ export class ConvertRequestToConversation {
             '',
             request.lead && request.lead.fullname ? request.lead.fullname: null,
             request.status || '0',
-            moment(request.createdAt).unix(),
+            moment(request.createdAt).valueOf(),
             getColorBck(request.lead.fullname),
             avatarPlaceholder(request.lead.fullname),
             false,