@chat21/chat21-ionic 2.0.14 → 3.0.5-8.1

package/src/app/app.component.ts

@@ -1,157 +1,893 @@
-import { Component, ViewChild, NgZone } from '@angular/core';
-import { Events, Platform, MenuController, Nav, AlertController } from 'ionic-angular';
-import * as firebase from 'firebase/app';
-import { ListaConversazioniPage } from '../pages/lista-conversazioni/lista-conversazioni';
-// import { StatusBar } from '@ionic-native/status-bar';
-// import { SplashScreen } from '@ionic-native/splash-screen';
+import { 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';
+
+import { Component, ViewChild, NgZone, OnInit, HostListener, ElementRef, Renderer2, } from '@angular/core';
+import { Config, Platform, IonRouterOutlet, IonSplitPane, NavController, MenuController, AlertController, IonNav, ToastController } from '@ionic/angular';
+import { ActivatedRoute, NavigationStart, Router } from '@angular/router';
+import { Subscription, VirtualTimeScheduler } from 'rxjs';
+import { ModalController } from '@ionic/angular';
+
+// import * as firebase from 'firebase/app';
+import firebase from "firebase/app";
+import 'firebase/auth'; // nk in watch connection status
+
 import { StatusBar } from '@ionic-native/status-bar/ngx';
 import { SplashScreen } from '@ionic-native/splash-screen/ngx';
-
-import { Config } from 'ionic-angular';
-import {NavProxyService} from '../providers/nav-proxy';
-//import {PlaceholderPage} from '../pages/placeholder/placeholder';
-import { MessagingService } from '../providers/messaging-service';
-import { ChatManager } from '../providers/chat-manager/chat-manager';
 import { TranslateService } from '@ngx-translate/core';
 
+// services
+import { AppConfigProvider } from './services/app-config';
+// import { UserService } from './services/user.service';
+// import { CurrentUserService } from './services/current-user/current-user.service';
+import { EventsService } from './services/events-service';
+import { MessagingAuthService } from '../chat21-core/providers/abstract/messagingAuth.service';
+import { PresenceService } from '../chat21-core/providers/abstract/presence.service';
+import { TypingService } from '../chat21-core/providers/abstract/typing.service';
+import { UploadService } from '../chat21-core/providers/abstract/upload.service';
+// import { ChatPresenceHandler} from './services/chat-presence-handler';
+import { NavProxyService } from './services/nav-proxy.service';
+import { ChatManager } from 'src/chat21-core/providers/chat-manager';
+// import { ChatConversationsHandler } from './services/chat-conversations-handler';
+import { ConversationsHandlerService } from 'src/chat21-core/providers/abstract/conversations-handler.service';
+import { CustomTranslateService } from 'src/chat21-core/providers/custom-translate.service';
+
+// pages
+import { LoginPage } from './pages/authentication/login/login.page';
+import { ConversationListPage } from './pages/conversations-list/conversations-list.page';
+
+// utils
+import { createExternalSidebar, checkPlatformIsMobile, isGroup, getParameterByName } 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 { AppConfigProvider } from '../providers/app-config/app-config';
+import { UserModel } from '../chat21-core/models/user';
+import { ConversationModel } from 'src/chat21-core/models/conversation';
+import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
+import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
+import { TiledeskAuthService } from 'src/chat21-core/providers/tiledesk/tiledesk-auth.service';
+// FCM
+import { NotificationsService } from 'src/chat21-core/providers/abstract/notifications.service';
+import { getImageUrlThumbFromFirebasestorage } from 'src/chat21-core/utils/utils-user';
+
+// import { Network } from '@ionic-native/network/ngx';
+// import { Observable, Observer, fromEvent, merge, of } from 'rxjs';
+// import { mapTo } from 'rxjs/operators';
+import { TiledeskService } from './services/tiledesk/tiledesk.service';
+import { NetworkService } from './services/network-service/network.service';
+import * as PACKAGE from 'package.json';
+
+import { Subject } from 'rxjs';
+import { filter, takeUntil } from 'rxjs/operators'
+
+// import { filter } from 'rxjs/operators';
 
 @Component({
-  templateUrl: 'app.html'
+  selector: 'app-root',
+  templateUrl: 'app.component.html',
+  styleUrls: ['app.component.scss']
 })
-export class MyApp {
-  // new branch v2.0
-  // Grab References to our 2 NavControllers...
-  @ViewChild('detailNav') detailNav: Nav;
-  @ViewChild('masterNav') masterNav: Nav;
-  // Empty placeholders for the 'master/detail' pages...
-  masterPage: any = null;
-  detailPage: any = null;
+
+export class AppComponent implements OnInit {
+  @ViewChild('sidebarNav', { static: false }) sidebarNav: IonNav;
+  @ViewChild('detailNav', { static: false }) detailNav: IonRouterOutlet;
+
+  // public appIsOnline$: Observable<boolean> = undefined;
+  checkInternet: boolean;
+
+  private BSAuthStateChangedSubscriptionRef: Subscription;
+  public sidebarPage: any;
+  public notificationsEnabled: boolean;
   public zone: NgZone;
-  public user:any;
-  pages: Array<{title: string, component: any}>;
-  isNavBar: string;
-  notificationsEnabled: boolean;
-  //firebaseConfig = environment.firebaseConfig;
-  
-  /**
-   * 1 - init firebase
-   * 2 - quando
-   * @param platform 
-   * @param menu 
-   * @param statusBar 
-   * @param splashScreen 
-   * @param config 
-   * @param navProxy 
-   * @param alertCtrl 
-   * @param msgService 
-   * @param chatManager 
-   */
+  private platformIs: string;
+  private doitResize: any;
+  private timeModalLogin: any;
+  public tenant: string;
+  public persistence: string;
+  public authModal: any;
+
+  private audio: any;
+  private setIntervalTime: any;
+  private setTimeoutSound: any;
+  private isTabVisible: boolean = true;
+  private tabTitle: string;
+  private logger: LoggerService = LoggerInstance.getInstance();
+  public toastMsgErrorWhileUnsubscribingFromNotifications: string;
+  public toastMsgCloseToast: string;
+  public toastMsgWaitingForNetwork: string;
+  private modalOpen: boolean = false;
+  private hadBeenCalledOpenModal: boolean = false;
+  public missingConnectionToast: any
+  public executedInitializeAppByWatchConnection: boolean = false;
+  private version: string;
+  private unsubscribe$: Subject<any> = new Subject<any>();
+  // private isOnline: boolean = false;
+
   constructor(
-    public platform: Platform,
-    public menu: MenuController,
-    public statusBar: StatusBar,
-    public splashScreen: SplashScreen,
+    private platform: Platform,
+    private splashScreen: SplashScreen,
+    private statusBar: StatusBar,
+    private appConfigProvider: AppConfigProvider,
+    private events: EventsService,
     public config: Config,
-    public events: Events,
-    private navProxy: NavProxyService,
-    public alertCtrl: AlertController,
-    public msgService: MessagingService,
     public chatManager: ChatManager,
     public translate: TranslateService,
-    public appConfigProvider: AppConfigProvider
+    public alertController: AlertController,
+    public navCtrl: NavController,
+    // public userService: UserService,
+    // public currentUserService: CurrentUserService,
+    public modalController: ModalController,
+    public messagingAuthService: MessagingAuthService,
+    public tiledeskAuthService: TiledeskAuthService,
+    public presenceService: PresenceService,
+    private router: Router,
+    private route: ActivatedRoute,
+    private renderer: Renderer2,
+    private navService: NavProxyService,
+    // public chatPresenceHandler: ChatPresenceHandler,
+    public typingService: TypingService,
+    public uploadService: UploadService,
+    public appStorageService: AppStorageService,
+
+    // public chatConversationsHandler: ChatConversationsHandler,
+    public conversationsHandlerService: ConversationsHandlerService,
+    public archivedConversationsHandlerService: ArchivedConversationsHandlerService,
+    private translateService: CustomTranslateService,
+    public notificationsService: NotificationsService,
+    public toastController: ToastController,
+    // private network: Network,
+    // private tiledeskService: TiledeskService,
+    private networkService: NetworkService
   ) {
-    this.notificationsEnabled = true;
-    this.zone = new NgZone({});
-    //this.isNavBar = (location.search.split('navBar=')[1]).split('&')[0];
-    let TEMP = location.search.split('navBar=')[1];
-    if (TEMP) { this.isNavBar = TEMP.split('&')[0]; }
-    //console.log('isNavBar: ', this.isNavBar);
-    //this.isNavBar = 'http://support.chat21.org/dashboard/';
-
-    // this language will be used as a fallback when a translation isn't found in the current language
-    //translate.setDefaultLang('it');
-
-
-    //firebase.initializeApp(config.get("firebaseConfig"));
-    //firebase.initializeApp(this.firebaseConfig);
-    
-    if (!appConfigProvider.getConfig().firebaseConfig || appConfigProvider.getConfig().firebaseConfig.apiKey === 'CHANGEIT') {
-      // tslint:disable-next-line:max-line-length
-      throw new Error('firebase config is not defined. Please create your firebase-config.json. See the Chat21-Web_widget Installation Page');
+    this.logger.log('[APP-COMP] HELLO Constuctor !!!!!!!')
+    // HACK: fix toast not presented when offline, due to lazy loading the toast controller.
+    // this.toastController.create({ animated: false }).then(t => {
+    //   console.log('[APP-COMP] toastController create')
+    //   t.present();
+    //   t.dismiss();
+    // });
+  }
+
+  param() {
+    // PARAM
+    const url: URL = new URL(window.top.location.href);
+    const params: URLSearchParams = url.searchParams;
+    return params;
+  }
+  /**
+   */
+  ngOnInit() {
+    const appconfig = this.appConfigProvider.getConfig();
+    this.persistence = appconfig.authPersistence;
+    this.appStorageService.initialize(environment.storage_prefix, this.persistence, '')
+    this.logger.log('[APP-COMP] HELLO ngOnInit !!!!!!!')
+    this.logger.info('[APP-COMP] ngOnInit this.route.snapshot.params -->', this.route.snapshot.params);
+    // this.initializeApp('oninit');
+    const token = getParameterByName('jwt')
+    this.logger.info('[APP-COMP] ngOnInit AUTOLOGIN token get with getParameterByName -->', token);
+
+    if (token) {
+      // this.isOnline = false;
+      // this.logger.log('[APP-COMP] ngOnInit AUTOLOGIN token get with this.isOnline  ', this.isOnline)
+      this.logger.log('[APP-COMP] ngOnInit AUTOLOGIN token get with getParameterByName  ', token)
+      // save token in local storage then 
+
+      const storedToken = this.appStorageService.getItem('tiledeskToken');
+      this.logger.log('[APP-COMP] ngOnInit AUTOLOGIN storedToken ', storedToken)
+      this.logger.log('[APP-COMP] ngOnInit AUTOLOGIN SAVE THE PARAMS TOKEN ', token)
+      if (storedToken !== token) {
+        this.appStorageService.setItem('tiledeskToken', token);
+      } else {
+        this.logger.log('[APP-COMP] ngOnInit AUTOLOGIN the current user already exist DON\'T SAVE ')
+      }
     }
-    firebase.initializeApp(appConfigProvider.getConfig().firebaseConfig);  // here shows the error
-    console.log('firebase', firebase);
-
-    platform.ready().then(() => {
-      this.events.subscribe('requestPermission', this.callbackRequestPermission);
-      // Okay, so the platform is ready and our plugins are available.
-      // Here you can do any higher level native things you might need.
-      statusBar.styleDefault();
-      splashScreen.hide();
-
-      // alert("  navProxy.masterNav: ");
-      // Add our nav controllers to
-      // the nav proxy service...
-      navProxy.masterNav = this.masterNav;
-      navProxy.detailNav = this.detailNav;
-      this.masterNav.setRoot(ListaConversazioniPage, { detailNavCtrl: this.detailNav });
-      // this.detailNav.setRoot(PlaceholderPage);
-      this.msgService.initMessage();
-      this.msgService.getPermission();
-      // set tenant
-      let appConfig = config.get("appConfig");
-      const tenant = appConfig.tenant;
-      // init chat manager
-      this.chatManager.configureWithAppId(tenant);
-
-      // const language = document.documentElement.lang;
-      // let language = window.navigator.language; // detect browser language
-      // if (language == null || language == undefined) {
-      //   language = "en";
-      // }
-      // console.log('language: ', language);
-      this.translate.setDefaultLang('en');
-      this.translate.use('en');
-
-      console.log('navigator.language: ', navigator.language);
-      var language;
-      if(navigator.language.indexOf('-') != -1){
-        language = navigator.language.substring(0, navigator.language.indexOf('-'));
-      } else if(navigator.language.indexOf('_') != -1){
-        language = navigator.language.substring(0, navigator.language.indexOf('_'));
+    this.initializeApp('oninit');
+
+  }
+
+
+  signInWithCustomToken(token) {
+    // this.isOnline = false;
+    this.logger.log('[APP-COMP] SIGNINWITHCUSTOMTOKEN  token', token)
+    this.tiledeskAuthService.signInWithCustomToken(token)
+      .then((user: any) => {
+        this.logger.log('[APP-COMP] SIGNINWITHCUSTOMTOKEN AUTLOGIN user', user)
+        this.messagingAuthService.createCustomToken(token)
+      })
+      .catch(error => {
+        this.logger.error('[APP-COMP] SIGNINWITHCUSTOMTOKEN error::', error)
+      })
+  }
+
+  /** */
+  initializeApp(calledby: string) {
+    this.logger.log('[APP-COMP] - X - initializeApp !!! CALLED-BY: ', calledby);
+    this.logger.log('[APP-COMP] appconfig platform is cordova: ', this.platform.is('cordova'))
+
+    if (!this.platform.is('cordova')) {
+      this.splashScreen.show();
+    }
+    this.tabTitle = document.title;
+
+    this.getRouteParamsAndSetLoggerConfig();
+
+    const appconfig = this.appConfigProvider.getConfig();
+    this.logger.info('[APP-COMP] appconfig: ', appconfig)
+    this.version = PACKAGE.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(() => {
+      this.setLanguage();
+
+      if (this.splashScreen) {
+        this.splashScreen.hide();
+      }
+      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();
+
+      // this.currentUserService.initialize();
+      this.chatManager.initialize();
+      this.presenceService.initialize(this.tenant);
+      this.typingService.initialize(this.tenant);
+
+      const pushEngine = this.appConfigProvider.getConfig().pushEngine
+      const vap_id_Key = this.appConfigProvider.getConfig().firebaseConfig.vapidKey
+
+      if (pushEngine && pushEngine !== 'none') {
+        this.notificationsService.initialize(this.tenant, vap_id_Key)
+      }
+      this.uploadService.initialize();
+
+      this.initAuthentication();
+      this.initSubscriptions();
+      this.initAudio();
+
+      this.logger.debug('[APP-COMP] initializeApp:: ', this.sidebarNav, this.detailNav);
+
+      this.translateToastMsgs();
+
+      // ---------------------------------------
+      // Watch to network status
+      // ---------------------------------------
+      this.watchToConnectionStatus();
+    });
+  }
+
+
+  watchToConnectionStatus() {
+    this.networkService.checkInternetFunc().subscribe(isOnline => {
+      this.checkInternet = isOnline
+      this.logger.log('[APP-COMP] - watchToConnectionStatus - isOnline', this.checkInternet)
+
+      // checking internet connection
+      if (this.checkInternet == true) {
+        // this.events.publish('internetisonline', true);
+        // show success alert if internet is working
+        // alert('Internet is working.')
+        this.logger.log('[APP-COMP] - watchToConnectionStatus - Internet is working.')
+        // this.logger.log('[APP-COMP] - watchToConnectionStatus - this.missingConnectionToast', this.missingConnectionToast)
+        if (!checkPlatformIsMobile()) {
+          const elemIonNav = <HTMLElement>document.querySelector('ion-nav');
+          this.logger.log('[APP-COMP] - watchToConnectionStatus - desktop * elemIonNav *', elemIonNav)
+
+          if (this.executedInitializeAppByWatchConnection === false) {
+            setTimeout(() => {
+              const elemIonNavchildNodes = elemIonNav.childNodes;
+              this.logger.log('[APP-COMP] - watchToConnectionStatus - elemIonNavchildNodes ', elemIonNavchildNodes);
+
+              if (elemIonNavchildNodes.length === 0) {
+                this.logger.log('[APP-COMP] - watchToConnectionStatus - elemIonNavchildNodes  HERE YES', elemIonNavchildNodes);
+
+                // this.initializeApp('checkinternet');
+                this.executedInitializeAppByWatchConnection = true;
+              }
+            }, 2000);
+          }
+        } else if (checkPlatformIsMobile()) {
+          this.logger.log('[APP-COMP] - watchToConnectionStatus - mobile ')
+          const elemIonRouterOutlet = <HTMLElement>document.querySelector('ion-router-outlet');
+          this.logger.log('[APP-COMP] - watchToConnectionStatus - mobile * elemIonRouterOutlet *', elemIonRouterOutlet)
+          if (this.executedInitializeAppByWatchConnection === false) {
+            setTimeout(() => {
+              const childElementCount = elemIonRouterOutlet.childElementCount;
+              this.logger.log('[APP-COMP] - watchToConnectionStatus - mobile * childElementCount *', childElementCount)
+              if (childElementCount === 1) {
+                // this.initializeApp('checkinternet');
+                this.executedInitializeAppByWatchConnection = true;
+              }
+            }, 2000);
+          }
+        }
+      }
+      else {
+        this.logger.log('[APP-COMP] - watchToConnectionStatus - Internet is slow or not working.');
+      }
+    });
+  }
+
+
+  getRouteParamsAndSetLoggerConfig() {
+    const appconfig = this.appConfigProvider.getConfig();
+    this.route.queryParams.subscribe(params => {
+      this.logger.info('[APP-COMP] getRouteParamsAndSetLoggerConfig - queryParams params: ', params)
+      if (params.logLevel) {
+        this.logger.info('[APP-COMP] getRouteParamsAndSetLoggerConfig - log level get from queryParams: ', params.logLevel)
+        this.logger.setLoggerConfig(true, params.logLevel)
       } else {
-        language = navigator.language;
+        this.logger.info('[APP-COMP] getRouteParamsAndSetLoggerConfig - log level get from appconfig: ', appconfig.logLevel)
+        this.logger.setLoggerConfig(true, appconfig.logLevel)
+      }
+    });
+  }
+
+
+  translateToastMsgs() {
+    this.translate.get('AnErrorOccurredWhileUnsubscribingFromNotifications')
+      .subscribe((text: string) => {
+        this.toastMsgErrorWhileUnsubscribingFromNotifications = text;
+      });
+    this.translate.get('CLOSE_TOAST')
+      .subscribe((text: string) => {
+        this.toastMsgCloseToast = text;
+      });
+    this.translate.get('WAITING_FOR_NETWORK')
+      .subscribe((text: string) => {
+        this.toastMsgWaitingForNetwork = text;
+      });
+  }
+
+
+  /***************************************************+*/
+  /**------- AUTHENTICATION FUNCTIONS --> START <--- +*/
+  private initAuthentication() {
+    const tiledeskToken = this.appStorageService.getItem('tiledeskToken')
+    this.logger.log('[APP-COMP] >>> INIT-AUTHENTICATION !!! ')
+    this.logger.log('[APP-COMP] >>> initAuthentication tiledeskToken ', tiledeskToken)
+    // const currentUser = JSON.parse(this.appStorageService.getItem('currentUser'));
+    // this.logger.log('[APP-COMP] >>> initAuthentication currentUser ', currentUser)
+    if (tiledeskToken) {
+      this.logger.log('[APP-COMP] >>> initAuthentication I LOG IN WITH A TOKEN EXISTING IN THE LOCAL STORAGE OR WITH A TOKEN PASSED IN THE URL PARAMETERS <<<')
+      this.tiledeskAuthService.signInWithCustomToken(tiledeskToken).then(user => {
+        this.logger.log('[APP-COMP] >>> initAuthentication user ', user)
+        this.messagingAuthService.createCustomToken(tiledeskToken) 
+      }).catch(error => {
+        this.logger.error('[APP-COMP] initAuthentication SIGNINWITHCUSTOMTOKEN error::', error)
+      })
+    } else {
+      this.logger.warn('[APP-COMP] >>> I AM NOT LOGGED IN <<<')
+      
+      // clearTimeout(this.timeModalLogin);
+      // this.timeModalLogin = setTimeout(() => {
+        if (!this.hadBeenCalledOpenModal) {
+          this.authModal = this.presentModal('initAuthentication');
+          this.hadBeenCalledOpenModal = true;
+        }
+      // }, 1000);
+    }
+  }
+
+  // checkTokenAndGoOffline() {
+  //   let token = this.appStorageService.getItem('tiledeskToken');
+  //   this.logger.info('[APP-COMP] ***** checkTokenAndGoOffline - stored token *****', token);
+  //   if (!token) {
+  //     this.goOffLine()
+  //   }
+  // }
+
+  /**
+   * goOnLine:
+   * 1 - nascondo splashscreen
+   * 2 - recupero il tiledeskToken e lo salvo in chat manager
+   * 3 - carico in d
+   * @param user
+   */
+  goOnLine = () => {
+    // this.isOnline = true;
+    // this.logger.info('initialize FROM [APP-COMP] - [APP-COMP] - GO-ONLINE isOnline ', this.isOnline);
+
+    clearTimeout(this.timeModalLogin);
+    const tiledeskToken = this.tiledeskAuthService.getTiledeskToken();
+    const currentUser = this.tiledeskAuthService.getCurrentUser();
+    // this.logger.printDebug('APP-COMP - goOnLine****', currentUser);
+    this.logger.log('[APP-COMP] - GO-ONLINE - currentUser ', currentUser);
+    this.chatManager.setTiledeskToken(tiledeskToken);
+    this.chatManager.setCurrentUser(currentUser);
+    // ----------------------------------------------
+    // PUSH NOTIFICATIONS
+    // ----------------------------------------------
+    const pushEngine = this.appConfigProvider.getConfig().pushEngine
+
+    if (currentUser) {
+      if (pushEngine && pushEngine !== 'none') {
+        this.notificationsService.getNotificationPermissionAndSaveToken(currentUser.uid);
+      }
+      this.presenceService.setPresence(currentUser.uid);
+
+      this.initConversationsHandler(currentUser.uid);
+      this.initArchivedConversationsHandler(currentUser.uid);
+    }
+    this.checkPlatform();
+    try {
+      this.logger.debug('[APP-COMP] ************** closeModal', this.authModal);
+      if (this.authModal) {
+        this.closeModal();
+      }
+    } catch (err) {
+      this.logger.error('[APP-COMP] -> error:', err);
+    }
+    this.chatManager.startApp();
+  }
+
+  goOffLine = () => {
+    this.logger.log('[APP-COMP] - GO-OFFLINE');
+    // this.isOnline = false;
+    // this.conversationsHandlerService.conversations = [];
+
+    this.chatManager.setTiledeskToken(null);
+    this.chatManager.setCurrentUser(null);
+    this.chatManager.goOffLine();
+
+    this.router.navigateByUrl('conversation-detail/'); //redirect to basePage
+   
+    // clearTimeout(this.timeModalLogin);
+    // this.timeModalLogin = setTimeout(() => {
+      if (!this.hadBeenCalledOpenModal) {
+        this.authModal = this.presentModal('goOffLine');
+        this.hadBeenCalledOpenModal = true
+      }
+    // }, 1000);
+
+    // this.unsubscribe$.next();
+    // this.unsubscribe$.complete();
+
+  }
+  /**------- AUTHENTICATION FUNCTIONS --> END <--- +*/
+  /***************************************************+*/
+
+  /** */
+  setLanguage() {
+    this.translate.setDefaultLang('en');
+    this.translate.use('en');
+    this.logger.debug('[APP-COMP] navigator.language: ', navigator.language);
+    let language;
+    if (navigator.language.indexOf('-') !== -1) {
+      language = navigator.language.substring(0, navigator.language.indexOf('-'));
+    } else if (navigator.language.indexOf('_') !== -1) {
+      language = navigator.language.substring(0, navigator.language.indexOf('_'));
+    } else {
+      language = navigator.language;
+    }
+    this.translate.use(language);
+  }
+
+  checkPlatform() {
+    this.logger.debug('[APP-COMP] checkPlatform');
+    // let pageUrl = '';
+    // try {
+    //   const pathPage = this.route.snapshot.firstChild.routeConfig.path;
+    //   this.route.snapshot.firstChild.url.forEach(element => {
+    //     pageUrl += '/' + element.path;
+    //   });
+    // } catch (error) {
+    //   this.logger.debug('error', error);
+    // }
+    // this.logger.debug('checkPlatform pathPage: ', pageUrl);
+    // if (!pageUrl || pageUrl === '') {
+    //   pageUrl = '/conversations-list';
+    // }
+
+    if (checkPlatformIsMobile()) {
+      this.platformIs = PLATFORM_MOBILE;
+      const IDConv = this.route.snapshot.firstChild.paramMap.get('IDConv');
+      this.logger.log('[APP-COMP] PLATFORM_MOBILE2 navigateByUrl', PLATFORM_MOBILE, this.route.snapshot);
+      if (!IDConv) {
+        this.router.navigateByUrl('conversations-list')
       }
-      //let language = (navigator.language.indexOf('-') != -1) ? navigator.language.substring(0, navigator.language.indexOf('-')) : navigator.language;
-      this.translate.use(language);
-      console.log('language: ', language);
+      // this.router.navigateByUrl(pageUrl);
+      // this.navService.setRoot(ConversationListPage, {});
+    } else {
+      this.platformIs = PLATFORM_DESKTOP;
+      this.logger.log('[APP-COMP] PLATFORM_DESKTOP ', this.navService);
 
+      this.navService.setRoot(ConversationListPage, {});
+
+      const IDConv = this.route.snapshot.firstChild.paramMap.get('IDConv');
+      const FullNameConv = this.route.snapshot.firstChild.paramMap.get('FullNameConv');
+      const Convtype = this.route.snapshot.firstChild.paramMap.get('Convtype');
+
+
+      let pageUrl = 'conversation-detail/'
+      if (IDConv && FullNameConv) {
+        pageUrl += IDConv + '/' + FullNameConv + '/' + Convtype
+      }
+
+      this.router.navigateByUrl(pageUrl);
+
+
+      // const DASHBOARD_URL = this.appConfigProvider.getConfig().DASHBOARD_URL;
+      // createExternalSidebar(this.renderer, DASHBOARD_URL);
+
+      // // FOR REALTIME TESTING
+      // createExternalSidebar(this.renderer, 'http://localhost:4204');
+
+    }
+  }
+
+  /** */
+  // showNavbar() {
+  //   let TEMP = location.search.split('navBar=')[1];
+  //   if (TEMP) { this.isNavBar = TEMP.split('&')[0]; }
+  // }
+
+  /** */
+  hideAlert() {
+    this.logger.debug('[APP-COMP] hideAlert');
+    this.notificationsEnabled = true;
+  }
+
+  private initAudio() {
+    // SET AUDIO
+    this.audio = new Audio();
+    this.audio.src = URL_SOUND_LIST_CONVERSATION;
+    this.audio.load();
+  }
+
+  private manageTabNotification() {
+    if (!this.isTabVisible) {
+      // TAB IS HIDDEN --> manage title and SOUND
+
+      let badgeNewConverstionNumber = this.conversationsHandlerService.countIsNew()
+      badgeNewConverstionNumber > 0 ? badgeNewConverstionNumber : badgeNewConverstionNumber = 1
+      document.title = "(" + badgeNewConverstionNumber + ") " + this.tabTitle
+
+      clearInterval(this.setIntervalTime)
+      const that = this
+      this.setIntervalTime = setInterval(function () {
+        if (document.title.charAt(0) === '(') {
+          document.title = that.tabTitle
+        } else {
+          document.title = "(" + badgeNewConverstionNumber + ") " + that.tabTitle;
+        }
+      }, 1000);
+      this.soundMessage()
+    }
+  }
+
+  soundMessage() {
+    const that = this;
+    // this.audio = new Audio();
+    // // this.audio.src = '/assets/sounds/pling.mp3';
+    // this.audio.src = URL_SOUND_LIST_CONVERSATION;
+    // this.audio.load();
+    this.logger.debug('[APP-COMP] conversation play', this.audio);
+    clearTimeout(this.setTimeoutSound);
+    this.setTimeoutSound = setTimeout(function () {
+      that.audio.play().then(() => {
+        that.logger.debug('[APP-COMP] ****** soundMessage played *****');
+      }).catch((error: any) => {
+        that.logger.debug('[APP-COMP] ***soundMessage error*', error);
+      });
+    }, 1000);
+  }
+  /**---------------- SOUND FUNCTIONS --> END <--- +*/
+  /***************************************************+*/
+
+
+  // BEGIN SUBSCRIPTIONS //
+  /**      .pipe(
+        takeUntil(this.unsubscribe$)
+      ) */
+  initSubscriptions() {
+    this.logger.log('initialize FROM [APP-COMP] - initSubscriptions');
+
+
+    // ---------------------------------------------------------------------------------------------------
+    // Protecting from multiple subsciptions due to multiple app initializations (call to initializeApp())
+    // Only one subscriber x application allowed
+    // ---------------------------------------------------------------------------------------------------
+    if (this.BSAuthStateChangedSubscriptionRef) {
+      this.logger.log('initialize FROM [APP-COMP] - BSAuthStateChanged ALREADY SUBSCRIBED');
+      return;
+    }
+
+    this.BSAuthStateChangedSubscriptionRef = this.messagingAuthService.BSAuthStateChanged 
+   
+      // .pipe(takeUntil(this.unsubscribe$))
+      .pipe(filter((state) => state !== null))
+      .subscribe((state: any) => {
+        this.logger.log('initialize FROM [APP-COMP] - [APP-COMP] ***** BSAuthStateChanged  state', state);
+        // this.logger.info('initialize FROM [APP-COMP] - [APP-COMP] ***** BSAuthStateChanged  isOnline', this.isOnline);
+        if (state && state === AUTH_STATE_ONLINE) {
+          // const user = this.tiledeskAuthService.getCurrentUser();
+          // if (this.isOnline === false) {
+          // if (AUTH_STATE_ONLINE) {
+          this.goOnLine();
+          // }
+        } else if (state === AUTH_STATE_OFFLINE) {
+          // this.checkTokenAndGoOffline() //se c'è un tiledeskToken salvato, allora aspetta, altrimenti vai offline
+          this.goOffLine()
+        }
+      }, error => {
+        this.logger.error('initialize FROM [APP-COMP] - [APP-COMP] ***** BSAuthStateChanged * error * ', error)
+      }, () => {
+        this.logger.log('initialize FROM [APP-COMP] - [APP-COMP] ***** BSAuthStateChanged *** complete *** ')
+      });
+
+
+    this.events.subscribe('uidConvSelected:changed', this.subscribeChangedConversationSelected);
+    this.events.subscribe('profileInfoButtonClick:logout', this.subscribeProfileInfoButtonLogOut);
+
+
+    this.conversationsHandlerService.conversationAdded.subscribe((conversation: ConversationModel) => {
+      // this.logger.log('[APP-COMP] ***** conversationsAdded *****', conversation);
+      // that.conversationsChanged(conversations);
+      if (conversation && conversation.is_new === true) {
+        this.manageTabNotification()
+      }
     });
 
-    // // solve the issue : "Cannot read property 'myID' of undefined"
-    // // source :
-    // // https://github.com/firebase/angularfire/issues/970
-    // if (getLocalStorage()) {
-    //   getLocalStorage().removeItem('firebase:previous_websocket_failure');
+    this.conversationsHandlerService.conversationChanged.subscribe((conversation: ConversationModel) => {
+
+      this.logger.log('[APP-COMP] ***** subscribeConversationChanged conversation: ', conversation);
+      const currentUser = JSON.parse(this.appStorageService.getItem('currentUser'));
+      this.logger.log('[APP-COMP] ***** subscribeConversationChanged current_user: ', currentUser);
+
+      if (currentUser) {
+        this.logger.log('[APP-COMP] ***** subscribeConversationChanged current_user uid: ', currentUser.uid);
+        if (conversation && conversation.sender !== currentUser.uid) {
+          this.manageTabNotification();
+        }
+      }
+    });
+  }
+
+  /**
+   * ::: subscribeChangedConversationSelected :::
+   * evento richiamato quando si seleziona un utente nell'elenco degli user
+   * apro dettaglio conversazione
+   */
+  subscribeChangedConversationSelected = (user: UserModel, type: string) => {
+    this.logger.info('[APP-COMP] subscribeUidConvSelectedChanged navigateByUrl', user, type);
+    // this.router.navigateByUrl('conversation-detail/' + user.uid + '?conversationWithFullname=' + user.fullname);
+    this.router.navigateByUrl('conversation-detail/' + user.uid + '/' + user.fullname + '/' + type);
+  }
+
+  subscribeProfileInfoButtonLogOut = (hasClickedLogout) => {
+    this.logger.log('[APP-COMP] FIREBASE-NOTIFICATION >>>>  subscribeProfileInfoButtonLogOut ');
+    // if (hasClickedLogout === true) {
+    //   this.removePresenceAndLogout()
     // }
 
-    localStorage.removeItem('firebase:previous_websocket_failure');
+
+    if (hasClickedLogout === true) {
+      // ----------------------------------------------
+      // PUSH NOTIFICATIONS
+      // ----------------------------------------------
+      const that = this;
+      const pushEngine = this.appConfigProvider.getConfig().pushEngine
+      if (pushEngine && pushEngine !== 'none') {
+        this.notificationsService.removeNotificationsInstance(function (res) {
+          that.logger.log('[APP-COMP] FIREBASE-NOTIFICATION >>>>  removeNotificationsInstance > CALLBACK RES', res);
+
+          if (res === 'success') {
+            that.removePresenceAndLogout();
+          } else {
+            that.removePresenceAndLogout();
+            // that.presentToast();
+          }
+        })
+      }
+
+    }
+  }
+
+  private async presentModal(calledby): Promise<any> {
+    this.logger.log('[APP-COMP] presentModal calledby', calledby, '- hadBeenCalledOpenModal: ', this.hadBeenCalledOpenModal);
+    const attributes = { tenant: this.tenant, enableBackdropDismiss: false };
+    const modal: HTMLIonModalElement =
+      await this.modalController.create({
+        component: LoginPage,
+        componentProps: attributes,
+        swipeToClose: false,
+        backdropDismiss: false
+      });
+    modal.onDidDismiss().then((detail: any) => {
+      this.hadBeenCalledOpenModal = false
+      this.logger.log('[APP-COMP] presentModal onDidDismiss detail.data ', detail.data);
+      // this.checkPlatform();
+      if (detail !== null) {
+        //  this.logger.debug('The result: CHIUDI!!!!!', detail.data);
+      }
+    });
+    // await modal.present();
+    // modal.onDidDismiss().then((detail: any) => {
+    //    this.logger.debug('The result: CHIUDI!!!!!', detail.data);
+    //   //  this.checkPlatform();
+    //    if (detail !== null) {
+    //     //  this.logger.debug('The result: CHIUDI!!!!!', detail.data);
+    //    }
+    // });
+    return await modal.present();
   }
 
-  callbackRequestPermission: any = (permission) => {
-    console.log("callbackRequestPermission", permission);
-    this.notificationsEnabled = permission;
-    this.msgService.getToken();
+  private async closeModal() {
+    this.logger.debug('[APP-COMP] closeModal', this.modalController);
+    this.logger.debug('[APP-COMP] closeModal .getTop()', this.modalController.getTop());
+    await this.modalController.getTop();
+    this.modalController.dismiss({ confirmed: true });
   }
-  hideAlert(){
-    console.log("hideAlert");
-    this.notificationsEnabled = true;
+
+
+  // listenToLogoutEvent() {
+  //   this.events.subscribe('profileInfoButtonClick:logout', (hasclickedlogout) => {
+  //     this.logger.debug('[APP-COMP] hasclickedlogout', hasclickedlogout);
+  //     if (hasclickedlogout === true) {
+  //       // ----------------------------------------------
+  //       // PUSH NOTIFICATIONS
+  //       // ----------------------------------------------
+  //       const that = this;
+  //       const pushEngine = this.appConfigProvider.getConfig().pushEngine
+  //       if( pushEngine && pushEngine !== 'none'){
+  //         this.notificationsService.removeNotificationsInstance(function (res) {
+  //           that.logger.debug('[APP-COMP] FIREBASE-NOTIFICATION >>>>  removeNotificationsInstance > CALLBACK RES', res);
+
+  //           if (res === 'success') {
+  //             that.removePresenceAndLogout();
+  //           } else {
+  //             that.removePresenceAndLogout();
+  //             that.presentToast();
+  //           }
+  //         })
+  //       }
+
+  //     }
+  //   });
+  // }
+
+
+  async presentToast() {
+    const toast = await this.toastController.create({
+      message: this.toastMsgErrorWhileUnsubscribingFromNotifications,
+      duration: 2000
+    });
+    toast.present();
   }
 
-}
+  removePresenceAndLogout() {
+    this.logger.debug('[APP-COMP] FIREBASE-NOTIFICATION >>>> calling removePresenceAndLogout');
+    this.presenceService.removePresence();
+    this.tiledeskAuthService.logOut()
+    this.messagingAuthService.logout()
+  }
+
+  private initConversationsHandler(userId: string) {
+    const keys = ['YOU'];
+    const translationMap = this.translateService.translateLanguage(keys);
+
+    this.logger.log('[APP-COMP] initConversationsHandler ------------->', userId, this.tenant);
+    // 1 - init chatConversationsHandler and  archviedConversationsHandler
+    this.conversationsHandlerService.initialize(this.tenant, userId, translationMap);
+
+    // this.subscribeToConvs()
+    this.conversationsHandlerService.subscribeToConversations(() => {
+      this.logger.log('[APP-COMP] - CONVS - INIT CONV')
+
+      const conversations = this.conversationsHandlerService.conversations;
+      this.logger.info('initialize FROM [APP-COMP] - [APP-COMP]-CONVS - INIT CONV CONVS', conversations)
+
+      // this.logger.printDebug('SubscribeToConversations (convs-list-page) - conversations')
+      if (!conversations || conversations.length === 0) {
+        // that.showPlaceholder = true;
+        this.logger.debug('[APP-COMP]-CONVS - INIT CONV CONVS 2', conversations)
+        this.events.publish('appcompSubscribeToConvs:loadingIsActive', false);
+      }
+    });
+
+  }
+
+  private initArchivedConversationsHandler(userId: string) {
+    const keys = ['YOU'];
+
+    const translationMap = this.translateService.translateLanguage(keys);
 
-// export function getLocalStorage() {
-//   return (typeof window !== "undefined") ? window.localStorage : null;
-// }
+    this.logger.debug('[APP-COMP] initArchivedConversationsHandler ------------->', userId, this.tenant);
+    // 1 - init  archviedConversationsHandler
+    this.archivedConversationsHandlerService.initialize(this.tenant, userId, translationMap);
+  }
+
+  // BEGIN RESIZE FUNCTIONS //
+  @HostListener('window:resize', ['$event'])
+  onResize(event: any) {
+    const that = this;
+    // this.logger.debug('this.doitResize)', this.doitResize)
+    clearTimeout(this.doitResize);
+    this.doitResize = setTimeout(() => {
+      let platformIsNow = PLATFORM_DESKTOP;
+      if (checkPlatformIsMobile()) {
+        platformIsNow = PLATFORM_MOBILE;
+      }
+      if (!this.platformIs || this.platformIs === '') {
+        this.platformIs = platformIsNow;
+      }
+      this.logger.debug('[APP-COMP] onResize width::::', window.innerWidth);
+      this.logger.debug('[APP-COMP] onResize width:::: platformIsNow', platformIsNow);
+      this.logger.debug('[APP-COMP] onResize width:::: platformIsNow this.platformIs', this.platformIs);
+      if (platformIsNow !== this.platformIs) {
+        window.location.reload();
+      }
+    }, 500);
+  }
+  // END RESIZE FUNCTIONS //
+
+  @HostListener('document:visibilitychange', [])
+  visibilitychange() {
+    // this.logger.debug("document TITLE", document.hidden, document.title);
+    if (document.hidden) {
+      this.isTabVisible = false
+    } else {
+      // TAB IS ACTIVE --> restore title and DO NOT SOUND
+      clearInterval(this.setIntervalTime)
+      this.isTabVisible = true;
+      document.title = this.tabTitle;
+    }
+  }
+
+  // Storage event not firing: This won't work on the same page that is making the changes
+  // https://stackoverflow.com/questions/35865481/storage-event-not-firing
+  // https://developer.mozilla.org/en-US/docs/Web/API/Window/storage_event
+  @HostListener('window:storage', ['$event'])
+  onStorageChanged(event: any) {
+    // console.log('[APP-COMP] - onStorageChanged event ', event)
+    if (event.key !== 'chat_sv5__tiledeskToken') {
+      return;
+    }
+
+    if (this.appStorageService.getItem('tiledeskToken') === null) {
+      // console.log('[APP-COMP] - onStorageChanged tiledeskToken is null - RUN LOGOUT')
+      this.tiledeskAuthService.logOut()
+      this.messagingAuthService.logout();
+      this.events.publish('profileInfoButtonClick:logout', true);
+      // this.isOnline = false;
+    }
+    else {
+      const currentUser = this.tiledeskAuthService.getCurrentUser();
+      // console.log('[APP-COMP] - X - onStorageChanged currentUser', currentUser)
+
+      const currentToken = this.tiledeskAuthService.getTiledeskToken();
+      // console.log('[APP-COMP] - onStorageChanged currentToken', currentToken)
+      if (this.appStorageService.getItem('tiledeskToken') !== null && currentToken !== this.appStorageService.getItem('tiledeskToken')) {
+
+        // console.log('[APP-COMP] - onStorageChanged wentOnline 2')
+        // DEALLOCO RISORSE OCCUPATE
+        this.messagingAuthService.logout();
+        this.appStorageService.removeItem('currentUser')
+        this.tiledeskAuthService.setCurrentUser(null);
+        // this.unsubscribe$.next();
+        // this.unsubscribe$.complete();
+        this.initializeApp('onstoragechanged');
+
+       
+
+        // console.log('[APP-COMP]  onAuthStateChanged HERE !!! ')
+        // firebase.auth().onAuthStateChanged(user => {
+        //   console.log('[APP-COMP]  onAuthStateChanged', user)
+        // })
+
+      }
+    }
+  }
+
+
+
+}