@chat21/chat21-ionic 3.0.105 → 3.0.107-rc.1

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # chat21-ionic ver 3.0
 
+### 3.0.107.rc.1
+- added: globals and globals-settings services to manage env and option variables globally
+- added: eventTrigger service to expose custom chat event to parent chat-iframe container
+- added: new UI home management for supportMode
+- bug-fixed: privateMsg colors not visible
+
+### 3.0.106 in PROD
+- changed: testsitebaseurl with widgetBaseUrl
+- changed: WIDGET_TEST_LOCATION with WIDGET_LOCATION
+
 ### 3.0.105 in PROD
 
 ### 3.0.105.rc.1

package/README.md

@@ -102,7 +102,7 @@ Use [Docker Compose Tiledesk installation guide](https://github.com/Tiledesk/til
         "apiUrl": "https://<YOUR-TILEDESK-API-URL>",
         "baseImageUrl": "https://<YOUR-BASE-IMAGE-URL>",
         "dashboardUrl": "https://<YOUR-DASHBOARD-URL>"
-        "testsiteBaseUrl": "https:<YOUR-WIDGET-URL>/test_widget_page/index.html"
+        "widgetBaseUrl": "https:<YOUR-WIDGET-URL>/"
         "wsUrl": 'ws://' + window.location.hostname + '/ws/',
         "emailSection": true,
         "whatsappTemplatesSection": true,

package/package.json

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

package/src/app/app.component.html

@@ -7,28 +7,33 @@
 
 
     <app-navbar *ngIf="!IS_ON_MOBILE_DEVICE && lang"
+      [ngClass]="{'sidebar-hidden':  IS_ON_MOBILE_DEVICE || SUPPORT_MODE === false }"
       [isSoundEnabled]="isSoundEnabled"
       (onSoundChange)="onSoundChange($event)">
     </app-navbar>
 
-    <div class="sidebar" [ngClass]="{'hide-sidebar': IS_ONLINE === false || IS_ON_MOBILE_DEVICE === true || SUPPORT_MODE === false}">
+    <app-sidebar class="sidebar"
+      [ngClass]="{'sidebar-hidden': IS_ONLINE === false || IS_ON_MOBILE_DEVICE || SUPPORT_MODE === false}">
+    </app-sidebar>
+
+    <!-- <div class="sidebar" [ngClass]="{'hide-sidebar': IS_ONLINE === false || IS_ON_MOBILE_DEVICE === true || SUPPORT_MODE === false}">
       <app-sidebar></app-sidebar>
-    </div>
+    </div> -->
     
-    <div class="user-details-sidebar" [ngClass]="{'hide-sidebar': IS_ONLINE === false || IS_ON_MOBILE_DEVICE === true || SUPPORT_MODE === false}">
+    <div class="user-details-sidebar" [ngClass]="{'hide-sidebar': IS_ONLINE === false || IS_ON_MOBILE_DEVICE || SUPPORT_MODE === false}">
       <app-sidebar-user-details> </app-sidebar-user-details>
     </div>
  
-    <ion-split-pane when="md" contentId="main" [ngClass]="{'mobile': IS_ON_MOBILE_DEVICE}">
+    <ion-split-pane when="md" contentId="main" [ngClass]="{'mobile': IS_ON_MOBILE_DEVICE, 'sidebar-hidden': IS_ON_MOBILE_DEVICE || SUPPORT_MODE === false}">
       <!-- 'sidebar-visible': IS_ONLINE === true && SUPPORT_MODE === true, -->
-      <ion-nav #sidebarNav [root]="sidebarPage" [ngClass]="{'sidebar-hidden': IS_ON_MOBILE_DEVICE === true || SUPPORT_MODE === false}"></ion-nav>
+      <ion-nav #sidebarNav [root]="sidebarPage"></ion-nav>
       <!--  our side menu  -->
       <!-- <ion-router-outlet id="sidebar" name='sidebar' animated="false" #masterNav> -->
       <!-- <app-conversations-list></app-conversations-list> -->
       <!-- </ion-router-outlet> -->
       <!-- the main content -->
       <!--  -->
-      <ion-router-outlet id="main" #detailNav animated="false" [ngClass]="{'router-outlet-margin-left': platformIs === 'mobile' &&  SUPPORT_MODE === true && IS_ON_MOBILE_DEVICE === false}">
+      <ion-router-outlet id="main" #detailNav animated="false">
       </ion-router-outlet>
     </ion-split-pane>
   </div>

package/src/app/app.component.scss

@@ -3,29 +3,52 @@
 .split-pane-md.split-pane-visible > .split-pane-side {
     min-width: 320px; //360px; //312px;
     display: block; // Safari bug fix
-    margin-left: var(--sidebar-width);
     --border: 0px;
-    background-color: var(--list-bkg-color);
+    // background-color: var(--list-bkg-color);
 }
 
-.split-pane-md:not(.mobile){
+// .split-pane-md:not(.mobile){
+//     height: calc( 100% - var(--nav-bar-heigth));
+//     margin-top: var(--nav-bar-heigth);
+// }
+
+ion-split-pane:not(.mobile) {
     height: calc( 100% - var(--nav-bar-heigth));
     margin-top: var(--nav-bar-heigth);
+    margin-left: var(--sidebar-width);
+    // display: block; // Safari bug fix
+    // --border: 0px;
+    background-color: var(--list-bkg-color);
+    &.sidebar-hidden{
+        margin-left: 0px;
+        margin-top: 0px;
+        height: 100%;
+    }
 }
 
-
-.navbar{
-    display: flex;
-    position: fixed;
+app-navbar{
+    position: absolute;
     top: 0px;
+    width: calc(100%  - var(--sidebar-width));
+    margin-left: var(--sidebar-width);
+
+    &.sidebar-hidden{
+        width: 100%;
+        margin-left: 0px;
+    }
 }
 
-.sidebar-visible {
-    margin-left: 60px;
+app-sidebar{
+    &.sidebar-hidden{
+        display: none;
+    }
 }
 
-.sidebar-hidden {
-    margin-left: 0px !important;
+
+.navbar{
+    display: flex;
+    position: fixed;
+    top: 0px;
 }
 
 .hide-sidebar {

package/src/app/app.component.ts

@@ -1,4 +1,4 @@
-import { Component, HostListener, NgZone, OnInit, ViewChild } from '@angular/core';
+import { Component, ElementRef, HostListener, NgZone, OnInit, ViewChild } from '@angular/core';
 
 import { AlertController, Config, IonNav, IonRouterOutlet, ModalController, NavController, Platform, ToastController } from '@ionic/angular';
 import { SplashScreen } from '@ionic-native/splash-screen/ngx';
@@ -37,6 +37,9 @@ import { ConversationListPage } from './pages/conversations-list/conversations-l
 import { Location } from '@angular/common'
 import { FCM } from 'cordova-plugin-fcm-with-dependecy-updated/ionic/ngx'
 import { Deeplinks } from '@ionic-native/deeplinks/ngx';
+import { TriggerEvents } from './services/triggerEvents/triggerEvents';
+import { Globals } from './utils/globals';
+import { GlobalSettingsService } from './services/global-settings/global-settings.service';
 
 @Component({
   selector: 'app-root',
@@ -98,6 +101,7 @@ export class AppComponent implements OnInit {
     private deeplinks: Deeplinks,
     private appConfigProvider: AppConfigProvider,
     public events: EventsService,
+    public triggerEvents: TriggerEvents,
     public config: Config,
     public chatManager: ChatManager,
     public translate: TranslateService,
@@ -129,7 +133,10 @@ export class AppComponent implements OnInit {
     public webSocketJs: WebSocketJs,
     public scriptService: ScriptService,
     public location: Location,
-    public fcm: FCM
+    public fcm: FCM,
+    public el: ElementRef,
+    public g: Globals,
+    public globalSettingsService: GlobalSettingsService,
   ) {
 
     this.saveInStorageNumberOfOpenedChatTab();
@@ -261,19 +268,34 @@ export class AppComponent implements OnInit {
   ngOnInit(): void {
     const appconfig = this.appConfigProvider.getConfig();
     this.logger.log('[APP-COMP] ngOnInit  appconfig', appconfig)
-    if (appconfig && appconfig.supportMode && (appconfig.supportMode === true || appconfig.supportMode === 'true')) {
-      this.SUPPORT_MODE = true;
-      this.logger.log('[APP-COMP] appconfig > SUPPORT_MODE', this.SUPPORT_MODE)
-    } else {
-      this.SUPPORT_MODE = false;
-      this.logger.log('[APP-COMP] appconfig > SUPPORT_MODE', this.SUPPORT_MODE)
-    }
-    this.persistence = appconfig.authPersistence;
-    this.appStorageService.initialize(environment.storage_prefix, this.persistence, '')
-    // this.logger.log('[APP-COMP] HELLO ngOnInit !!!!!!!')
-    // this.logger.log('[APP-COMP] ngOnInit this.route.snapshot.params -->', this.route.snapshot.params);
-    // this.initializeApp('oninit');
-    const token = getParameterByName('jwt')
+
+    this.globalSettingsService.obsSettingsService.subscribe((resp) => {
+      if(resp){
+        this.logger.log('[APP-COMP] ngOnInit  globalSettingsService', this.g)
+        // /** INIT  */
+        // this.getRouteParamsAndSetLoggerConfig();
+  
+        // this.logger.info('[APP-COMP] appconfig: ', appconfig)
+        this.version = environment.version;
+     
+        this.logger.setLoggerConfig(true, this.g.logLevel)
+        this.logger.info('[APP-COMP] logLevel: ', this.g.logLevel);
+        this.tabTitle = document.title;
+        // this.appStorageService.initialize(environment.storage_prefix, this.persistence, '') /** moved to globals-settings.service */
+    
+        this.tenant = this.g.tenant;
+        this.persistence = this.g.persistence
+        this.logger.info('[APP-COMP] appconfig firebaseConfig tenant: ', this.tenant);
+        this.notificationsEnabled = true;
+        this.zone = new NgZone({}); // a cosa serve?
+
+        this.SUPPORT_MODE = this.g.supportMode
+      }
+
+    });
+    this.globalSettingsService.initParamiters(this.g, this.el);
+    
+    const token = getParameterByName(window,'jwt')
     // this.logger.log('[APP-COMP] ngOnInit AUTOLOGIN token get with getParameterByName -->', token);
     if (token) {
       // this.isOnline = false;
@@ -291,6 +313,7 @@ export class AppComponent implements OnInit {
       }
     }
 
+    this.triggerEvents.setWindowContext(window.parent)
 
     this.initializeApp('oninit');
     this.loadCustomScript(appconfig)
@@ -397,22 +420,6 @@ export class AppComponent implements OnInit {
     if (!this.platform.is('desktop')) {
       this.splashScreen.show();
     }
-    this.tabTitle = document.title;
-
-    this.getRouteParamsAndSetLoggerConfig();
-
-    const appconfig = this.appConfigProvider.getConfig();
-    // this.logger.info('[APP-COMP] appconfig: ', appconfig)
-    this.version = environment.version;
-    this.logger.info('[APP-COMP] version: ', this.version)
-
-    this.logger.setLoggerConfig(true, appconfig.logLevel)
-    this.logger.info('[APP-COMP] logLevel: ', appconfig.logLevel);
-
-    this.tenant = appconfig.firebaseConfig.tenant;
-    this.logger.info('[APP-COMP] appconfig firebaseConfig tenant: ', this.tenant);
-    this.notificationsEnabled = true;
-    this.zone = new NgZone({}); // a cosa serve?
 
     this.platform.ready().then(() => {
       let platform = this.getPlatformName();
@@ -445,7 +452,6 @@ export class AppComponent implements OnInit {
       this.initAuthentication();
       this.initSubscriptions();
       this.initAudio();
-
       this.logger.debug('[APP-COMP] initializeApp:: ', this.sidebarNav, this.detailNav);
 
       this.translateToastMsgs();
@@ -978,12 +984,14 @@ export class AppComponent implements OnInit {
           this.IS_ONLINE = true;
           // console.log('[APP-COMP] IS_ONLINE', this.IS_ONLINE)
           this.goOnLine();
+          this.triggerOnAuthStateChanged(state)
           // }
         } else if (state === AUTH_STATE_OFFLINE) {
           // this.checkTokenAndGoOffline() //se c'è un tiledeskToken salvato, allora aspetta, altrimenti vai offline
           this.IS_ONLINE = false;
           // console.log('[APP-COMP] IS_ONLINE', this.IS_ONLINE)
           this.goOffLine()
+          this.triggerOnAuthStateChanged(state)
         }
       }, error => {
         this.logger.error('initialize FROM [APP-COMP] - [APP-COMP] ***** BSAuthStateChanged * error * ', error)
@@ -1095,9 +1103,7 @@ export class AppComponent implements OnInit {
   goOffLine = () => {
     this.logger.log('[APP-COMP] - GO-OFFLINE');
     this.logger.log('[APP-COMP] - GO-OFFINE - supportmode ', this.SUPPORT_MODE);
-    if (this.SUPPORT_MODE === true) {
-      this.webSocketClose()
-    }
+    this.webSocketClose()
     // this.isOnline = false;
     // this.conversationsHandlerService.conversations = [];
     this.chatManager.setTiledeskToken(null);
@@ -1571,6 +1577,12 @@ export class AppComponent implements OnInit {
   }
 
 
+  private triggerOnAuthStateChanged(event){
+    const detailOBJ = { event: event, isLogged: true, user: this.tiledeskAuthService.getCurrentUser() , appConfigs: this.appConfigProvider.getConfig() }
+    this.triggerEvents.triggerOnAuthStateChanged(detailOBJ)
+  }
+
+
   // @HostListener('mouseenter', ['$event']) 
   // onMouseEnter(event: any) {
   //   console.log('HostListener onMouseEnter-->', event)

package/src/app/app.module.ts

@@ -114,6 +114,9 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { MapsPageModule } from './modals/maps/maps.module';
 import { GoogleMapsModule } from '@angular/google-maps';
 import { Deeplinks } from '@ionic-native/deeplinks/ngx';
+import { TriggerEvents } from './services/triggerEvents/triggerEvents';
+import { Globals } from './utils/globals';
+import { GlobalSettingsService } from './services/global-settings/global-settings.service';
 
 // FACTORIES
 export function createTranslateLoader(http: HttpClient) {
@@ -314,6 +317,8 @@ const appInitializerFn = (appConfig: AppConfigProvider, logger: NGXLogger) => {
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
   providers: [
     AppConfigProvider, // https://juristr.com/blog/2018/01/ng-app-runtime-config/
+    Globals,
+    GlobalSettingsService,
     {
       provide: APP_INITIALIZER,
       useFactory: appInitializerFn,
@@ -393,7 +398,8 @@ const appInitializerFn = (appConfig: AppConfigProvider, logger: NGXLogger) => {
     ScriptService,
     FCM,
     InAppBrowser,
-    Deeplinks
+    Deeplinks,
+    TriggerEvents
   ]
 })
 export class AppModule { }

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

@@ -1,6 +1,5 @@
 import { ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChild, SimpleChanges } from '@angular/core';
 import { MessageModel } from 'src/chat21-core/models/message';
-import { isPopupUrl, popupUrl, stripTags } from 'src/chat21-core/utils/utils';
 import { MSG_STATUS_SENT, MSG_STATUS_RETURN_RECEIPT, MSG_STATUS_SENT_SERVER, MAX_WIDTH_IMAGES, MESSAGE_TYPE_INFO, MESSAGE_TYPE_MINE, MESSAGE_TYPE_OTHERS } from 'src/chat21-core/utils/constants';
 import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
@@ -40,10 +39,6 @@ export class ConversationContentComponent implements OnInit {
   firstScroll = true;
   // ========= end:: gestione scroll view messaggi ======= //
 
-  // ========= begin:: dichiarazione funzioni ======= //
-  isPopupUrl = isPopupUrl;
-  popupUrl = popupUrl;
-  // ========= end:: dichiarazione funzioni ======= //
 
   // ========== begin:: set icon status message ======= //
   MSG_STATUS_SENT = MSG_STATUS_SENT;

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

@@ -162,7 +162,6 @@
       </chat-avatar-image> -->
 
       <div class="bubble-container">
-        
         <!--backgroundColor non viene ancora usato -->
         <chat-bubble-message class="messages msg_receive" id="message_msg_receive"
           [ngClass]="{'has-metadata': (isImage(message) || isFrame(message)), 'privateMsg': (message?.attributes && message?.attributes?.subtype === 'private')}" 

package/src/app/chatlib/conversation-detail/ion-conversation-detail/ion-conversation-detail.component.scss

@@ -222,8 +222,8 @@ ion-item {
         border-bottom-right-radius: 0px;
 
         &.privateMsg{
-            background-color: var(--bubble-privateMsg);
-            color: var(--bubble-privateMsgColor)
+            background-color: var(--bubble-privateMsg) !important;
+            color: var(--bubble-privateMsgColor) !important;
         }
     }
     .no-background{
@@ -324,8 +324,8 @@ ion-item {
         border-bottom-left-radius: 0px;
 
         &.privateMsg{
-            background-color: var(--bubble-privateMsg);
-            color: var(--bubble-privateMsgColor)
+            background-color: var(--bubble-privateMsg) !important;
+            color: var(--bubble-privateMsgColor) !important;
         }
     }
     .no-background{

package/src/app/components/conversations-list/header-conversations-list/header-conversations-list.component.html

@@ -1,6 +1,6 @@
 <ion-toolbar [class.mobile]="isMobile">
 
-  <ion-buttons *ngIf="isMobile || supportMode === false" slot="start" style="height:60px">
+  <ion-buttons *ngIf="isMobile || !supportMode" slot="start" style="height:60px">
     <ion-button ion-button icon-only fill="clear" (click)="onOpenProfileInfo($event)">
       <ion-icon slot="icon-only" name="reorder-three-outline"></ion-icon>
     </ion-button>
@@ -22,8 +22,7 @@
   </ion-buttons>
 
   <ion-buttons slot="end">
-    
-    <ion-button *ngIf="!isMobile" ion-button fill="clear" (click)="presentCreateTicketModal()"
+    <ion-button *ngIf="!isMobile && supportMode" ion-button fill="clear" (click)="presentCreateTicketModal()"
       tooltip="{{translationMap?.get('CreateTicket')}}" placement="bottom">
       <ion-icon slot="icon-only" name="ticket-outline"></ion-icon>
     </ion-button>

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

@@ -1,13 +1,8 @@
 .navbar-absolute{
-    position: absolute;
-    width: calc(100%  - var(--sidebar-width));
-    margin-left: var(--sidebar-width);
     padding-top: 5px;
     z-index: 1;
     padding-bottom: 5px;
     border-bottom: 1px solid #e7e7e7;
-    top: 0;
-
     -webkit-font-smoothing: auto;
 }
 

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

@@ -159,7 +159,7 @@ export class NavbarComponent implements OnInit {
     const simulateVisitorBtnElem = <HTMLElement>document.querySelector('.simulate-visitor-btn');
     simulateVisitorBtnElem.blur();
     // + '&isOpen=true'
-    const url = this.appConfigProvider.getConfig().testsiteBaseUrl + '?tiledesk_projectid=' + this.project.id_project.id + '&project_name=' + this.project.id_project.name + '&role=' + this.USER_ROLE
+    const url = this.appConfigProvider.getConfig().widgetBaseUrl + 'assets/twp/index.html?tiledesk_projectid=' + this.project.id_project.id + '&project_name=' + this.project.id_project.name + '&role=' + this.USER_ROLE
     window.open(url, '_blank');
   }
 

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

@@ -46,7 +46,7 @@ import { ArchivedConversationsHandlerService } from 'src/chat21-core/providers/a
 import { ConversationHandlerService } from 'src/chat21-core/providers/abstract/conversation-handler.service'
 import { ContactsService } from 'src/app/services/contacts/contacts.service'
 import { CannedResponsesService } from '../../services/canned-responses/canned-responses.service'
-import { compareValues, getDateDifference, htmlEntities } from 'src/chat21-core/utils/utils'
+import {getDateDifference} from 'src/chat21-core/utils/utils'
 import { ImageRepoService } from 'src/chat21-core/providers/abstract/image-repo.service'
 import { PresenceService } from 'src/chat21-core/providers/abstract/presence.service'
 import { CreateCannedResponsePage } from 'src/app/modals/create-canned-response/create-canned-response.page'
@@ -89,6 +89,9 @@ import { EventsService } from '../../services/events-service'
 import { ScrollbarThemeDirective } from 'src/app/utils/scrollbar-theme.directive'
 import { WebsocketService } from 'src/app/services/websocket/websocket.service';
 import { Project } from 'src/chat21-core/models/projects';
+import { AppStorageService } from 'src/chat21-core/providers/abstract/app-storage.service';
+import { Globals } from 'src/app/utils/globals';
+import { TriggerEvents } from 'src/app/services/triggerEvents/triggerEvents';
 
 @Component({
   selector: 'app-conversation-detail',
@@ -238,7 +241,9 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     private networkService: NetworkService,
     private events: EventsService,
     private webSocketService: WebsocketService,
-    private sanitizer: DomSanitizer
+    private sanitizer: DomSanitizer,
+    private g: Globals,
+    private triggerEvents: TriggerEvents
   ) {
     // Change list on date change
     this.route.paramMap.subscribe((params) => {
@@ -361,14 +366,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   }
 
   getOSCODE() {
-    this.supportMode = null
-    if (this.appConfigProvider.getConfig().supportMode === true || this.appConfigProvider.getConfig().supportMode === 'true') {
-      this.supportMode = true
-    } else if (this.appConfigProvider.getConfig().supportMode === false || this.appConfigProvider.getConfig().supportMode === 'false') {
-      this.supportMode = false
-    } else if (!this.appConfigProvider.getConfig().supportMode) {
-      this.supportMode = false
-    }
+    this.supportMode = this.g.supportMode
     this.logger.log('[CONVS-DETAIL] AppConfigService getAppConfig supportMode', this.supportMode)
     this.public_Key = this.appConfigProvider.getConfig().t2y12PruGU9wUtEGzBJfolMIgK
     this.logger.log('[CONVS-DETAIL] AppConfigService getAppConfig public_Key', this.public_Key)
@@ -1178,10 +1176,11 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     subscriptionKey = 'messageAdded'
     subscription = this.subscriptions.find((item) => item.key === subscriptionKey)
     if (!subscription) {
-      subscription = this.conversationHandlerService.messageAdded.subscribe((msg: any) => {
+      subscription = this.conversationHandlerService.messageAdded.subscribe((msg: MessageModel) => {
         this.logger.log('[CONVS-DETAIL] subscribe to messageAdded - msg ', msg)
         if (msg) {
           that.newMessageAdded(msg)
+          that.manageEvent(msg)
           // this.setHeaderContent()
         }
       })
@@ -1193,7 +1192,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     subscriptionKey = 'messageChanged'
     subscription = this.subscriptions.find((item) => item.key === subscriptionKey)
     if (!subscription) {
-      subscription = this.conversationHandlerService.messageChanged.subscribe((msg: any) => {
+      subscription = this.conversationHandlerService.messageChanged.subscribe((msg: MessageModel) => {
         this.logger.log('[CONVS-DETAIL] subscribe to messageChanged - msg ', msg)
       })
       const subscribe = { key: subscriptionKey, value: subscription }
@@ -1213,7 +1212,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     subscriptionKey = 'messageInfo'
     subscription = this.subscriptions.find((item) => item.key === subscriptionKey)
     if (!subscription) {
-      subscription = this.conversationHandlerService.messageInfo.pipe(takeUntil(this.unsubscribe$)).subscribe((msg: any) => {
+      subscription = this.conversationHandlerService.messageInfo.pipe(takeUntil(this.unsubscribe$)).subscribe((msg: MessageModel) => {
         this.logger.log('[CONVS-DETAIL] subscribe to messageInfo - messageId ', msg, this.conversation)
         if (msg) {
           that.updateLeadInfo(msg)
@@ -1337,6 +1336,14 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     }
   }
 
+  manageEvent(msg: MessageModel){
+    if(msg.isSender){
+      this.triggerEvents.triggerAfterSendMessageEvent(msg)
+    }else if(!msg.isSender){
+      this.triggerEvents.triggerAfterMessageReceived(msg)
+    }
+  }
+
   // ----------------------------------------------------------------
   // @ Unsubscribe all subscribed events (called in ionViewWillLeave)
   // ----------------------------------------------------------------

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

@@ -18,8 +18,7 @@ import {
   closeModal,
   convertMessage,
   isGroup,
-  searchIndexInArrayForUid,
-  compareValues,
+  getParameterValue,
 } from '../../../chat21-core/utils/utils'
 
 import { EventsService } from '../../services/events-service'
@@ -49,6 +48,8 @@ import { skip, takeUntil } from 'rxjs/operators'
 import { REQUEST_ARCHIVED, TYPE_DIRECT } from 'src/chat21-core/utils/constants';
 import { getProjectIdSelectedConversation } from 'src/chat21-core/utils/utils-message';
 import { WebsocketService } from 'src/app/services/websocket/websocket.service';
+import { Globals } from 'src/app/utils/globals';
+import { TriggerEvents } from 'src/app/services/triggerEvents/triggerEvents';
 
 @Component({
   selector: 'app-conversations-list',
@@ -127,6 +128,8 @@ export class ConversationListPage implements OnInit {
     public appConfigProvider: AppConfigProvider,
     public platform: Platform,
     public wsService: WebsocketService,
+    private g: Globals,
+    private triggerEvents: TriggerEvents
   ) {
     this.checkPlatform();
     this.translations();
@@ -216,24 +219,10 @@ export class ConversationListPage implements OnInit {
   getAppConfigToHideDiplayBtns() {
     const appConfig = this.appConfigProvider.getConfig()
     // console.log('[CONVS-LIST-PAGE] - appConfig ', appConfig)
-    this.supportMode = null
-    if (appConfig && appConfig.supportMode === true || appConfig.supportMode === 'true') {
-      this.supportMode = true;
-    } else if (appConfig && appConfig.supportMode === false || appConfig.supportMode === 'false') {
-      this.supportMode = false
-    }
-    this.archived_btn = null
-    if (appConfig && appConfig.archivedButton === true || appConfig.archivedButton === 'true') {
-      this.archived_btn = true;
-    } else if (appConfig && appConfig.archivedButton === false || appConfig.archivedButton === 'false') {
-      this.archived_btn = false;
-    }
-    this.writeto_btn = null
-    if (appConfig && appConfig.writeToButton === true || appConfig.writeToButton === 'true') {
-      this.writeto_btn = true;
-    } else if (appConfig && appConfig.writeToButton === false || appConfig.writeToButton === 'false') {
-      this.writeto_btn = false;
-    }
+    this.supportMode = this.g.supportMode;
+    this.archived_btn =  getParameterValue('archivedButton', appConfig)
+    this.writeto_btn =  getParameterValue('writeToButton', appConfig)
+    this.logger.debug('[CONVS-LIST-PAGE] parameters supportMode/archived_btn/writeto_btn', this.supportMode, this.archived_btn, this.writeto_btn)
 
 
     const sound_status = localStorage.getItem('dshbrd----sound')
@@ -583,6 +572,7 @@ export class ConversationListPage implements OnInit {
         if (conversation) {
           this.onImageLoaded(conversation)
           this.onConversationLoaded(conversation)
+          conversation.is_new && this.isInitialized? this.manageEvent(conversation) : null
           // conversation.is_new && this.isInitialized? this.segmentNewConversationAdded(conversation) : null;
         }
     })
@@ -657,6 +647,10 @@ export class ConversationListPage implements OnInit {
     // }
   }
 
+  manageEvent(conversation){
+    this.triggerEvents.triggerOnNewConversationInit(conversation)
+  }
+
   // ------------------------------------------------------------------//
   // END SUBSCRIPTIONS
   // ------------------------------------------------------------------//

package/src/app/services/global-settings/global-settings.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { GlobalSettingsService } from './global-settings.service';
+
+describe('GlobalSettingsService', () => {
+  let service: GlobalSettingsService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(GlobalSettingsService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});