@chat21/chat21-ionic 3.0.59 → 3.0.60-rc1

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # chat21-ionic ver 3.0
 
+### 3.0.60-rc1
+- Adds the ability to view canned responses by clicking on the button with the "flash" icon located to the left of the "Enter a message" text area
+
+### 3.0.59.2
+- Fixes the bug: when the agent refreshes the chat page and the chat is in mobile mode, the badge with the number of unassigned conversations does not work
+
+### 3.0.59.1
+- Fixes the bug: "Unable to read uid of undefined" error occurs when agent logs out
+- Fixes the bug: When the agent logs into the chat and the chat is in mobile mode, no conversations are displayed
+- Fixes the bug: the websocket is initialized even if the supportMode property is set to false
+- Fixes the bug: when the agent refreshes the chat page and the chat is in mobile mode, the badge with the number of unassigned conversations does not work
+
 ### 3.0.59
 - Deploys in production 
 
@@ -7,7 +19,6 @@
 - Fixes the bug: the badge indicating the number of unassigned conversations does not update correctly when the project is changed
 - Changes the code that prevent the chat from opening in a new browser tab if the chat tab is already open
 - Publish conversations returned by subscription to websocket conversations > "on data" callback
-- Conditions the opening of websockets to "supportMode" set to true
 
 ### 3.0.59-rc22
 - Minor improvements
@@ -101,6 +112,9 @@
 - Fixes the bug: in the avatar-profile component the properties 'avatarUrl', 'color' and 'avatar' are private and accessible only within the class
 - Fixes the bug: on ios platforms the back button in the conversation details header overlaps the avatar
 
