@chat21/chat21-ionic 3.0.83 → 3.0.86-rc.1

package/src/app/app.component.ts

@@ -1,5 +1,6 @@
-import { TYPE_DIRECT, TYPE_SUPPORT_GROUP } from 'src/chat21-core/utils/constants';
-import { tranlatedLanguage, URL_SOUND_LIST_CONVERSATION } from './../chat21-core/utils/constants';
+
+import { TYPE_DIRECT, TYPE_SUPPORT_GROUP, URL_SOUND_CONVERSATION_UNASSIGNED } from 'src/chat21-core/utils/constants';
+import { tranlatedLanguage, URL_SOUND_CONVERSATION_ADDED, URL_SOUND_LIST_CONVERSATION } from './../chat21-core/utils/constants';
 import { ArchivedConversationsHandlerService } from 'src/chat21-core/providers/abstract/archivedconversations-handler.service';
 import { AppStorageService } from 'src/chat21-core/providers/abstract/app-storage.service';
 
@@ -38,7 +39,7 @@ import { LoginPage } from './pages/authentication/login/login.page';
 import { ConversationListPage } from './pages/conversations-list/conversations-list.page';
 
 // utils
-import { checkPlatformIsMobile, isGroup, getParameterByName, searchIndexInArrayForUid, compareValues } from '../chat21-core/utils/utils';
+import { checkPlatformIsMobile, isGroup, getParameterByName, searchIndexInArrayForUid, compareValues, stripTags } from '../chat21-core/utils/utils';
 import { STORAGE_PREFIX, PLATFORM_MOBILE, PLATFORM_DESKTOP, CHAT_ENGINE_FIREBASE, AUTH_STATE_OFFLINE, AUTH_STATE_ONLINE } from '../chat21-core/utils/constants';
 import { environment } from '../environments/environment';
 import { UserModel } from '../chat21-core/models/user';
