@chat21/chat21-ionic 3.0.59-rc9 → 3.0.59

package/src/app/app.module.ts

@@ -103,7 +103,7 @@ export function createTranslateLoader(http: HttpClient) {
 
 }
 
-export function authenticationFactory(http: HttpClient, appConfig: AppConfigProvider, chat21Service: Chat21Service, appSorage: AppStorageService, network: Network, connectionService:ConnectionService) {
+export function authenticationFactory(http: HttpClient, appConfig: AppConfigProvider, chat21Service: Chat21Service, appSorage: AppStorageService, network: Network, connectionService: ConnectionService) {
   const config = appConfig.getConfig()
   if (config.chatEngine === CHAT_ENGINE_MQTT) {
 
@@ -112,8 +112,13 @@ export function authenticationFactory(http: HttpClient, appConfig: AppConfigProv
 
     const auth = new MQTTAuthService(http, chat21Service, appSorage);
 
-    auth.setBaseUrl(appConfig.getConfig().apiUrl)
-    
+    auth.setBaseUrl(appConfig.getConfig().apiUrl);
+
+    if (config.pushEngine = PUSH_ENGINE_MQTT) {
+      // FOR PUSH NOTIFICATIONS INIT FIREBASE APP
+      FirebaseInitService.initFirebase(config.firebaseConfig);
+    }
+
     return auth
   } else {
 
@@ -121,7 +126,7 @@ export function authenticationFactory(http: HttpClient, appConfig: AppConfigProv
     // console.log('[APP-MOD] FirebaseInitService config ', config)
     const auth = new FirebaseAuthService(http, network, connectionService);
     auth.setBaseUrl(config.apiUrl)
-  
+
     return auth
   }
 }
@@ -217,12 +222,12 @@ export function uploadFactory(http: HttpClient, appConfig: AppConfigProvider, ap
   }
 }
 
-export function notificationsServiceFactory(appConfig: AppConfigProvider) {
+export function notificationsServiceFactory(appConfig: AppConfigProvider, chat21Service: Chat21Service) {
   const config = appConfig.getConfig()
   if (config.pushEngine === PUSH_ENGINE_FIREBASE) {
     return new FirebaseNotifications();
   } else if (config.pushEngine === PUSH_ENGINE_MQTT) {
-    return new MQTTNotifications();
+    return new MQTTNotifications(chat21Service);
   } else {
     return;
   }
@@ -340,7 +345,7 @@ const appInitializerFn = (appConfig: AppConfigProvider, logger: NGXLogger) => {
     {
       provide: NotificationsService,
       useFactory: notificationsServiceFactory,
-      deps: [AppConfigProvider]
+      deps: [AppConfigProvider, Chat21Service]
     },
     {
       provide: AppStorageService,

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

@@ -10,7 +10,7 @@
             <div class="chat21-bounce1" [ngStyle]="{'background-color': stylesMap.get('themeColor')}"></div>
             <div class="chat21-bounce2" [ngStyle]="{'background-color': stylesMap.get('themeColor')}"></div>
             <div class="chat21-bounce3" [ngStyle]="{'background-color': stylesMap.get('themeColor')}"></div>
-            <span>{{translationMap.get('LABEL_LOADING')}}</span>
+            <span>{{translationMap?.get('LABEL_LOADING')}}</span>
         </div>
       </span>
       

package/src/app/chatlib/list-conversations-component/list-conversations/list-conversations.component.html

@@ -34,7 +34,7 @@
               width="24px" height="24px" viewBox="0 0 24 24">
               <path fill="none" d="M0 0h24v24H0z"/>
               <path d="M13 3c-4.97 0-9 4.03-9 9H1l3.89 3.89.07.14L9 12H6c0-3.87 3.13-7 7-7s7 3.13 7 7-3.13 7-7 7c-1.93 0-3.68-.79-4.94-2.06l-1.42 1.42C8.27 19.99 10.51 21 13 21c4.97 0 9-4.03 9-9s-4.03-9-9-9zm-1 5v5l4.28 2.54.72-1.21-3.5-2.08V8H12z"/>
-              <title id="altIconTitle">{{ translationMap.get('CLOSED') }}</title>
+              <title id="altIconTitle">{{ translationMap?.get('CLOSED') }}</title>
             </svg>
           </button>
         </div>

package/src/app/components/authentication/login/login.component.html

@@ -8,25 +8,25 @@
 
     <div class="signin-title" style="text-align:center">
       <h2 style="font-family: 'Montserrat', sans-serif; font-weight: 400;">
-        {{ translationMap.get('LABEL_SIGNIN_TO') }}
+        {{ translationMap?.get('LABEL_SIGNIN_TO') }}
         {{companyName}}
       </h2>
     </div>
     <div class="login-container">
       <form [formGroup]="userForm" (ngSubmit)="signInWithEmailAndPassword()" novalidate>
 
-        <ion-label stacked for="email">{{ translationMap.get('LABEL_EMAIL') }}</ion-label>
+        <ion-label stacked for="email">{{ translationMap?.get('LABEL_EMAIL') }}</ion-label>
         <ion-input #email formControlName="email" type="email" id="email" required autocapitalize="off" spellcheck="false"
-        placeholder="{{ translationMap.get('LABEL_PLACEHOLDER_EMAIL') }}"
+        placeholder="{{ translationMap?.get('LABEL_PLACEHOLDER_EMAIL') }}"
         [class.invalid]="!userForm.controls.email.valid" ></ion-input>
         <div *ngIf="formErrors.email" class="is-danger">
           {{ formErrors.email }}
         </div>
 
        
-        <ion-label stacked for="password">{{ translationMap.get('LABEL_PASSWORD') }}</ion-label>
+        <ion-label stacked for="password">{{ translationMap?.get('LABEL_PASSWORD') }}</ion-label>
         <ion-input #password formControlName="password" type="password" id="password" required
-        placeholder="{{ translationMap.get('LABEL_PLACEHOLDER_PASSWORD') }}"
+        placeholder="{{ translationMap?.get('LABEL_PLACEHOLDER_PASSWORD') }}"
         [class.invalid]="!userForm.controls.password.valid"></ion-input>
 
         <div *ngIf="formErrors.password" class="is-danger">
@@ -36,7 +36,7 @@
         
         <button type="submit" class="btn signin-button ion-activatable ripple-parent" [ngClass]="{'signin-button-is-disabled': !userForm.valid}" [disabled]="!userForm.valid">
           <span class="signin-button-label" *ngIf="showSpinnerInLoginBtn === false" >
-            {{ translationMap.get('LABEL_SIGNIN') }}
+            {{ translationMap?.get('LABEL_SIGNIN') }}
           </span>
           <ion-ripple-effect type="unbounded"></ion-ripple-effect>
           <ion-spinner *ngIf="showSpinnerInLoginBtn === true" name="bubbles" color="white" duration="2" ></ion-spinner>
@@ -50,9 +50,9 @@
         </p> -->
 
         <p style="color: #666666; font-size: 1.1em; text-align: center; margin-top: 16px;">
-           {{ translationMap.get('LABEL_FORGOT_YOUR_PASSWORD') }}
+           {{ translationMap?.get('LABEL_FORGOT_YOUR_PASSWORD') }}
           <span style="color: #03a5e8; cursor:pointer" (click)="goToResetPsw()">
-             {{ translationMap.get('LABEL_CLICK_HERE') }} 
+             {{ translationMap?.get('LABEL_CLICK_HERE') }} 
           </span>
         </p>
 

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

@@ -3,10 +3,8 @@
   <ion-toolbar>
     
     <ion-buttons slot="start">
-      <!-- (click)="pushPage('conversations-list')" -->
-      <ion-back-button text="" *ngIf="isMobile"
-          defaultHref="/conversations-list"
-         >
+      <!-- (click)="pushPage('conversations-list')" defaultHref="/conversations-list" -->
+      <ion-back-button style="display: block;" text="" *ngIf="isMobile" (click)="goBackToConversationList()">
       </ion-back-button> 
     </ion-buttons>
 

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

@@ -1,5 +1,5 @@
 import { Component, OnInit, Input, Output, EventEmitter, OnChanges } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
 import { ImageRepoService } from 'src/chat21-core/providers/abstract/image-repo.service';
 
 // Logger
@@ -43,7 +43,8 @@ export class HeaderConversationDetailComponent implements OnInit, OnChanges {
   constructor(
     public imageRepoService: ImageRepoService,
     private route: ActivatedRoute,
-    public platform: Platform
+    public platform: Platform,
+    private router: Router
   ) {
     this.route.paramMap.subscribe(params => {
 
@@ -125,4 +126,8 @@ export class HeaderConversationDetailComponent implements OnInit, OnChanges {
   /** */
   pushPage(event) { }
 
+  goBackToConversationList() {
+    this.router.navigateByUrl('/conversations-list');
+  }
+
 }

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

@@ -59,7 +59,7 @@
               </div>
 
 
-              <div class="flex-child-right" *ngIf="!window_width_is_60">
+              <div class="flex-child-right">
                 <div class="project-name-project-for-panel">
                   {{ project?.id_project?.name }}
                 </div>
@@ -130,7 +130,7 @@
                     </svg>
                   </div>
                   <span *ngIf="project?.ws_projct_user_isBusy === true" class="project-item--isBusy-busy-text text-pulse-animation">
-                    {{translationMap.get('Busy')}}
+                    {{translationMap?.get('Busy')}}
                   </span>
                 </div>
 

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

@@ -4,7 +4,7 @@
     padding-top: 0px;
     margin-top: 0px !important;
     padding-bottom: 0px !important;
-    background: #fff;
+    // background: #fff;
     padding-left: 0px;
     width: 100%;
     // min-height: 70px;
@@ -12,12 +12,12 @@
     min-height: 55px;
     height: 55px;
     position: relative;
-    top: -4px;
+    top: -5px;
 }
 
-.main-content-project-for-panel:hover {
-    background-color: rgb(244, 243, 244);
-}
+// .main-content-project-for-panel:hover {
+//     background-color: rgb(244, 243, 244);
+// }
 .container-project-for-panel {
     padding: 0px !important;
     width: 296px;
@@ -298,7 +298,7 @@
 
 .availabily-and-busy-wpr {
     // margin-top: 6px;
-    margin-top: 4px;
+    margin-top: 7px;
     margin-left: 11px;
 }
 

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

@@ -8,6 +8,7 @@ import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance'
 import { CustomTranslateService } from 'src/chat21-core/providers/custom-translate.service';
 import { TiledeskAuthService } from 'src/chat21-core/providers/tiledesk/tiledesk-auth.service';
 import { TiledeskService } from 'src/app/services/tiledesk/tiledesk.service';
+import { WebSocketJs } from 'src/app/services/websocket/websocket-js';
 
 @Component({
   selector: 'app-project-item',
@@ -35,7 +36,8 @@ export class ProjectItemComponent implements OnInit {
     public appStorageService: AppStorageService,
     private translateService: CustomTranslateService,
     public tiledeskAuthService: TiledeskAuthService,
-    public tiledeskService: TiledeskService
+    public tiledeskService: TiledeskService,
+    public webSocketJs: WebSocketJs,
   ) { }
 
   ngOnInit() {
@@ -45,6 +47,7 @@ export class ProjectItemComponent implements OnInit {
     this.translations();
     this.listenToPostMsgs();
     this.onInitWindowWidth();
+
   }
 
   listenToPostMsgs() {
@@ -52,9 +55,14 @@ export class ProjectItemComponent implements OnInit {
       // console.log("[PROJECT-ITEM] post message event ", event);
 
       if (event && event.data && event.data) {
-        // console.log("[APP-COMP] message event data  ", event.data);
+        // console.log("[PROJECT-ITEM] message event data  ", event.data);
         if (event.data === 'hasChangedProject') {
+          this.unservedRequestCount = 0;
+          if (this.project) {
+            this.webSocketJs.unsubscribe('/' + this.project.id_project._id + '/requests');  
+          }
           this.getLastProjectStoredAndSubscToWSAvailabilityAndConversations();
+          
         }
       }
     })
@@ -72,26 +80,26 @@ export class ProjectItemComponent implements OnInit {
   @HostListener('window:resize', ['$event'])
   onResize(event: any) {
     this.newInnerWidth = event.target.innerWidth;
-    this.logger.log('[PROJECTS-X-PANEL] - INNER WIDTH ', this.newInnerWidth)
+    this.logger.log('[PROJECT-ITEM] - INNER WIDTH ', this.newInnerWidth)
 
-    if (this.newInnerWidth <= 150) {
-      this.window_width_is_60 = true;
-    } else {
-      this.window_width_is_60 = false;
-    }
+    // if (this.newInnerWidth <= 150) {
+    //   this.window_width_is_60 = true;
+    // } else {
+    //   this.window_width_is_60 = false;
+    // }
   }
 
   onInitWindowWidth(): any {
     const actualWidth = window.innerWidth;
-    this.logger.log('[PROJECTS-X-PANEL] - ACTUAL Width ', actualWidth);
+    this.logger.log('[PROJECT-ITEM] - ACTUAL Width ', actualWidth);
 
 
-    // if (actualWidth <= 60) {
-    if (actualWidth <= 150) {
-      this.window_width_is_60 = true;
-    } else {
-      this.window_width_is_60 = false;
-    }
+   
+    // if (actualWidth <= 150) {
+    //   this.window_width_is_60 = true;
+    // } else {
+    //   this.window_width_is_60 = false;
+    // }
   }
 
 
@@ -117,22 +125,26 @@ export class ProjectItemComponent implements OnInit {
     let stored_project = ''
     try {
       stored_project = localStorage.getItem('last_project')
+      this.logger.log('PROJECT-ITEM - THERE IS A STORED PROJECT ', stored_project)
     } catch (err) {
-      console.log('Get loacal storage item LAST PROJECT ', err)
+      this.logger.error('Get local storage LAST PROJECT ', err)
     }
 
 
     if (!stored_project) {
-      console.log('PROJECT-ITEM - THERE IS NOT STORED LAST PROJECT ', stored_project)
+      this.logger.log('PROJECT-ITEM - THERE IS NOT STORED LAST PROJECT ', stored_project)
       const tiledeskToken = this.appStorageService.getItem('tiledeskToken');
       this.logger.log('[INFO-CONTENT-COMP] - GET PROJECTS - tiledeskToken', tiledeskToken);
       this.tiledeskService.getProjects(tiledeskToken).subscribe(projects => {
         this.logger.log('[INFO-CONTENT-COMP] - GET PROJECTS - RES', projects);
-        this.project = projects[0];
+
         this.logger.log('[INFO-CONTENT-COMP] - GET PROJECTS - RES this.project', this.project);
 
         localStorage.setItem('last_project', JSON.stringify(projects[0]))
-        this.doProjectSubscriptions(this.project)
+        if (projects[0]) {
+          this.project = projects[0];
+          this.doProjectSubscriptions(this.project)
+        }
 
       }, (error) => {
         this.logger.error('[INFO-CONTENT-COMP] - GET PROJECTS - ERROR  ', error);
@@ -146,7 +158,9 @@ export class ProjectItemComponent implements OnInit {
 
     if (stored_project) {
       this.logger.log('PROJECT-ITEM - THERE IS STORED LAST PROJECT ', stored_project)
-      this.project = JSON.parse(stored_project)
+      if (stored_project) {
+        this.project = JSON.parse(stored_project)
+      }
       this.doProjectSubscriptions(this.project)
       this.logger.log('[PROJECT-ITEM] - LAST PROJECT PARSED ', this.project)
     }
@@ -155,6 +169,7 @@ export class ProjectItemComponent implements OnInit {
   }
 
   doProjectSubscriptions(project) {
+    this.logger.log('[PROJECT-ITEM] doProjectSubscriptions project ', project)
     if (project) {
       const user_role = this.project.role
       this.logger.log('[PROJECT-ITEM] - user_role ', user_role)
@@ -229,29 +244,28 @@ export class ProjectItemComponent implements OnInit {
   }
 
   updateUnservedRequestCount() {
+    // console.log('[PROJECT-ITEM] updateUnservedRequestCount ')
     // this.requestsService.requestsList_bs.subscribe((requests) => {
     this.wsService.wsRequestsList$
-      .pipe(
-        takeUntil(this.unsubscribe$)
-      )
       .subscribe((requests) => {
-
+        // console.log('[PROJECT-ITEM] requests ', requests)
         if (requests) {
           let count = 0;
           requests.forEach(r => {
             // this.logger.log('NAVBAR - UPDATE-UNSERVED-REQUEST-COUNT request agents', r.agents)
             // *bug fix: when the user is an agent also for the unserved we have to consider if he is present in agents
-            if (r['status'] === 100 && this.ROLE_IS_AGENT === true) {
+            // && this.ROLE_IS_AGENT === true
+            if (r['status'] === 100 ) {
               if (this.hasmeInAgents(r['agents']) === true) {
                 count = count + 1;
               }
             }
-            if (r['status'] === 100 && this.ROLE_IS_AGENT === false) {
-              count = count + 1;
-            }
+            // if (r['status'] === 100 && this.ROLE_IS_AGENT === false) {
+            //   count = count + 1;
+            // }
           });
           this.unservedRequestCount = count;
-          this.logger.log('[PROJECT-ITEM] UNSERVED REQUEST COUNT - RES ', this.unservedRequestCount)
+          // console.log('[PROJECT-ITEM] UNSERVED REQUEST COUNT - RES ', this.unservedRequestCount)
         }
       }, error => {
         this.logger.error('[PROJECT-ITEM] UNSERVED REQUEST COUNT * error * ', error)
@@ -263,10 +277,10 @@ export class ProjectItemComponent implements OnInit {
   hasmeInAgents(agents) {
     if (agents) {
       for (let j = 0; j < agents.length; j++) {
-        this.logger.log('[PROJECT-ITEM] hasmeInAgents currentUserId  ', this.currentUserId)
-        this.logger.log('[PROJECT-ITEM] hasmeInAgents agent  ', agents[j].id_user)
+        // this.logger.log('[PROJECT-ITEM] hasmeInAgents currentUserId  ', this.currentUserId)
+        // this.logger.log('[PROJECT-ITEM] hasmeInAgents agent  ', agents[j].id_user)
         if (this.currentUserId === agents[j].id_user) {
-          this.logger.log('[PROJECT-ITEM] hasmeInAgents ')
+          // this.logger.log('[PROJECT-ITEM] hasmeInAgents ')
           return true
         }
       }

package/src/app/pages/authentication/login/login.page.html

@@ -3,6 +3,5 @@
   [translationMap] = translationMap
   [companyLogoBlackUrl]= companyLogoBlackUrl
   [companyName]= companyName
-  (eventSignInWithEmailAndPassword)="returnSignInWithEmailAndPassword($event)"
-  >
+  (eventSignInWithEmailAndPassword)="returnSignInWithEmailAndPassword($event)">
 </component-login>

package/src/app/pages/conversation-detail/conversation-detail.page.ts

@@ -179,6 +179,8 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
       this.conversationWith = params.get('IDConv');
       this.conversationWithFullname = params.get('FullNameConv');
       this.conv_type = params.get('Convtype');
+
+      this.events.publish('supportconvid:haschanged', this.conversationWith);  
     });
 
   }

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

@@ -12,13 +12,8 @@
 
   <div id="scrollbar2">
     <ion-list>
-      <span
-        *ngIf="(conversations.length > 0 && conversationType ==='active') || (archivedConversations.length > 0  && conversationType ==='archived');then contentConversations else contentMessageWelcome">
-        here is ignored
-      </span>
 
-      <ng-template #contentConversations>
-        <!-- -------------------------------------------------------------------------- -->
+                   <!-- -------------------------------------------------------------------------- -->
         <!-- New   <ion-spinner class="spinner-middle" style="margin-left: 19px;"></ion-spinner> -->
         <!-- -------------------------------------------------------------------------- -->
         <ion-item *ngIf="isOnline === false" style="padding-left:0px!important ;padding-right:0px!important" button="true" lines="none" class="ion-no-padding waiting-for-connection">
@@ -42,11 +37,21 @@
           <ion-label part="message-text" class="waiting-for-network-msg"> Waiting for network</ion-label>
         </ion-item>
 
-        <ion-item *ngIf="supportMode" class="ion-no-padding open-iframe-item" style="padding-left:0px!important ;padding-right:0px!important; height:55px" button="true"
+        <ion-item  *ngIf="supportMode && displayNewConvsItem" class="ion-no-padding open-iframe-item"
+        button="true"
           (click)="openUnsevedConversationIframe()">
           <div tabindex="0"></div>
           <app-project-item (projectIdEvent)="getLastProjectId($event)"></app-project-item>
         </ion-item>
+
+      <span
+        *ngIf="(conversations.length > 0 && conversationType ==='active') || (archivedConversations.length > 0  && conversationType ==='archived');then contentConversations else contentMessageWelcome">
+        here is ignored
+      </span>
+
+ 
+
+      <ng-template #contentConversations>
         <!-- ---------------------------------- -->
         <!-- ACTIVE CONVERSATION LIST -->
         <!-- ---------------------------------- -->