+### 3.0.58.1
+- Fix the bug: if the "chatEngine" property value is set to "mqtt "the login modal window does not disappear even if the agent is logged in
+
 ### 3.0.58
 - Changes the logic with which the 'online' / 'offline' event is published (done before by the onAuthStateChanged() method)
 - Removes the setTimeout set for displaying the login window

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@chat21/chat21-ionic",
-    "version": "3.0.59",
+    "version": "3.0.60-rc1",
     "author": "Tiledesk SRL",
     "homepage": "https://ionicframework.com/",
     "scripts": {

package/src/app/app.component.ts

@@ -98,7 +98,7 @@ export class AppComponent implements OnInit {
   public missingConnectionToast: any
   public executedInitializeAppByWatchConnection: boolean = false;
   private version: string;
-
+ 
   // private isOnline: boolean = false;
 
   wsService: WebSocketJs;
@@ -148,22 +148,9 @@ export class AppComponent implements OnInit {
 
     // this.listenToUrlChanges();
     // this.getPageState();
+  }
 
-    // location.subscribe((val) => {
-
-    //   console.log('location subscribe val', val)
-    //   if (val.type == "hashchange") {
-    //     const convId = getParameterByName('convId')
-    //     console.log('[APP-COMP] ngOnInit convId get with getParameterByName  ', convId)
-    //     const requesterFullaname = getParameterByName('requester_fullaname')
-    //     console.log('[APP-COMP] ngOnInit convId get with getParameterByName  ', requesterFullaname);
-
-    //     this.navigateToDetail(convId, requesterFullaname)
 
-    //     this.events.publish('convid:haschanged', convId);
-    //   }
-    // });
-  }
 
   listenChatAlreadyOpenWithoutParamsInMobileMode() {
     this.events.subscribe('noparams:mobile', (isAlreadyOpenInMobileMode) => {
@@ -349,7 +336,7 @@ export class AppComponent implements OnInit {
       //       const msg = { action: "hasArchived", parameter: event.data.parameter, calledBy: event.data.calledBy }
       //       iframeWin.contentWindow.postMessage(msg, '*');
       //     }
-          
+
       //   }
       // }
       if (event && event.data && event.data.action && event.data.text) {
@@ -679,8 +666,8 @@ export class AppComponent implements OnInit {
     // }
 
     if (checkPlatformIsMobile()) {
-      // this.chatManager.startApp()
-      
+      this.chatManager.startApp();
+
       this.logger.log('[APP-COMP] checkPlatformIsMobile', checkPlatformIsMobile());
       this.platformIs = PLATFORM_MOBILE;
       const IDConv = this.route.snapshot.firstChild.paramMap.get('IDConv');
@@ -693,7 +680,7 @@ export class AppComponent implements OnInit {
       // this.router.navigateByUrl(pageUrl);
       // this.navService.setRoot(ConversationListPage, {});
     } else {
-      // this.chatManager.startApp()
+      this.chatManager.startApp();
       this.logger.log('[APP-COMP] checkPlatformIsMobile', checkPlatformIsMobile());
       this.platformIs = PLATFORM_DESKTOP;
       // console.log('[APP-COMP]  platformIs', this.platformIs);
@@ -815,7 +802,7 @@ export class AppComponent implements OnInit {
       .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) {
@@ -868,16 +855,16 @@ export class AppComponent implements OnInit {
  * @param user
  */
   goOnLine = () => {
-    // console.log('[APP-COMP] - GO-ONLINE ');
+    this.logger.log('[APP-COMP]- GO-ONLINE ');
     // 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 supportmode = this.appConfigProvider.getConfig().supportMode;
-    this.logger.log('[APP-COMP] - GO-ONLINE - supportmode ', supportmode);
+    // const supportmode = this.appConfigProvider.getConfig().supportMode;
+    // this.logger.log('[APP-COMP] - GO-ONLINE - supportmode ', supportmode);
     // if (supportmode === true) {
-      this.connetWebsocket(tiledeskToken)
+    //   this.connetWebsocket() // moved in the comp project-item
     // }
     this.events.publish('go:online', true);
     const currentUser = this.tiledeskAuthService.getCurrentUser();
@@ -885,7 +872,7 @@ export class AppComponent implements OnInit {
     this.logger.log('[APP-COMP] - GO-ONLINE - currentUser ', currentUser);
     this.chatManager.setTiledeskToken(tiledeskToken);
     this.chatManager.setCurrentUser(currentUser);
-    this.chatManager.startApp();
+    // this.chatManager.startApp();
 
     // ----------------------------------------------
     // PUSH NOTIFICATIONS
@@ -912,26 +899,16 @@ export class AppComponent implements OnInit {
     }
   }
 
-  connetWebsocket(tiledeskToken) {
-    const appconfig = this.appConfigProvider.getConfig();
-    this.logger.log('connetWebsocket appconfig wsUrl ', appconfig.wsUrl)
-    const WS_URL = appconfig.wsUrl + '?token=' + tiledeskToken
-    this.webSocketJs.init(
-      WS_URL,
-      undefined,
-      undefined,
-      undefined
-    );
-  }
+
 
 
   goOffLine = () => {
-    console.log('[APP-COMP] - GO-OFFLINE');
+    this.logger.log('[APP-COMP] - GO-OFFLINE');
     const supportmode = this.appConfigProvider.getConfig().supportMode;
     this.logger.log('[APP-COMP] - GO-OFFINE - supportmode ', supportmode);
-    // if (supportmode === true) {
-      this.webSocketClose()
-    // }
+    if (supportmode === true) {
+        this.webSocketClose()
+    }
     // this.isOnline = false;
     // this.conversationsHandlerService.conversations = [];
     this.chatManager.setTiledeskToken(null);

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

@@ -75,7 +75,7 @@
 </ion-item-sliding> -->
 
 
-<ion-item button="true" lines="none" class="ion-no-padding" [class.ion-selected]="conversation.uid === uidConvSelected"
+<ion-item button="true" lines="none" class="ion-no-padding" [class.ion-selected]="conversation?.uid === uidConvSelected"
   *ngFor="let conversation of listConversations" (click)="openConversationByID(conversation)" detail=false>
   <div tabindex="0"></div>
 

package/src/app/components/conversation-detail/message-text-area/message-text-area.component.html

@@ -1,64 +1,82 @@
-<ion-grid>
+<!-- <ion-grid>
   <ion-row id="message-text-area">
-
     <ion-col col-auto>
-
       <div class="buttons-left">
-    
-        <!-- <ion-button class="attach-button" ion-button fill="clear" style="display: none;">
-          <input type="file" accept="image/*" capture="camera" (change)="onFileSelected($event)" id="fileInput" />
-          <label for="fileInput" icon-only ion-button>
-            <ion-icon slot="icon-only" name="attach"></ion-icon>
-          </label>
-        </ion-button> -->
 
         <ion-button ion-button fill="clear" class="upload-image-btn">
-          
-          <ion-icon slot="icon-only" lazy="true" name="attach-outline" style="font-size: 30px;transform: rotate(42deg);"></ion-icon>
-          <!-- <ion-label slot="end">Upload Image</ion-label> -->
-          <!-- <input #fileInput type="file" (change)="onFileSelected($event)" capture="camera" id="file-input" accept="image/*, .pdf,.zip"> -->
-          <!-- https://stackoverflow.com/questions/11832930/html-input-file-accept-attribute-file-type-csv?rq=1 -->
-          <!-- <input #fileInput type="file" (change)="onFileSelected($event)" capture="camera" id="file-input" accept="image/*, audio/* ,video/*, text/html, text/plain, .csv, .pdf,.doc,.docx,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document, .scss, .css, .json"> -->
+          <ion-icon slot="icon-only" lazy="true" name="attach-outline"
+            style="font-size: 30px;transform: rotate(42deg);"></ion-icon>
           <input #fileInput type="file" (change)="onFileSelected($event)" capture="camera" id="file-input"
             [accept]="fileUploadAccept">
-
         </ion-button>
       </div>
 
-
       <div class="text-message">
-        <!-- [value]=""  -->
-        <!-- placeholder="{{ 'LABEL_ENTER_MSG' | translate }}" -->
-        <!-- (ionBlur)="txtfocus(0)" -->
-        <!-- autofocus="true" -->
-        <!-- autoFocus="true" // directive -->
-
-        <ion-textarea id="ion-textarea" #messageTextArea #message_text_area #textArea rows="1" 
-          [placeholder]="TEXAREA_PLACEHOLDER"
-          autosize="false" 
-          auto-grow="true" 
-          autofocus="true"
-          [value]=""
-          [(ngModel)]="messageString" 
-          (ionChange)="ionChange($event);"
-          (keydown.enter)="onKeydown($event, messageString)"
-          (paste)="onPaste($event)">
+        <ion-textarea id="ion-textarea" #messageTextArea #message_text_area #textArea rows="1"
+          [placeholder]="TEXAREA_PLACEHOLDER" autosize="false" auto-grow="true" autofocus="true" [value]=""
+          [(ngModel)]="messageString" (ionChange)="ionChange($event);"
+          (keydown.enter)="onKeydown($event, messageString)" (paste)="onPaste($event)">
         </ion-textarea>
-        <!-- (ionInput)="onChange($event);" -->
       </div>
 
       <div class="buttons-right">
-        <!-- [disabled]="conversationEnabled === false" -->
-        <ion-button [disabled]="conversationEnabled === false"  class="send-button right active" ion-button fill="clear"
+        <ion-button [disabled]="conversationEnabled === false" class="send-button right active" ion-button fill="clear"
           (click)="sendMessage(messageString)">
-          <ion-icon [ngClass]="{'send-msg-disabled': conversationEnabled === false,'send-msg-activated': conversationEnabled === true }" slot="icon-only" name="send"></ion-icon>
+          <ion-icon
+            [ngClass]="{'send-msg-disabled': conversationEnabled === false,'send-msg-activated': conversationEnabled === true }"
+            slot="icon-only" name="send"></ion-icon>
         </ion-button>
       </div>
     </ion-col>
+  </ion-row>
+</ion-grid> -->
 
+<!-- --------------------------------------------------------------------------------------------------------------------- -->
+<!-- ----------new -->
+<ion-grid>
+  <ion-row id="message-text-area">
 
+    <ion-col col-auto>
 
+      <div class="start-buttons" style="position: absolute;display: flex;"> 
 
-  </ion-row>
+        <div class="canned-responses-btn-wpr" style="margin-left: -5px;" tooltip="{{translationMap?.get('CANNED_RESPONSES')}}" [options]="tooltipOptions" placement="top">
+          
+          <ion-button ion-button fill="clear" class="canned-responses-btn" (click)="openCannedResponses()" [disabled]="!IS_SUPPORT_GROUP_CONVERSATION">
+            <ion-icon slot="icon-only" lazy="true" name="flash-outline" style="font-size: 24px;"></ion-icon>
+          </ion-button>
+       
+        </div>
 
+        <div class="upload-image-btn-wpr" tooltip="{{translationMap?.get('UPLOAD')}}" [options]="tooltipOptions">
+          <ion-button ion-button fill="clear" class="upload-image-btn">
+            <ion-icon slot="icon-only" lazy="true" name="attach-outline"
+              style="font-size: 30px;transform: rotate(42deg);"></ion-icon>
+            <input #fileInput type="file" (change)="onFileSelected($event)" capture="camera" id="file-input"
+              [accept]="fileUploadAccept">
+             
+          </ion-button>
+         
+        </div>
+      </div>
+
+      <div class="text-message">
+        <ion-textarea id="ion-textarea" #messageTextArea #message_text_area #textArea rows="1"
+          [placeholder]="TEXAREA_PLACEHOLDER" autosize="false" auto-grow="true" autofocus="true" [value]=""
+          [(ngModel)]="messageString" (ionChange)="ionChange($event);"
+          (keydown.enter)="onKeydown($event, messageString)" (paste)="onPaste($event)">
+        </ion-textarea>
+      </div>
+
+      <div class="buttons-right">
+        <ion-button [disabled]="conversationEnabled === false" class="send-button right active" ion-button fill="clear"
+          (click)="sendMessage(messageString)">
+          <ion-icon
+            [ngClass]="{'send-msg-disabled': conversationEnabled === false,'send-msg-activated': conversationEnabled === true }"
+            slot="icon-only" name="send"></ion-icon>
+        </ion-button>
+      </div>
+    </ion-col>
+
+  </ion-row>
 </ion-grid>

package/src/app/components/conversation-detail/message-text-area/message-text-area.component.scss

@@ -42,8 +42,10 @@
     }
     .text-message {
         position: relative;
-        margin: 0 35px;
-        width: calc(100% - 70px);
+        // margin: 0 35px;
+        // width: calc(100% - 70px);
+        margin: 0 70px;
+        width: calc(100% - 100px);
         ion-textarea {
             // border-radius: 4px;
             border-radius: 20px; // NK edited
@@ -97,10 +99,21 @@
     --border-radius: 50%;
     --padding-end: 1px;
     --padding-start: 1px;
-
     height: 33px !important;
 }
 
+
+.canned-responses-btn {
+    --padding-bottom: 0px;
+    --padding-top: 0px;
+    --border-radius: 50%;
+    --padding-end: 1px;
+    --padding-start: 1px;
+    height: 33px !important;
+    width: 30px;
+} 
+
+
 .upload-image-btn .button-native {
     border-radius: 50%;
 }

package/src/app/components/conversation-detail/message-text-area/message-text-area.component.ts

@@ -50,6 +50,7 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
   @Input() translationMap: Map<string, string>;
   @Input() dropEvent: any;
   @Output() eventChangeTextArea = new EventEmitter<object>();
+  @Output() hasClickedOpenCannedResponses = new EventEmitter<boolean>();
   @Output() eventSendMessage = new EventEmitter<object>();
   @Output() onPresentModalScrollToBottom = new EventEmitter<boolean>();
 
@@ -64,9 +65,21 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
   public currentWindowWidth: any;
   private logger: LoggerService = LoggerInstance.getInstance();
   public countClicks: number = 0;
+  public IS_SUPPORT_GROUP_CONVERSATION: boolean;
 
   TYPE_MSG_TEXT = TYPE_MSG_TEXT;
 
+  tooltipOptions = {
+    'show-delay': 500,
+    'tooltip-class': 'chat-tooltip',
+    'theme': 'light',
+    'shadow': false,
+    'hide-delay-mobile': 0,
+    'hideDelayAfterClick': 3000,
+    'hide-delay': 200
+  };
+
+
   /**
    * Constructor
    * @param chooser 
@@ -103,11 +116,18 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
 
 
   ngOnChanges() {
-
     if (this.translationMap) {
-      this.LONG_TEXAREA_PLACEHOLDER = this.translationMap.get('LABEL_ENTER_MSG')
-      this.SHORT_TEXAREA_PLACEHOLDER = this.translationMap.get('LABEL_ENTER_MSG_SHORT')
-      this.SHORTER_TEXAREA_PLACEHOLDER = this.translationMap.get('LABEL_ENTER_MSG_SHORTER')
+      // this.LONG_TEXAREA_PLACEHOLDER = this.translationMap.get('LABEL_ENTER_MSG')
+      // this.SHORT_TEXAREA_PLACEHOLDER = this.translationMap.get('LABEL_ENTER_MSG_SHORT')
+      // this.SHORTER_TEXAREA_PLACEHOLDER = this.translationMap.get('LABEL_ENTER_MSG_SHORTER')
+
+      this.TEXAREA_PLACEHOLDER = this.translationMap.get('LABEL_ENTER_MSG_SHORT')
+    }
+
+    if (this.conversationWith.startsWith("support-group")) {
+      this.IS_SUPPORT_GROUP_CONVERSATION = true
+    } else {
+      this.IS_SUPPORT_GROUP_CONVERSATION = false
     }
 
     this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngOnChanges DROP EVENT ", this.dropEvent);
@@ -120,21 +140,20 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
     }
     // if (this.isOpenInfoConversation === true) {
     // this.getIfTexareaIsEmpty('ngOnChanges')
-    this.getWindowWidth();
+    // this.getWindowWidth();
     // }
   }
 
   // ngAfterViewInit() {
   ngAfterViewInit() {
 
-    this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngAfterViewInit message_text_area ", this.message_text_area);
-    this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngAfterViewInit messageTextArea ", this.messageTextArea);
+    // console.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngAfterViewInit message_text_area ", this.message_text_area);
+    // console.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngAfterViewInit messageTextArea ", this.messageTextArea);
     if (this.messageTextArea) {
       setTimeout(() => {
 
-
         const elTextArea = this.message_text_area['el'];
-        // this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngAfterViewInit elTextArea ", elTextArea);
+        // console.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngAfterViewInit elTextArea ", elTextArea);
         // this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] ngAfterViewInit elTextArea children", elTextArea.children);
         if (elTextArea.children.length === 1) {
 
@@ -148,10 +167,8 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
           }
         }
 
-
         // this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] set focus on ", this.messageTextArea);
         // Keyboard.show() // for android
-
         this.messageTextArea.setFocus();
 
       }, 1500); //a least 150ms.
@@ -162,46 +179,19 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
   getWindowWidth(): any {
     this.currentWindowWidth = window.innerWidth;
 
-    // if ((this.currentWindowWidth < 1045 && this.currentWindowWidth > 835) && this.isOpenInfoConversation === true) {
-    //   this.logger.log("[CONVS-DETAIL] [MSG-TEXT-AREA] DISPLAY SHORT_TEXAREA_PLACEHOLDER ");
-    //   // this.TEXAREA_PLACEHOLDER = '';
-    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-    // } else if (this.currentWindowWidth < 835 && this.isOpenInfoConversation === true) {
-    //   this.logger.log("[CONVS-DETAIL] [MSG-TEXT-AREA] DISPLAY SHORTER_TEXAREA_PLACEHOLDER ");
-
 
+    // if (this.currentWindowWidth >= 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.LONG_TEXAREA_PLACEHOLDER;
+    //   this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] currentWindowWidth', this.currentWindowWidth, ' - DISPLAY LONG_TEXAREA_PLACEHOLDER ');
+    // } else if (this.currentWindowWidth >= 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
+    // } else if (this.currentWindowWidth < 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
+    // } else if (this.currentWindowWidth < 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
     //   this.TEXAREA_PLACEHOLDER = this.SHORTER_TEXAREA_PLACEHOLDER;
-    //   // this.TEXAREA_PLACEHOLDER = '';
-
-    // } else 
-    // this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] currentWindowWidth ", this.currentWindowWidth);
-    // this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] isOpenInfoConversation', this.isOpenInfoConversation);
-    // this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] this.conversationWith.startsWith("support-group")', this.conversationWith.startsWith("support-group"));
-
-
-    if (this.currentWindowWidth >= 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
-
-      this.TEXAREA_PLACEHOLDER = this.LONG_TEXAREA_PLACEHOLDER;
-
-      this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] currentWindowWidth', this.currentWindowWidth, ' - DISPLAY LONG_TEXAREA_PLACEHOLDER ');
-
-
-    } else if (this.currentWindowWidth >= 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
-      this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-
-
-    } else if (this.currentWindowWidth < 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
-
-      this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-
-    } else if (this.currentWindowWidth < 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
-
-      this.TEXAREA_PLACEHOLDER = this.SHORTER_TEXAREA_PLACEHOLDER;
-
-    } else if (!this.conversationWith.startsWith("support-group")) {
-      this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-
-    }
+    // } else if (!this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
+    // }
 
     // this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] checkPlatformIsMobile() ", checkPlatformIsMobile());
     if (checkPlatformIsMobile() === true) {
@@ -214,11 +204,7 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
       }
 
     }
-    // if (checkPlatformIsMobile &&  this.currentWindowWidth <= 430) {
-    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-    // } else if (checkPlatformIsMobile &&  this.currentWindowWidth > 430) { 
-    //   this.TEXAREA_PLACEHOLDER = this.LONG_TEXAREA_PLACEHOLDER;
-    // }
+
   }
 
   // -------------------------------------------------------------------------------------------
@@ -228,36 +214,20 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
   onResize(event) {
     // this.getIfTexareaIsEmpty('onResize')
     this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA]  event.target.innerWidth; ", event.target.innerWidth);
-    // if ((event.target.innerWidth < 1045 && event.target.innerWidth > 835) && this.isOpenInfoConversation === true) {
-    //   this.logger.log("[CONVS-DETAIL] [MSG-TEXT-AREA]  ON RESIZE DISPAY SHORT_TEXAREA_PLACEHOLDER");
-    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-    // } else if (event.target.innerWidth < 835 && this.isOpenInfoConversation === true) {
-    //   this.TEXAREA_PLACEHOLDER = this.SHORTER_TEXAREA_PLACEHOLDER;
-    // } else {
-    //   this.TEXAREA_PLACEHOLDER = this.LONG_TEXAREA_PLACEHOLDER;
-
-
-    if (event.target.innerWidth >= 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
-      this.TEXAREA_PLACEHOLDER = this.LONG_TEXAREA_PLACEHOLDER;
-      // this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] - else - DISPLAY LONG_TEXAREA_PLACEHOLDER ');
-      // this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] - else - this.currentWindowWidth ', this.currentWindowWidth);
+    
 
-    } else if (event.target.innerWidth >= 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
-      this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
 
-
-    } else if (event.target.innerWidth < 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
-
-      this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-
-    } else if (event.target.innerWidth < 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
-
-      this.TEXAREA_PLACEHOLDER = this.SHORTER_TEXAREA_PLACEHOLDER;
-
-    } else if (!this.conversationWith.startsWith("support-group")) {
-      this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
-
-    }
+    // if (event.target.innerWidth >= 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.LONG_TEXAREA_PLACEHOLDER;
+    // } else if (event.target.innerWidth >= 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
+    // } else if (event.target.innerWidth < 844 && this.isOpenInfoConversation === false && this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
+    // } else if (event.target.innerWidth < 844 && this.isOpenInfoConversation === true && this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.SHORTER_TEXAREA_PLACEHOLDER;
+    // } else if (!this.conversationWith.startsWith("support-group")) {
+    //   this.TEXAREA_PLACEHOLDER = this.SHORT_TEXAREA_PLACEHOLDER;
+    // }
 
     // this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] checkPlatformIsMobile() ', checkPlatformIsMobile());
     if (checkPlatformIsMobile() === true) {
@@ -476,7 +446,6 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
       this.conversationEnabled = false;
     }
 
-
     this.eventChangeTextArea.emit({ msg: message, offsetHeight: height });
   }
 
@@ -530,7 +499,7 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
         this.logger.log("[CONVS-DETAIL] replaceTagInMessage onKeydown in msg-texarea SEND MESSAGE 2 message: ", message);
         this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] onKeydown - SEND MESSAGE 2 message value: ', message.value);
         this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] onKeydown - SEND MESSAGE 2 text: ', text);
-      
+
         this.logger.log("[CONVS-DETAIL] replaceTagInMessage onKeydown in msg-texarea SEND MESSAGE 2 this.tagsCannedFilter.length: ", this.tagsCannedFilter.length);
         this.logger.log("[CONVS-DETAIL] replaceTagInMessage onKeydown in msg-texarea SEND MESSAGE 2 this.countClicks: ", this.countClicks);
         this.logger.log("[CONVS-DETAIL][MSG-TEXT-AREA] onKeydown in msg-texarea SEND MESSAGE 2 this.countClicks: ", this.countClicks);
@@ -539,7 +508,7 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
 
         this.sendMessage(text);
         this.countClicks = 0
-      } else if (text.includes("/") && pos > 0 && this.countClicks > 1 && this.tagsCannedFilter.length > 0 && text.substr(-1) !== '/' ) {
+      } else if (text.includes("/") && pos > 0 && this.countClicks > 1 && this.tagsCannedFilter.length > 0 && text.substr(-1) !== '/') {
         this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] onKeydown - tagsCannedFilter.length 3: ', this.tagsCannedFilter.length);
         this.logger.log("[CONVS-DETAIL] replaceTagInMessage onKeydown in msg-texarea SEND MESSAGE 3 message: ", message);
         // this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] onKeydown - SEND MESSAGE 3 message value: ', message.value);
@@ -565,6 +534,25 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
       }
     }
   }
+  openCannedResponses() {
+    // console.log('[MSG-TEXT-AREA] has clicked OPEN-CANNED-RESPONSES messageString ', this.messageString)
+    // if (this.messageString) {
+    //   console.log('[MSG-TEXT-AREA] has clicked OPEN-CANNED-RESPONSES messageString.trim ', this.messageString.trim)
+    // }  
+    // if (this.messageString === undefined) {
+    //   this.messageString = '/'
+    // } else {
+
+    // }
+
+    // const elTextArea = this.message_text_area['el'];
+    // console.log('[MSG-TEXT-AREA]   textArea elTextArea ', elTextArea)
+    // const textArea = elTextArea.getElementsByTagName('ion-textarea')[0];
+    // console.log("[MSG-TEXT-AREA]   textArea textArea ", textArea);
+    // this.logger.log("[MSG-TEXT-AREA]   textArea value", textArea.value)
+
+    this.hasClickedOpenCannedResponses.emit(true);
+  }
 
 
   sendMessage(text: string) {
@@ -625,11 +613,7 @@ export class MessageTextAreaComponent implements OnInit, AfterViewInit, OnChange
 
     // Note: on mac keyboard "metakey" matches "cmd"
     if (event.key === 'Enter' && event.altKey || event.key === 'Enter' && event.ctrlKey || event.key === 'Enter' && event.metaKey) {
-
-
-
       this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] HAS PRESSED COMBO KEYS this.messageString', this.messageString);
-
       if (this.messageString !== undefined && this.messageString.trim() !== '') {
         this.logger.log('[CONVS-DETAIL][MSG-TEXT-AREA] HAS PRESSED Enter + ALT this.messageString', this.messageString);
         this.messageString = this.messageString + "\r\n"

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

@@ -9,6 +9,7 @@ import { CustomTranslateService } from 'src/chat21-core/providers/custom-transla
 import { TiledeskAuthService } from 'src/chat21-core/providers/tiledesk/tiledesk-auth.service';
 import { TiledeskService } from 'src/app/services/tiledesk/tiledesk.service';
 import { WebSocketJs } from 'src/app/services/websocket/websocket-js';
+import { AppConfigProvider } from 'src/app/services/app-config';
 
 @Component({
   selector: 'app-project-item',
@@ -38,16 +39,39 @@ export class ProjectItemComponent implements OnInit {
     public tiledeskAuthService: TiledeskAuthService,
     public tiledeskService: TiledeskService,
     public webSocketJs: WebSocketJs,
+    private appConfigProvider: AppConfigProvider,
   ) { }
 
   ngOnInit() {
-    this.getLastProjectStoredAndSubscToWSAvailabilityAndConversations();
-    this.getStoredToken();
+    this.getStoredTokenAndConnectWS();
     this.getStoredCurrenUser();
     this.translations();
     this.listenToPostMsgs();
     this.onInitWindowWidth();
+    // console.log('[PROJECT-ITEM] - on INIT')
+  }
 
+  getStoredTokenAndConnectWS() {
+    this.tiledeskToken = this.appStorageService.getItem('tiledeskToken');
+    this.logger.log('[PROJECT-ITEM] - STORED TILEDEK TOKEN ', this.tiledeskToken)
+    this.connetWebsocket( this.tiledeskToken) 
+  }
+
+  connetWebsocket(tiledeskToken) {
+   
+    this.logger.log('[WEBSOCKET-JS] connetWebsocket called in [PROJECT-ITEM] tiledeskToken ',tiledeskToken)
+    const appconfig = this.appConfigProvider.getConfig();
+    this.logger.log('[WEBSOCKET-JS] connetWebsocket called in [PROJECT-ITEM] wsUrl ', appconfig.wsUrl)
+    const WS_URL = appconfig.wsUrl + '?token=' + tiledeskToken
+    this.logger.log('[WEBSOCKET-JS] connetWebsocket called in [PROJECT-ITEM] wsUrl ', WS_URL)
+    this.webSocketJs.init(
+      WS_URL,
+      undefined,
+      undefined,
+      undefined
+    );
+
+    this.getLastProjectStoredAndSubscToWSAvailabilityAndConversations();
   }
 
   listenToPostMsgs() {
@@ -104,11 +128,7 @@ export class ProjectItemComponent implements OnInit {
 
 
 
-  getStoredToken() {
-    this.tiledeskToken = this.appStorageService.getItem('tiledeskToken');
-    this.logger.log('[PROJECT-ITEM] - STORED TILEDEK TOKEN ', this.tiledeskToken)
-
-  }
+ 
 
   getStoredCurrenUser() {
     const storedCurrentUser = this.appStorageService.getItem('currentUser');
@@ -134,9 +154,9 @@ export class ProjectItemComponent implements OnInit {
     if (!stored_project) {
       this.logger.log('PROJECT-ITEM - THERE IS NOT STORED LAST PROJECT ', stored_project)
       const tiledeskToken = this.appStorageService.getItem('tiledeskToken');
-      this.logger.log('[INFO-CONTENT-COMP] - GET PROJECTS - tiledeskToken', tiledeskToken);
+      this.logger.log('[PROJECT-ITEM] - GET PROJECTS - tiledeskToken', tiledeskToken);
       this.tiledeskService.getProjects(tiledeskToken).subscribe(projects => {
-        this.logger.log('[INFO-CONTENT-COMP] - GET PROJECTS - RES', projects);
+        this.logger.log('[PROJECT-ITEM - GET PROJECTS - RES', projects);
 
         this.logger.log('[INFO-CONTENT-COMP] - GET PROJECTS - RES this.project', this.project);
 
@@ -147,7 +167,7 @@ export class ProjectItemComponent implements OnInit {
         }
 
       }, (error) => {
-        this.logger.error('[INFO-CONTENT-COMP] - GET PROJECTS - ERROR  ', error);
+        this.logger.error('[PROJECT-ITEM] - GET PROJECTS - ERROR  ', error);
 
       }, () => {
         this.logger.log('[INFO-CONTENT-COMP] - GET PROJECTS * COMPLETE *');

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

@@ -51,11 +51,12 @@ import { NgxLinkifyjsModule } from 'ngx-linkifyjs';
     SharedModule,
     NgxLinkifyjsModule,
   ],
-  entryComponents: [MessageTextAreaComponent],
+  // entryComponents: [MessageTextAreaComponent],
+  entryComponents: [],
   declarations: [
     ConversationDetailPage,
     HeaderConversationDetailComponent,
-    MessageTextAreaComponent,
+    // MessageTextAreaComponent,
     // BubbleDayMessageComponent,
     // BubbleSystemMessageComponent,
     // BubbleMyMessageComponent,

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

@@ -159,6 +159,7 @@
               [conversationWith]="conversationWith" 
               [tagsCannedFilter]="tagsCannedFilter"
               (eventChangeTextArea)="returnChangeTextArea($event)" 
+              (hasClickedOpenCannedResponses)="hasClickedOpenCannedResponses($event)"
               (eventSendMessage)="returnSendMessage($event)"
               [translationMap]="translationMap" 
               [fileUploadAccept]="appConfigProvider.getConfig().fileUploadAccept"

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

@@ -415,7 +415,9 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
       'FAILED_TO_UPLOAD_THE_FORMAT_IS NOT_SUPPORTED',
       'NO_INFORMATION_AVAILABLE',
       'CONTACT_ID',
-      'USER_ID'
+      'USER_ID',
+      "UPLOAD",
+      "CANNED_RESPONSES"
     ];
 
     this.translationMap = this.customTranslateService.translateLanguage(keys);
@@ -983,6 +985,8 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     }
   }
 
+
+
   // ----------------------------------------------------------
   // @ CANNED RESPONSES methods
   // ----------------------------------------------------------
@@ -1153,6 +1157,61 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   }
 
 
+  hasClickedOpenCannedResponses($event) {
+    this.logger.log('[CONVS-DETAIL] - hasClickedOpenCannedResponses ',  $event) 
+    const elTextArea = this.rowTextArea['el'];
+    const textArea = elTextArea.getElementsByTagName('ion-textarea')[0];
+ 
+    this.logger.log("[CONVS-DETAIL] replaceTagInMessage  textArea ", textArea);
+    this.logger.log("[CONVS-DETAIL] replaceTagInMessage  textArea value", textArea.value)
+    this.insertAtCursor(textArea, '/')
+   }
+
+   insertAtCursor(myField, myValue) {
+    this.logger.log('[CANNED-RES-EDIT-CREATE] - insertAtCursor - myValue ', myValue );
+    this.logger.log('[CANNED-RES-EDIT-CREATE] - insertAtCursor - myField ', myField ); 
+    
+      myValue = ' ' + myValue;
+      this.logger.log('[CANNED-RES-EDIT-CREATE] - GET TEXT AREA - QUI ENTRO myValue ', myValue );
+    
+   
+    //IE support
+    if (myField.selection) {
+      myField.focus();
+      let sel = myField.selection.createRange();
+      sel.text = myValue;
+      // this.cannedResponseMessage = sel.text;
+    }
+    //MOZILLA and others
+    else if (myField.selectionStart || myField.selectionStart == '0') {
+      var startPos = myField.selectionStart;
+      this.logger.log('[CANNED-RES-EDIT-CREATE] - insertAtCursor - startPos ', startPos);
+      
+      var endPos = myField.selectionEnd;
+      this.logger.log('[CANNED-RES-EDIT-CREATE] - insertAtCursor - endPos ', endPos);
+      
+      myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length);
+  
+      // place cursor at end of text in text input element
+      myField.focus();
+      var val = myField.value; //store the value of the element
+      myField.value = ''; //clear the value of the element
+      myField.value = val + ' '; //set that value back. 
+  
+      // this.cannedResponseMessage = myField.value;
+
+      // this.texareaIsEmpty = false;
+      // myField.select();
+    } else {
+      myField.value += myValue;
+      // this.cannedResponseMessage = myField.value;
+    }
+  }
+
+
+   
+
+
   @HostListener('document:keydown', ['$event'])
   handleKeyboardEvent(event: KeyboardEvent) {
     // this.logger.log("CONVERSATION-DETAIL handleKeyboardEvent  event.key ", event.key);

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

@@ -597,7 +597,9 @@ export class ConversationListPage implements OnInit {
     this.tenant = appconfig.firebaseConfig.tenant;
     this.logger.log('[CONVS-LIST-PAGE] - initialize -> firebaseConfig tenant ', this.tenant);
 
-    this.loggedUserUid = this.tiledeskAuthService.getCurrentUser().uid;
+    if (this.tiledeskAuthService.getCurrentUser()) {
+      this.loggedUserUid = this.tiledeskAuthService.getCurrentUser().uid;
+    }
     this.subscriptions = [];
     this.initConversationsHandler();
     this.initVariables();

package/src/app/services/websocket/websocket-js.ts

@@ -88,7 +88,7 @@ export class WebSocketJs {
       // this.ws =  new WebSocket("wss://tiledesk-server-pre.herokuapp.com/?token=JWT eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI1ZGRkMzBiZmYwMTk1ZjAwMTdmNzJjNmQiLCJlbWFpbCI6InByZWdpbm9AZjIxdGVzdC5pdCIsImZpcnN0bmFtZSI6Ikdpbm8iLCJsYXN0bmFtZSI6IlByZSIsImVtYWlsdmVyaWZpZWQiOnRydWUsImlhdCI6MTYwODgwNjY0MCwiYXVkIjoiaHR0cHM6Ly90aWxlZGVzay5jb20iLCJpc3MiOiJodHRwczovL3RpbGVkZXNrLmNvbSIsInN1YiI6InVzZXIiLCJqdGkiOiI1YmVmMDcxYy00ODBlLTQzYzQtOTRhYS05ZjQxYzMyNDcxMGQifQ.wv6uBn2P6H9wGb5WCYQkpPEScMU9PB1pBUzFouhJk20");
 
       this.logger.log('[WEBSOCKET-JS] - REF - READY STATE ≠ 1 > OPEN WS AND THEN SUBSCRIBE TO TOPICS');
-      // this.logger.log('% »»» WebSocketJs WF *** REF *** WS 2 ', this.ws);
+      this.logger.log('% »»» WebSocketJs WF *** REF *** WS 2 ', this.ws);
 
       var that = this;
       if (this.ws) {
@@ -96,6 +96,9 @@ export class WebSocketJs {
           that.logger.log('[WEBSOCKET-JS] - REF - OPEN EVENT *** ', event);
           that.subscribe(topic);
         });
+      } else {
+  
+        
       }
 
       if (this.topics.indexOf(topic) === -1) {
@@ -277,7 +280,7 @@ export class WebSocketJs {
       // onmessage Ottieni il battito cardiaco restituito per indicare che la connessione è normale
       if (this.ws && this.ws.readyState == 1) {
 
-        // this.logger.log("[WEBSOCKET-JS] - HEART-START - SEND PING-MSG");
+        this.logger.log("[WEBSOCKET-JS] - HEART-START - SEND PING-MSG");
 
         this.send(JSON.stringify(this.pingMsg), 'HEART-START')
 
@@ -289,7 +292,7 @@ export class WebSocketJs {
 
       // Se non viene ripristinato dopo un determinato periodo di tempo, il backend viene attivamente disconnesso
       this.pongTimeoutId = setTimeout(() => {
-        this.logger.log("[WEBSOCKET-JS] - HEART-START - PONG-TIMEOUT-ID  - CLOSE WS ");
+   this.logger.log("[WEBSOCKET-JS] - HEART-START - PONG-TIMEOUT-ID  - CLOSE WS ");
         // se onclose Si esibirà reconnect，Eseguiamo ws.close() Bene, se lo esegui direttamente reconnect Si innescherà onclose Causa riconnessione due volte
         this.ws.close();
       }, this.pongTimeout);
@@ -326,7 +329,7 @@ export class WebSocketJs {
     // this.sendingMessages = [];//new Map();
     // this.data = [];
     // this.init(this.sendMesagesInSendingArray);
-
+    this.logger.log("[WEBSOCKET-JS] - CALLING INIT - url ", this.url);
     this.logger.log("[WEBSOCKET-JS] - CALLING INIT - topics ", this.topics);
     this.logger.log("[WEBSOCKET-JS] - CALLING INIT - url ", this.url);
     this.logger.log("[WEBSOCKET-JS] - CALLING INIT - callbacks ", this.callbacks);

package/src/app/services/websocket/websocket.service.ts

@@ -35,7 +35,7 @@ export class WebsocketService {
   subscriptionToWsCurrentProjectUserAvailability(projectid, prjctuserid) {
     var self = this;
     const path = '/' + projectid + '/project_users/' + prjctuserid
-    this.logger.log('[WS-SERV] - SUBSCR (REF) TO WS CURRENT USERS PATH: ', path);
+    // console.log('[WS-SERV] - SUBSCR (REF) TO WS CURRENT USERS PATH: ', path);
 
     return new Promise(function (resolve, reject) {
 

package/src/app/shared/shared.module.ts

@@ -40,9 +40,11 @@ import { OptionHeaderComponent } from '../components/conversation-detail/option-
 import { MessageAttachmentComponent } from '../chatlib/conversation-detail/message/message-attachment/message-attachment.component';
 import { ImageViewerComponent } from '../components/image-viewer/image-viewer.component';
 import { ProjectItemComponent } from '../components/project-item/project-item.component';
+import { MessageTextAreaComponent } from '../components/conversation-detail/message-text-area/message-text-area.component';
 
 @NgModule({
   declarations: [
+    MessageTextAreaComponent,
     AvatarProfileComponent,
     DdpHeaderComponent,
     UserPresenceComponent,
@@ -64,8 +66,7 @@ import { ProjectItemComponent } from '../components/project-item/project-item.co
     InfoMessageComponent,
     ReturnReceiptComponent,
     TextComponent,
-
-     BubbleDayMessageComponent,
+    BubbleDayMessageComponent,
     BubbleSystemMessageComponent,
     BubbleMyMessageComponent,
     BubbleOthersMessageComponent,
@@ -80,6 +81,7 @@ import { ProjectItemComponent } from '../components/project-item/project-item.co
     OptionHeaderComponent
   ],
   exports: [
+    MessageTextAreaComponent,
     AutofocusDirective,
     AvatarProfileComponent,
     DdpHeaderComponent,
@@ -89,7 +91,6 @@ import { ProjectItemComponent } from '../components/project-item/project-item.co
     UserTypingComponent,
     ListConversationsComponent,
     IonListConversationsComponent,
-
     IonConversationDetailComponent,
     ConversationContentComponent,
     AvatarComponent,
@@ -102,7 +103,6 @@ import { ProjectItemComponent } from '../components/project-item/project-item.co
     InfoMessageComponent,
     ReturnReceiptComponent,
     TextComponent,
-
     BubbleDayMessageComponent,
     BubbleSystemMessageComponent,
     BubbleMyMessageComponent,
@@ -120,7 +120,7 @@ import { ProjectItemComponent } from '../components/project-item/project-item.co
     IonicModule,
     MomentModule,
     TooltipModule
-  
+
   ],
   schemas: [
     CUSTOM_ELEMENTS_SCHEMA,

package/src/assets/i18n/en.json

@@ -187,5 +187,7 @@
   "Cancel": "Cancel",
   "AreYouSure":"Are you sure?",
   "UnassignedConversations":"Unassigned Conversations",
-  "NewConversations": "Nuove conversazioni"
+  "NewConversations": "New conversations",
+  "UPLOAD": "Upload",
+  "CANNED_RESPONSES":"Canned responses"
 }

package/src/assets/i18n/it.json

@@ -195,5 +195,7 @@
     "Cancel": "Annulla",
     "AreYouSure":"Sei sicuro?",
     "UnassignedConversations":"Conversazioni non assegnate",
-    "NewConversations": "New conversations"
+    "NewConversations": "Nuove Conversazioni",
+    "UPLOAD": "Carica",
+    "CANNED_RESPONSES":"Risposte predefinite"
 }