@@ -87,11 +88,15 @@ export class AppComponent implements OnInit {
   public authModal: any;
 
   private audio: any;
+  private audio_NewConv: any;
+  private audio_Unassigned: any;
   private setIntervalTime: any;
   private setTimeoutSound: any;
   private isTabVisible: boolean = true;
-  private isSoundEnabled: boolean;
+  public isSoundEnabled: boolean;
   private hasPlayed: boolean;
+  private hasPlayedConversation: boolean;
+  private hasPlayedConversationUnassigned: boolean;
   private tabTitle: string;
   private setTimeoutConversationsEvent: any;
   private logger: LoggerService = LoggerInstance.getInstance();
@@ -335,6 +340,7 @@ export class AppComponent implements OnInit {
 
 
     this.initializeApp('oninit');
+    this.initSegment()
     this.listenToPostMsgs();
   }
 
@@ -467,6 +473,7 @@ export class AppComponent implements OnInit {
       this.statusBar.styleDefault();
       this.navService.init(this.sidebarNav, this.detailNav);
       // this.persistence = appconfig.authPersistence;
+      // this.appStorageService.initialize(environment.storage_prefix, this.persistence, '')
       this.tiledeskAuthService.initialize(this.appConfigProvider.getConfig().apiUrl);
       this.messagingAuthService.initialize();
 
@@ -830,6 +837,14 @@ export class AppComponent implements OnInit {
     this.audio.src = chatBaseUrl + URL_SOUND_LIST_CONVERSATION;
     this.audio.load();
 
+    this.audio_NewConv = new Audio();
+    this.audio_NewConv.src = chatBaseUrl + URL_SOUND_CONVERSATION_ADDED;
+    this.audio_NewConv.load();
+
+    this.audio_Unassigned = new Audio();
+    this.audio_Unassigned.src = chatBaseUrl + URL_SOUND_CONVERSATION_UNASSIGNED;
+    this.audio_Unassigned.load();
+
     const sound_status = localStorage.getItem('dshbrd----sound')
     if(sound_status && sound_status !== 'undefined'){
       this.isSoundEnabled = sound_status === 'enabled'? true: false
@@ -839,7 +854,14 @@ export class AppComponent implements OnInit {
 
   }
 
-  private manageTabNotification(badgeNotificationCount?: number) {
+  onSoundChange(event){
+    if(event && event !== undefined){
+      localStorage.setItem('dshbrd----sound', event)
+      this.isSoundEnabled = event === 'enabled'? true: false
+    }
+  }
+
+  private manageTabNotification(sound_type: string, badgeNotificationCount?: number) {
     if (!this.isTabVisible) {
       // TAB IS HIDDEN --> manage title and SOUND
       let badgeNewConverstionNumber = badgeNotificationCount? badgeNotificationCount : this.conversationsHandlerService.countIsNew()
@@ -863,7 +885,26 @@ export class AppComponent implements OnInit {
       this.isSoundEnabled = sound_status === 'enabled'? true: false
     }
     this.logger.debug('[APP-COMP] manageTabNotification can saund?', this.isInitialized, this.isSoundEnabled)
-    if(this.isInitialized && this.isSoundEnabled) this.soundMessage()
+    if(this.isInitialized && this.isSoundEnabled) {
+      switch(sound_type){
+        case 'conv_added': {
+          this.soundConversationAdded();
+          break;
+        }
+        case 'new_message': {
+          this.soundMessage();
+          break;
+        }
+        case 'conv_unassigned': {
+          this.soundConversationUnassigned();
+          break;
+        }
+        default:{
+          this.soundMessage();
+          break;
+        }
+      }
+    }
   }
 
   soundMessage() {
@@ -879,7 +920,7 @@ export class AppComponent implements OnInit {
     // }, 4000);
 
     //play sound every 4s from the fist time you receive a conversation added/changed
-    if(!this.hasPlayed){
+    if(!this.hasPlayed && !this.hasPlayedConversation){
       that.audio.play().then(() => {
         that.hasPlayed = true
         that.logger.debug('[APP-COMP] ****** soundMessage played *****');
@@ -891,6 +932,36 @@ export class AppComponent implements OnInit {
       });
     }
   }
+
+  soundConversationAdded(){
+    const that = this;
+    if(!this.hasPlayedConversation ){
+      that.audio_NewConv.play().then(() => {
+        that.hasPlayedConversation = true
+        that.logger.debug('[APP-COMP] ****** soundConversationAdded played *****');
+        setTimeout(() => {
+          that.hasPlayedConversation = false
+        }, 4000);
+      }).catch((error: any) => {
+        that.logger.error('[APP-COMP] ***soundConversationAdded error*', error);
+      });
+    }
+  }
+
+  soundConversationUnassigned(){
+    const that = this;
+    if(!this.hasPlayedConversationUnassigned ){
+      that.audio_Unassigned.play().then(() => {
+        that.hasPlayedConversationUnassigned = true
+        that.logger.debug('[APP-COMP] ****** soundConversationUnassigned played *****');
+        setTimeout(() => {
+          that.hasPlayedConversationUnassigned = false
+        }, 4000);
+      }).catch((error: any) => {
+        that.logger.error('[APP-COMP] ***soundConversationUnassigned error*', error);
+      });
+    }
+  }
   /**---------------- SOUND FUNCTIONS --> END <--- +*/
   /***************************************************+*/
 
@@ -938,11 +1009,11 @@ export class AppComponent implements OnInit {
     this.events.subscribe('uidConvSelected:changed', this.subscribeChangedConversationSelected);
     this.events.subscribe('profileInfoButtonClick:logout', this.subscribeProfileInfoButtonLogOut);
     this.events.subscribe('unservedRequest:count', this.subscribeUnservedRequestCount)
-
+    this.events.subscribe('convList:onConversationSelected', this.subscribeConversationSelected)
     this.conversationsHandlerService.conversationAdded.subscribe((conversation: ConversationModel) => {
       // this.logger.log('[APP-COMP] ***** subscribeConversationAdded *****', conversation);
       if (conversation && conversation.is_new === true) {
-        this.manageTabNotification()
+        this.manageTabNotification('conv_added')
       }
       if(conversation) this.updateConversationsOnStorage()
     });
@@ -960,7 +1031,7 @@ export class AppComponent implements OnInit {
         this.logger.log('[APP-COMP] ***** subscribeConversationChangedDetailed currentUser: ', currentUser);
         if (changes.value && changes.value.sender !== currentUser.uid) {
           if(changes.value.is_new === changes.previousValue.is_new){
-            this.manageTabNotification();
+            this.manageTabNotification('new_message');
           }
         }
       }
@@ -972,7 +1043,6 @@ export class AppComponent implements OnInit {
         this.updateConversationsOnStorage();
         isDevMode()? null: this.segmentResolved(conversation)
       }
-
     });
   }
 
@@ -1018,7 +1088,6 @@ export class AppComponent implements OnInit {
       this.initConversationsHandler(currentUser.uid);
       this.initArchivedConversationsHandler(currentUser.uid);
       isDevMode()? null: this.segmentSignIn()
-
     }
     this.checkPlatform();
     try {
@@ -1059,7 +1128,7 @@ export class AppComponent implements OnInit {
 
     // this.unsubscribe$.next();
     // this.unsubscribe$.complete();
-
+    
   }
 
   goToDashboardLogin(){
@@ -1120,7 +1189,7 @@ export class AppComponent implements OnInit {
   }
 
   subscribeProfileInfoButtonLogOut = (hasClickedLogout) => {
-    this.logger.log('[APP-COMP] FIREBASE-NOTIFICATION >>>>  subscribeProfileInfoButtonLogOut');
+    this.logger.log('[APP-COMP] FIREBASE-NOTIFICATION >>>>  subscribeProfileInfoButtonLogOut ');
     // if (hasClickedLogout === true) {
     //   this.removePresenceAndLogout()
     // }
@@ -1141,6 +1210,7 @@ export class AppComponent implements OnInit {
 
           if (res === 'success') {
             that.removePresenceAndLogout();
+            
           } else {
             that.removePresenceAndLogout();
             // that.presentToast();
@@ -1154,13 +1224,19 @@ export class AppComponent implements OnInit {
 
   subscribeUnservedRequestCount = (unservedRequestCount) => {
     if(unservedRequestCount && unservedRequestCount > 0){
-      this.logger.debug("hasToSoundUnservedRequestCount::::", this.isInitialized)
+      this.logger.debug("subscribeUnservedRequestCount appIsInitialized::::",this.isInitialized)
       if(this.isInitialized){
-        this.manageTabNotification(unservedRequestCount) //sound and alternate title
+        this.manageTabNotification('conv_unassigned', unservedRequestCount) //sound and alternate title
       }
     }
   }
 
+  subscribeConversationSelected= (conversation: ConversationModel) => {
+    if(conversation && conversation.is_new){
+      this.audio_NewConv.pause()
+    }
+  }
+
   private async presentModal(calledby): Promise<any> {
     this.logger.log('[APP-COMP] presentModal calledby', calledby, '- hadBeenCalledOpenModal: ', this.hadBeenCalledOpenModal);
     const attributes = { tenant: this.tenant, enableBackdropDismiss: false };
@@ -1268,122 +1344,142 @@ export class AppComponent implements OnInit {
     }
   }
 
-  private segmentSignIn(){
-    let user = this.tiledeskAuthService.getCurrentUser();
-    try {
-      window['analytics'].page("Chat Auth Page, Signin", {});
-    } catch (err) {
-      this.logger.error('Event:Signed In [page] error', err);
-    }
-
-    try {
-      window['analytics'].identify(user.uid, {
-        name: user.firstname + ' ' + user.lastname,
-        email: user.email,
-        logins: 5,
+  private initSegment(){
+    if(!isDevMode()){
+      var head  = document.getElementsByTagName('head')[0];
+      var script  = document.createElement('script');
+      script.type="text/javascript";
+      script.text =`!function(){var analytics=window.analytics=window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","reset","group","track","ready","alias","debug","page","once","off","on","addSourceMiddleware","addIntegrationMiddleware","setAnonymousId","addDestinationMiddleware"];analytics.factory=function(e){return function(){var t=Array.prototype.slice.call(arguments);t.unshift(e);analytics.push(t);return analytics}};for(var e=0;e<analytics.methods.length;e++){var key=analytics.methods[e];analytics[key]=analytics.factory(key)}analytics.load=function(key,e){var t=document.createElement("script");t.type="text/javascript";t.async=!0;t.src="https://cdn.segment.com/analytics.js/v1/" + key + "/analytics.min.js";var n=document.getElementsByTagName("script")[0];n.parentNode.insertBefore(t,n);analytics._loadOptions=e};analytics._writeKey="qaTU0wG6VH6xPAhOzD2kneI70Txg1fTB";;analytics.SNIPPET_VERSION="4.15.3";
+                    analytics.load("qaTU0wG6VH6xPAhOzD2kneI70Txg1fTB");
+                    analytics.page();
+                    }}();`
+      head.appendChild(script);
+    } 
+  }
 
-      });
-    } catch (err) {
-      this.logger.error('Event:Signed In [identify] error', err);
-    }
-    // Segments
-    try {
-      window['analytics'].track('Signed In', {
-        "username": user.firstname + ' ' + user.lastname,
-        "userId": user.uid
-      });
-    } catch (err) {
-      this.logger.error('Event:Signed In [track] error', err);
+  private segmentSignIn(){
+    let user = this.tiledeskAuthService.getCurrentUser()
+    if(window['analytics']){
+      try {
+        window['analytics'].page("Chat Auth Page, Signin", {});
+      } catch (err) {
+        this.logger.error('Event:Signed In [page] error', err);
+      }
+  
+      try {
+        window['analytics'].identify(user.uid, {
+          name: user.firstname + ' ' + user.lastname,
+          email: user.email,
+          logins: 5,
+  
+        });
+      } catch (err) {
+        this.logger.error('Event:Signed In [identify] error', err);
+      }
+      // Segments
+      try {
+        window['analytics'].track('Signed In', {
+          "username": user.firstname + ' ' + user.lastname,
+          "userId": user.uid
+        });
+      } catch (err) {
+        this.logger.error('Event:Signed In [track] error', err);
+      }
     }
   }
 
 
   private segmentSignedOut(){
-    let user = this.tiledeskAuthService.getCurrentUser();
-    try {
-      window['analytics'].page("Chat Auth Page, Signed Out", {});
-    } catch (err) {
-      this.logger.error('Event:Signed Out [page] error', err);
-    }
-
-    try {
-      window['analytics'].identify(user.uid, {
-        name: user.firstname + ' ' + user.lastname,
-        email: user.email,
-        logins: 5,
-
-      });
-    } catch (err) {
-      this.logger.error('Event:Signed Out [identify] error', err);
-    }
-
-    try {
-      window['analytics'].track('Signed Out', {
-        "username": user.firstname + ' ' + user.lastname,
-        "userId": user.uid
-      });
-    } catch (err) {
-      this.logger.error('Event:Signed Out [track] error', err);
-    }
-
-    try {
-      // setTimeout(() => {
-      window['analytics'].reset()
-      // }, 0);
-    } catch (err) {
-      this.logger.error('Event:reset error', err);
+    let user = this.tiledeskAuthService.getCurrentUser()
+    if(window['analytics']){
+      try {
+        window['analytics'].page("Chat Auth Page, Signed Out", {});
+      } catch (err) {
+        this.logger.error('Event:Signed Out [page] error', err);
+      }
+  
+      try {
+        window['analytics'].identify(user.uid, {
+          name: user.firstname + ' ' + user.lastname,
+          email: user.email,
+          logins: 5,
+  
+        });
+      } catch (err) {
+        this.logger.error('Event:Signed Out [identify] error', err);
+      }
+  
+      try {
+        window['analytics'].track('Signed Out', {
+          "username": user.firstname + ' ' + user.lastname,
+          "userId": user.uid
+        });
+      } catch (err) {
+        this.logger.error('Event:Signed Out [track] error', err);
+      }
+  
+      try {
+        // setTimeout(() => {
+        window['analytics'].reset()
+        // }, 0);
+      } catch (err) {
+        this.logger.error('Event:reset error', err);
+      }
     }
   }
 
   private segmentResolved(conversation: ConversationModel){
     let user = this.tiledeskAuthService.getCurrentUser();
-    try {
-      window['analytics'].page("Chat List Conversations Page, Chat Resolved", {});
-    } catch (err) {
-      this.logger.error('Event:Chat Resolved [page] error', err);
-    }
-
-    try {
-      window['analytics'].identify(user.uid, {
-        name: user.firstname + ' ' + user.lastname,
-        email: user.email,
-        logins: 5,
-
-      });
-    } catch (err) {
-      this.logger.error('Event:Chat Resolved [identify] error', err);
-    }
-
-    try {
-      window['analytics'].track('Chat Resolved', {
-        "username": user.firstname + ' ' + user.lastname,
-        "userId": user.uid,
-        "conversation_id": conversation.uid,
-        "channel_type": conversation.channel_type,
-        "conversation_with":(conversation.channel_type !== TYPE_DIRECT)? null: conversation.conversation_with,
-        "department_name":(conversation.channel_type !== TYPE_DIRECT)? conversation.attributes.departmentName: null,
-        "department_id":(conversation.channel_type !== TYPE_DIRECT)? conversation.attributes.departmentId: null
-      },
-      { "context": {
-          "groupId": (conversation.channel_type !== TYPE_DIRECT)? conversation.attributes.projectId: null
-        }
-      });
-    } catch (err) {
-      this.logger.error('Event:Chat Resolved [track] error', err);
-    }
-
-    if(conversation.channel_type !== TYPE_DIRECT){
+    if(window['analytics']){
+      try {
+        window['analytics'].page("Chat List Conversations Page, Chat Resolved", {});
+      } catch (err) {
+        this.logger.error('Event:Chat Resolved [page] error', err);
+      }
+  
+      try {
+        window['analytics'].identify(user.uid, {
+          name: user.firstname + ' ' + user.lastname,
+          email: user.email,
+          logins: 5,
+  
+        });
+      } catch (err) {
+        this.logger.error('Event:Chat Resolved [identify] error', err);
+      }
+  
       try {
-        window['analytics'].group(conversation.attributes.projectId, {
-          name: (conversation.attributes.project_name)? conversation.attributes.project_name : null,
-          // plan: projectProfileName,
+        window['analytics'].track('Chat Resolved', {
+          "username": user.firstname + ' ' + user.lastname,
+          "userId": user.uid,
+          "conversation_id": conversation.uid,
+          "channel_type": conversation.channel_type,
+          "conversation_with":(conversation.channel_type !== TYPE_DIRECT)? null: conversation.conversation_with,
+          "department_name":(conversation.channel_type !== TYPE_DIRECT)? conversation.attributes.departmentName: null,
+          "department_id":(conversation.channel_type !== TYPE_DIRECT)? conversation.attributes.departmentId: null
+        },
+        { "context": {
+            "groupId": (conversation.channel_type !== TYPE_DIRECT)? conversation.attributes.projectId: null
+          }
         });
       } catch (err) {
-        this.logger.error('Event:Chat Resolved [group] error', err);
+        this.logger.error('Event:Chat Resolved [track] error', err);
+      }
+  
+      if(conversation.channel_type !== TYPE_DIRECT){
+        try {
+          window['analytics'].group(conversation.attributes.projectId, {
+            name: (conversation.attributes.project_name)? conversation.attributes.project_name : null,
+            // plan: projectProfileName,
+          });
+        } catch (err) {
+          this.logger.error('Event:Chat Resolved [group] error', err);
+        }
       }
     }
   }
 
+
   @HostListener('document:visibilitychange', [])
   visibilitychange() {
     // this.logger.debug("document TITLE", document.hidden, document.title);
@@ -1447,5 +1543,26 @@ export class AppComponent implements OnInit {
       this.isSoundEnabled = event.newValue === 'enabled'? true: false
     }
   }
+
+
+  // @HostListener('mouseenter', ['$event']) 
+  // onMouseEnter(event: any) {
+  //   console.log('HostListener onMouseEnter-->', event)
+  // }
+
+  // @HostListener('mouseleave', ['$event']) 
+  // onMouseLeave(event: any) {
+  //   console.log('HostListener onMouseLeave-->', event)
+  // }
+
+  // @HostListener('focus', ['$event']) 
+  // onFocus(event: any) {
+  //   console.log('HostListener onFocus-->', event)
+  // }
+
+  // @HostListener('blur', ['$event']) 
+  // onBlur(event: any) {
+  //   console.log('HostListener onBlur-->', event)
+  // }
 }
 

package/src/app/app.module.ts

@@ -1,3 +1,5 @@
+import { SendEmailModal } from './modals/send-email/send-email.page';
+import { ConvertRequestToConversation } from './../chat21-core/utils/convertRequestToConversation';
 import { LogLevel, PUSH_ENGINE_FIREBASE, PUSH_ENGINE_MQTT } from './../chat21-core/utils/constants';
 import { CustomLogger } from 'src/chat21-core/providers/logger/customLogger';
 import { NgModule, ErrorHandler, APP_INITIALIZER } from '@angular/core';
@@ -81,10 +83,10 @@ import { AppStorageService } from 'src/chat21-core/providers/abstract/app-storag
 import { ConversationListPageModule } from './pages/conversations-list/conversations-list.module';
 import { ConversationDetailPageModule } from './pages/conversation-detail/conversation-detail.module';
 import { LoginPageModule } from './pages/authentication/login/login.module';
-import { LoaderPreviewPageModule } from './pages/loader-preview/loader-preview.module';
+import { LoaderPreviewPageModule } from './modals/loader-preview/loader-preview.module';
 import { CreateTicketPageModule } from './pages/create-ticket/create-ticket.module';
 import { CreateRequesterPageModule } from './pages/create-requester/create-requester.module';
-import { CreateCannedResponsePageModule } from './pages/create-canned-response/create-canned-response.module';
+import { CreateCannedResponsePageModule } from './modals/create-canned-response/create-canned-response.module';
 // UTILS
 import { ScrollbarThemeModule } from './utils/scrollbar-theme.directive';
 import { SharedModule } from 'src/app/shared/shared.module';
@@ -101,6 +103,7 @@ import { ConnectionService } from 'ng-connection-service';
 import { WebSocketJs } from './services/websocket/websocket-js';
 import { UnassignedConversationsPageModule } from './pages/unassigned-conversations/unassigned-conversations.module';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { SendEmailModalModule } from './modals/send-email/send-email.module';
 
 // FACTORIES
 export function createTranslateLoader(http: HttpClient) {
@@ -287,6 +290,7 @@ const appInitializerFn = (appConfig: AppConfigProvider, logger: NGXLogger) => {
     ConversationInfoModule,
     NgxLinkifyjsModule.forRoot(),
     LoaderPreviewPageModule,
+    SendEmailModalModule,
     CreateTicketPageModule,
     CreateRequesterPageModule,
     CreateCannedResponsePageModule
@@ -369,7 +373,8 @@ const appInitializerFn = (appConfig: AppConfigProvider, logger: NGXLogger) => {
     EventsService,
     Chooser,
     Chat21Service,
-    WebSocketJs
+    WebSocketJs,
+    ConvertRequestToConversation
   ]
 })
 export class AppModule { }

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

@@ -17,11 +17,18 @@ export class ConversationContentComponent implements OnInit {
   @Input() messages: MessageModel[]
   @Input() senderId: string;
   @Input() baseLocation: string;
+  @Input() isConversationArchived: boolean;
+  @Input() isTypings: boolean;
+  @Input() idUserTypingNow: string;
+  @Input() nameUserTypingNow: string;
+  @Input() typingLocation: string;
+  @Input() fullscreenMode: boolean;
   @Input() translationMap: Map<string, string>;
   @Input() stylesMap: Map<string, string>;
   @Output() onBeforeMessageRender = new EventEmitter();
   @Output() onAfterMessageRender = new EventEmitter();
-  @Output() onMenuOptionShow = new EventEmitter();
+  @Output() onMenuOptionShow = new EventEmitter<boolean>();
+  @Output() onEmojiiPickerShow = new EventEmitter<boolean>()
   @Output() onAttachmentButtonClicked = new EventEmitter();
   @Output() onScrollContent = new EventEmitter();