@chat21/chat21-ionic 3.0.58 → 3.0.59-rc15

package/src/app/chatlib/conversation-detail/message/bubble-message/bubble-message.component.html

@@ -1,7 +1,7 @@
 <!-- [ngClass]="{'button-in-msg' : message.metadata && message.metadata.button}" -->
 <!-- [ngStyle]="{'padding': (isImage(message) || isFrame(message))?'0px':'0 8px'}" -->
 <!-- isImage >{{isImage(message) }}    message.metadata.width {{message?.metadata?.width }}  -->
-<div  [ngStyle]="{'padding': (isImage(message) || isFrame(message))?'0px':'0 8px', 'width': (isImage(message) || isFrame(message))? message?.metadata?.width + 'px' : null }"
+<div id="bubble-message" [ngStyle]="{'padding': (isImage(message) || isFrame(message))?'0px':'0 8px', 'width': (isImage(message) || isFrame(message))? message?.metadata?.width + 'px' : null }"
    class="messages primary-color"
   [class.emoticon]="message?.emoticon">
 
@@ -42,10 +42,15 @@
 
     <!-- message type:: text -->
     <!-- <div *ngIf="message.type == 'text'">  -->
+      
     <div *ngIf="message?.text" [tooltip]="timeTooltipLeft" [options]="tooltipOptions" placement="left"
       content-type="template" (click)="handleTooltipEvents($event)">
       <ng-template #timeTooltipLeft>
-        <span>{{message.timestamp | amTimeAgo}}</span>
+        <!-- <span>{{message.timestamp | amTimeAgo}}</span> -->
+        <!-- <span> {{browserLang === 'it' ? (message.timestamp| amDateFormat:'DD MMM') : (message.timestamp |
+        amDateFormat:'MMM DD')}} </span> amCalendar -->
+
+        <span> {{message.timestamp | amCalendar }} </span>
       </ng-template>
 
       <chat-text 

package/src/app/chatlib/conversation-detail/message/bubble-message/bubble-message.component.ts

@@ -5,6 +5,8 @@ import { MAX_WIDTH_IMAGES } from 'src/chat21-core/utils/constants';
 import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 import { isFile, isFrame, isImage } from 'src/chat21-core/utils/utils-message';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
+import { TranslateService } from '@ngx-translate/core';
+import * as moment from 'moment';
 @Component({
   selector: 'chat-bubble-message',
   templateUrl: './bubble-message.component.html',
@@ -21,6 +23,8 @@ export class BubbleMessageComponent implements OnInit, OnChanges {
   isFile = isFile;
   isFrame = isFrame;
 
+  public browserLang: string;
+
   tooltipOptions = {
     'show-delay': 500,
     'tooltip-class': 'chat-tooltip',
@@ -32,17 +36,58 @@ export class BubbleMessageComponent implements OnInit, OnChanges {
   };
 
   private logger: LoggerService = LoggerInstance.getInstance()
-  constructor(public sanitizer: DomSanitizer) {
+  constructor(
+    public sanitizer: DomSanitizer,
+    private translate: TranslateService) {
     // console.log('BUBBLE-MSG Hello !!!!')
   }
 
   ngOnInit() {
+    this.browserLang = this.translate.getBrowserLang();
+    // console.log('BUBBLE-MSG ngOnInit browserLang ', this.browserLang)
+    if (this.browserLang) {
+      if (this.browserLang === 'it') {
+        // console.log('BUBBLE-MSG browserLang ', this.browserLang)
+        // moment.locale('it')
+
+        moment.locale('it', {
+          calendar: {
+            lastDay: '[Ieri alle] LT',
+            sameDay: '[Oggi alle] LT',
+            nextDay: '[Domani alle] LT',
+            lastWeek: '[Ultimo] dddd [alle] LT',
+            nextWeek: 'dddd [alle] LT',
+            sameElse: 'lll'
+          }
+        });
+
+      } else {
+        // console.log('BUBBLE-MSG browserLang ', this.browserLang)
+        // moment.locale('en')
+
+        moment.locale('en', {
+          calendar: {
+            lastDay: '[Yesterday at] LT',
+            sameDay: '[Today at] LT',
+            nextDay: '[Tomorrow at] LT',
+            lastWeek: '[last] dddd [at] LT',
+            nextWeek: 'dddd [at] LT',
+            sameElse: 'lll'
+          }
+        });
+      }
+    }
+
+
+
+    // const yesterday = moment().subtract(1, 'day')
+    // console.log('BUBBLE-MSG yesterday ', yesterday)
 
   }
 
   ngOnChanges() {
     // console.log('BUBBLE-MSG Hello !!!! this.message ',  this.message)
-    if (this.message && this.message.metadata) {
+    if (this.message && this.message.metadata && typeof this.message.metadata === 'object') {
       this.getMetadataSize(this.message.metadata)
       // console.log('BUBBLE-MSG ngOnChanges message > metadata', this.message.metadata)
     }

package/src/app/chatlib/conversation-detail/message/image/image.component.html

@@ -1,9 +1,10 @@
 <div [ngStyle]="{ 'max-width': width +'px', 'max-height': height +'px' }" style="position: relative; ">
   <div *ngIf="loading" class="loader" [ngStyle]="{ 'width': width +'px', 'height': height +'px' }"></div>
-  <img [ngStyle]="{ 'width': width +'px', 'height': height +'px' }" style="cursor:pointer" [tooltip]="timeTooltipRight" [options]="tooltipOptions" placement="bottom"
-    content-type="template" class="message-contentX message-content-imageX" [ngClass]="{'isLoadingImage': loading}"
-    [src]="metadata.src" (load)="onLoaded($event)" (click)="downloadImage(metadata.src, metadata.name)" />
-  <ng-template #timeTooltipRight>
+  <!-- [tooltip]="timeTooltipRight" [options]="tooltipOptions" placement="bottom" content-type="template"  -->
+  <img id="myImg" [ngStyle]="{ 'width': width +'px', 'height': height +'px' }" style="cursor:pointer" 
+    class="message-contentX message-content-imageX" [ngClass]="{'isLoadingImage': loading}"
+    [src]="metadata.src" (load)="onLoaded($event)" (click)="openImageViewerModal(metadata.src, metadata.name)" />
+  <!-- <ng-template #timeTooltipRight>
     <span>{{ tooltipMessage }}</span>
-  </ng-template>
-</div>
+  </ng-template> -->
+</div>

package/src/app/chatlib/conversation-detail/message/image/image.component.ts

@@ -14,6 +14,8 @@ export class ImageComponent implements OnInit {
 
   loading: boolean = true
   tooltipMessage: string;
+  modal: any
+  span: any
 
   tooltipOptions = {
     'show-delay': 0,
@@ -45,7 +47,7 @@ export class ImageComponent implements OnInit {
     this.onImageRendered.emit(true)
   }
 
-  downloadImage(url: string, fileName: string) {
+  _downloadImage(url: string, fileName: string) {
     // console.log('Image COMP - IMAGE URL ', url) 
     // console.log('Image COMP - IMAGE FILENAME ', fileName) 
     const a: any = document.createElement('a');
@@ -56,4 +58,21 @@ export class ImageComponent implements OnInit {
     a.click();
     a.remove();
   }
+
+  openImageViewerModal(url: string, fileName: string) {
+    this.modal = document.getElementById("image-viewer-modal");
+    // console.log('has clicked open image-viewer modal ',  this.modal)
+    this.modal.style.display = "block";
+    var modalImg = <HTMLImageElement>document.getElementById("image-viewer-img");
+    var captionText = document.getElementById("caption");
+    modalImg.src = url
+    captionText.innerHTML = fileName;
+   
+  }
+
+ 
+
+
 }
+
+

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

@@ -25,7 +25,8 @@
 <!-- -------------------------------------------------------------------------- -->
 <!-- New   <ion-spinner class="spinner-middle" style="margin-left: 19px;"></ion-spinner> -->
 <!-- -------------------------------------------------------------------------- -->
-<ion-item *ngIf="isOnline === false" button="true" lines="none" class="ion-no-padding waiting-for-connection">
+<!-- <ion-item *ngIf="isOnline === false" button="true" lines="none" class="ion-no-padding waiting-for-connection">
+  <div tabindex="0"></div>
   <ion-avatar item-start>
     <div class="sk-fading-circle">
       <div class="sk-circle1 sk-circle"></div>
@@ -43,10 +44,39 @@
     </div>
   </ion-avatar>
   <ion-label part="message-text" class="waiting-for-network-msg"> Waiting for network</ion-label>
-</ion-item>
+</ion-item> -->
+
+<!-- <ion-item>
+  <div tabindex="0"></div>
+  <iframe loading="lazy" width="100%" height="70px" style="border: unset;" [src]="PROJECT_FOR_PANEL"></iframe>
+</ion-item>  -->
+<!-- <ion-item button="true" (click)="openUnsevedConversationIframe()">
+  <app-project-item
+  (projectIdEvent)="getLastProjectId($event)"></app-project-item>
+</ion-item> -->
+
+
+<!-- <ion-item-sliding disabled>
+  <ion-item>
+    <ion-label>
+      Sliding Item, Icons Start
+    </ion-label>
+  </ion-item>
+  <ion-item-options>
+    <ion-item-option color="primary">
+      <ion-icon slot="start" ios="ellipsis-horizontal" md="ellipsis-vertical"></ion-icon>
+      More
+    </ion-item-option>
+    <ion-item-option color="secondary">
+      <ion-icon slot="start" name="archive"></ion-icon>
+      Archive
+    </ion-item-option>
+  </ion-item-options>
+</ion-item-sliding> -->
+
 
 <ion-item button="true" lines="none" class="ion-no-padding" [class.ion-selected]="conversation.uid === uidConvSelected"
-  *ngFor="let conversation of listConversations" (click)="openConversationByID(conversation)">
+  *ngFor="let conversation of listConversations" (click)="openConversationByID(conversation)" detail=false>
   <div tabindex="0"></div>
 
   <!-- <div [class.selected]="conversation.uid === uidConvSelected"></div> -->
@@ -88,7 +118,8 @@
   <ion-note *ngIf="!conversation.archived" class="conversation_time">{{conversation.timestamp | amTimeAgo}}</ion-note>
 
   <ion-buttons slot="end">
-    <ion-button *ngIf="!conversation.archived" [ngClass]="{'hide': !isApp, 'button-on-desktop': !isApp  }"
+    <ion-button *ngIf="!conversation.archived"
+      [ngClass]="{'hide': !isApp, 'button-on-desktop': !isApp, 'button-on-mobile': isApp  }"
       id="{{ 'close_conversation_button' + conversation.uid }}" class="close-conversation-button" ion-button clear
       item-end (click)="closeConversation(conversation);$event.stopPropagation();" padding>
       <ion-icon slot="icon-only" style="display:block;" id="{{ 'close_button_icon' + conversation.uid }}"
@@ -103,21 +134,20 @@
 
   <div item-end *ngIf="conversation?.archived" class="achived-icon-wpr">
     <span *ngIf="(conversation.timestamp | amDateFormat:'YYYY') === currentYear" class="time-in-archived">
-      {{browserLang === 'it' ? (conversation.timestamp| amDateFormat:'DD MMM') : (conversation.timestamp |
-      amDateFormat:'MMM DD')}}
+      {{browserLang === 'en' ? (conversation.timestamp | amDateFormat:'MMM DD') : (conversation.timestamp| amDateFormat:'DD MMM')}}
 
       <!-- {{conversation.timestamp | amDateFormat:'DD MMM'}} -->
     </span>
     <span *ngIf="(conversation.timestamp | amDateFormat:'YYYY') !== currentYear" class="time-in-archived">
-      {{browserLang === 'it' ? (conversation.timestamp| amDateFormat:'DD MMM') : (conversation.timestamp |
-      amDateFormat:'MMM DD YYYY')}}
+      {{browserLang === 'en' ? (conversation.timestamp | amDateFormat:'MMM DD YYYY') : (conversation.timestamp| amDateFormat:'DD MMM YYYY') }}
       <!-- {{conversation.timestamp | amDateFormat:'DD MMM YYYY'}} -->
     </span>
     <i class="material-icons" item-end style="font-size: 15px;font-weight: 400;color: #666666;"> history </i>
   </div>
 
   <!-- && !conversation?.archived -->
-  <div item-end class="notification_point" [ngClass]="{'notification_point-on-desktop': !isApp }"
+  <div item-end class="notification_point"
+    [ngClass]="{'notification_point-on-desktop': !isApp, 'notification_point-on-mobile': isApp }"
     *ngIf="conversation.is_new">
   </div>
 

package/src/app/chatlib/list-conversations-component/ion-list-conversations/ion-list-conversations.component.scss

@@ -142,6 +142,10 @@ ion-item {
     .notification_point-on-desktop {
         bottom: 29px !important;
     }
+    .notification_point-on-mobile {
+        bottom: 29px !important;
+        right: 8px;
+    }
 }
 
 // ion-item {
@@ -171,6 +175,10 @@ ion-item:hover {
     }
 }
 
+.button-on-mobile {
+    margin-right: 31px !important; 
+}
+
 .truncate-on-desktop {
     width: 88% !important
 }
@@ -212,147 +220,3 @@ ion-item:hover {
 }
 
 
-.waiting-for-connection {
-    --background:  #fdd764;
-}
-
-// -------------------------------
-// Spinner
-// -------------------------------
-.sk-fading-circle {
-    // margin: 100px auto;
-    width: 40px;
-    height: 40px;
-    position: relative;
-    margin-left: 5px;
-    margin-top: 5px;
-  }
-  
-  .sk-fading-circle .sk-circle {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    left: 0;
-    top: 0;
-  }
-  
-  .sk-fading-circle .sk-circle:before {
-    content: '';
-    display: block;
-    margin: 0 auto;
-    width: 15%;
-    height: 15%;
-    background-color: #333;
-    border-radius: 100%;
-    -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
-            animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
-  }
-  .sk-fading-circle .sk-circle2 {
-    -webkit-transform: rotate(30deg);
-        -ms-transform: rotate(30deg);
-            transform: rotate(30deg);
-  }
-  .sk-fading-circle .sk-circle3 {
-    -webkit-transform: rotate(60deg);
-        -ms-transform: rotate(60deg);
-            transform: rotate(60deg);
-  }
-  .sk-fading-circle .sk-circle4 {
-    -webkit-transform: rotate(90deg);
-        -ms-transform: rotate(90deg);
-            transform: rotate(90deg);
-  }
-  .sk-fading-circle .sk-circle5 {
-    -webkit-transform: rotate(120deg);
-        -ms-transform: rotate(120deg);
-            transform: rotate(120deg);
-  }
-  .sk-fading-circle .sk-circle6 {
-    -webkit-transform: rotate(150deg);
-        -ms-transform: rotate(150deg);
-            transform: rotate(150deg);
-  }
-  .sk-fading-circle .sk-circle7 {
-    -webkit-transform: rotate(180deg);
-        -ms-transform: rotate(180deg);
-            transform: rotate(180deg);
-  }
-  .sk-fading-circle .sk-circle8 {
-    -webkit-transform: rotate(210deg);
-        -ms-transform: rotate(210deg);
-            transform: rotate(210deg);
-  }
-  .sk-fading-circle .sk-circle9 {
-    -webkit-transform: rotate(240deg);
-        -ms-transform: rotate(240deg);
-            transform: rotate(240deg);
-  }
-  .sk-fading-circle .sk-circle10 {
-    -webkit-transform: rotate(270deg);
-        -ms-transform: rotate(270deg);
-            transform: rotate(270deg);
-  }
-  .sk-fading-circle .sk-circle11 {
-    -webkit-transform: rotate(300deg);
-        -ms-transform: rotate(300deg);
-            transform: rotate(300deg); 
-  }
-  .sk-fading-circle .sk-circle12 {
-    -webkit-transform: rotate(330deg);
-        -ms-transform: rotate(330deg);
-            transform: rotate(330deg); 
-  }
-  .sk-fading-circle .sk-circle2:before {
-    -webkit-animation-delay: -1.1s;
-            animation-delay: -1.1s; 
-  }
-  .sk-fading-circle .sk-circle3:before {
-    -webkit-animation-delay: -1s;
-            animation-delay: -1s; 
-  }
-  .sk-fading-circle .sk-circle4:before {
-    -webkit-animation-delay: -0.9s;
-            animation-delay: -0.9s; 
-  }
-  .sk-fading-circle .sk-circle5:before {
-    -webkit-animation-delay: -0.8s;
-            animation-delay: -0.8s; 
-  }
-  .sk-fading-circle .sk-circle6:before {
-    -webkit-animation-delay: -0.7s;
-            animation-delay: -0.7s; 
-  }
-  .sk-fading-circle .sk-circle7:before {
-    -webkit-animation-delay: -0.6s;
-            animation-delay: -0.6s; 
-  }
-  .sk-fading-circle .sk-circle8:before {
-    -webkit-animation-delay: -0.5s;
-            animation-delay: -0.5s; 
-  }
-  .sk-fading-circle .sk-circle9:before {
-    -webkit-animation-delay: -0.4s;
-            animation-delay: -0.4s;
-  }
-  .sk-fading-circle .sk-circle10:before {
-    -webkit-animation-delay: -0.3s;
-            animation-delay: -0.3s;
-  }
-  .sk-fading-circle .sk-circle11:before {
-    -webkit-animation-delay: -0.2s;
-            animation-delay: -0.2s;
-  }
-  .sk-fading-circle .sk-circle12:before {
-    -webkit-animation-delay: -0.1s;
-            animation-delay: -0.1s;
-  }
-  
-  @-webkit-keyframes sk-circleFadeDelay {
-    0%, 39%, 100% { opacity: 0; }
-    40% { opacity: 1; }
-  }
-  
-  @keyframes sk-circleFadeDelay {
-    0%, 39%, 100% { opacity: 0; }
-    40% { opacity: 1; } 
-  }

package/src/app/chatlib/list-conversations-component/ion-list-conversations/ion-list-conversations.component.ts

@@ -7,10 +7,13 @@ import { Platform } from '@ionic/angular';
 import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
 import { TranslateService } from '@ngx-translate/core';
+
 import * as moment from 'moment';
 // import { EventsService } from 'src/app/services/events-service';
 // import { TiledeskService } from '../../../services/tiledesk/tiledesk.service';
 import { NetworkService } from '../../../services/network-service/network.service';
+import { AppConfigProvider } from 'src/app/services/app-config';
+import { DomSanitizer } from '@angular/platform-browser'
 // import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 // import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
 
@@ -29,8 +32,8 @@ export class IonListConversationsComponent extends ListConversationsComponent im
   public logger: LoggerService = LoggerInstance.getInstance();
   public currentYear: any;
   public browserLang: string;
-  public isOnline: boolean = true;
-  public checkInternet: boolean;
+ 
+  public PROJECT_FOR_PANEL: any;
 
   /**
    * 
@@ -45,7 +48,9 @@ export class IonListConversationsComponent extends ListConversationsComponent im
     private translate: TranslateService,
     // private events: EventsService,
     // private tiledeskService: TiledeskService,
-    private networkService: NetworkService
+    private networkService: NetworkService,
+    private appConfigProvider: AppConfigProvider,
+    private sanitizer: DomSanitizer,
   ) {
     super(iterableDiffers, kvDiffers)
     this.browserLang = this.translate.getBrowserLang();
@@ -62,31 +67,23 @@ export class IonListConversationsComponent extends ListConversationsComponent im
 
     this.currentYear = moment().format('YYYY');
     this.logger.log('[ION-LIST-CONVS-COMP] - currentYear ', this.currentYear)
+
+    const DASHBOARD_BASE_URL = this.appConfigProvider.getConfig().dashboardUrl;
+
+    // console.log('[ION-LIST-CONVS-COMP] - DASHBOARD_BASE_URL ', DASHBOARD_BASE_URL)
+    this.PROJECT_FOR_PANEL = this.sanitizer.bypassSecurityTrustResourceUrl(DASHBOARD_BASE_URL + '#/project-for-panel');
   }
 
   ngOnInit() {
     this.isApp = this.platform.is('ios') || this.platform.is('android')
     this.logger.log('[ION-LIST-CONVS-COMP] - ngOnInit - IS-APP ', this.isApp)
     this.logger.log('[ION-LIST-CONVS-COMP] - ngOnInit - Platform', this.platform.platforms());
-    this.watchToConnectionStatus();
   }
 
+ 
 
-  watchToConnectionStatus() {
-
-    this.networkService.checkInternetFunc().subscribe(isOnline => {
-      this.checkInternet = isOnline
-      this.logger.log('[ION-LIST-CONVS-COMP] - watchToConnectionStatus - isOnline', this.checkInternet)
 
-      // checking internet connection
-      if (this.checkInternet == true) {
 
-        this.isOnline = true;
-      } else {
-        this.isOnline = false;
-      }
-    });
-  }
   // --------------------------------------------------
   // subdsribe to event
   // --------------------------------------------------

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

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

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

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

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

@@ -3,6 +3,7 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { ToastController, IonInput } from '@ionic/angular';
 import { AppConfigProvider } from '../../../services/app-config';
 
+
 // Logger
 import { LoggerService } from 'src/chat21-core/providers/abstract/logger.service';
 import { LoggerInstance } from 'src/chat21-core/providers/logger/loggerInstance';
@@ -59,7 +60,7 @@ export class LoginComponent implements OnInit {
     this.buildForm();
     this.DASHBOARD_URL = this.appConfig.getConfig().dashboardUrl;
     this.logger.log('LOGIN-COMP OnInit DASHBOARD_URL', this.DASHBOARD_URL)
-    this.showSpinnerInLoginBtn = false;
+    // this.showSpinnerInLoginBtn = false;
   }
   // ngAfterViewChecked() {
   //   this.emailInputEl.setFocus()

package/src/app/components/conversation-detail/bubble-my-message/bubble-my-message.component.ts

@@ -61,7 +61,7 @@ export class BubbleMyMessageComponent implements OnInit {
   * alla chiusura controllo su quale opzione ho premuto e attivo l'azione corrispondete
   */
  presentPopover(event, msg) {
-  console.log('presentPopover');
+  // console.log('presentPopover');
   // let popover = this.popoverCtrl.create(PopoverPage, { typePopup: TYPE_POPUP_DETAIL_MESSAGE, message: msg });
   // popover.present({
   //   ev: event

package/src/app/components/conversation-detail/bubble-others-message/bubble-others-message.component.ts

@@ -62,7 +62,7 @@ export class BubbleOthersMessageComponent implements OnInit {
   }
 
   presentPopover(event, msg) {
-    console.log('presentPopover');
+    // console.log('presentPopover');
   }
 
 }

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

@@ -1,25 +1,27 @@
+
 <ion-header no-border class="ion-no-border">
   <ion-toolbar>
     
     <ion-buttons slot="start">
-      <ion-back-button *ngIf="isMobile"
-          defaultHref="conversations-list"
-          (click)="pushPage('conversations-list')">
+      <!-- (click)="pushPage('conversations-list')" -->
+      <ion-back-button text="" *ngIf="isMobile"
+          defaultHref="/conversations-list"
+         >
       </ion-back-button> 
     </ion-buttons>
 
     <ion-title [class.info-open]="openInfoConversation || openInfoMessage">
 
-      <div *ngIf="conversationAvatar" class="">
-        
-        <div *ngIf="conversationAvatar" class="avatar-container">
+      <div *ngIf="conversationAvatar" class="avatar-and-typing-wpr">
+        <!-- [ngStyle] = "{ 'left': platformName === 'ios' ? '55px' : ''  }" -->
+        <div *ngIf="conversationAvatar" class="avatar-container" [ngClass] = "{ 'avatar-container-ios': platformName === 'ios' }">
           <app-avatar-profile
             [itemAvatar] = conversationAvatar
           ></app-avatar-profile>
         </div>
-
-        <div *ngIf="isDirect" class="user-presence">
-          <app-user-presence
+        <!-- [ngStyle] = "{ 'left': platformName === 'ios' ? '63px' : ''  }" -->
+        <div *ngIf="isDirect" class="user-presence" [ngClass] = "{ 'user-presence-ios': platformName === 'ios' }">
+          <app-user-presence 
             [idUser] = conversationAvatar.conversation_with
             [translationMap] = translationMap
             [borderColor] = borderColor
@@ -39,9 +41,12 @@
         </div>
 
       </div>
-
-      <div *ngIf="conversationAvatar" class="tile-info-with" (click)="onOpenCloseInfoConversation()">        
-        <span class="tile-username">{{ conversationAvatar.conversation_with_fullname }} </span>
+      <!-- [ngClass] = "{ 'tile-info-with-ios': platformName === 'ios' ? '82px' : ''82px''  }" -->
+      <div *ngIf="conversationAvatar" class="tile-info-with" (click)="onOpenCloseInfoConversation()" 
+      [ngClass] = "{ 'tile-info-with-ios': platformName === 'ios' }">        
+        <!-- <span class="tile-username">{{ conversationAvatar.conversation_with_fullname }} </span> -->
+        <span class="tile-username">{{ conversation_with_fullname }} </span>
+        
       </div>
 
       <!-- <div *ngIf="conversationWithFullname" class="tile-info-with" (click)="onOpenCloseInfoConversation()">