@chat21/chat21-ionic 3.0.75 → 3.0.76-rc.1

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

@@ -22,6 +22,7 @@ import {
   IonContent,
   IonTextarea,
   IonButton,
+  IonInput,
 } from '@ionic/angular'
 
 // models
@@ -44,7 +45,7 @@ import { ArchivedConversationsHandlerService } from 'src/chat21-core/providers/a
 import { ConversationHandlerService } from 'src/chat21-core/providers/abstract/conversation-handler.service'
 import { ContactsService } from 'src/app/services/contacts/contacts.service'
 import { CannedResponsesService } from '../../services/canned-responses/canned-responses.service'
-import { compareValues, htmlEntities } from '../../../chat21-core/utils/utils'
+import { compareValues, getDateDifference, htmlEntities } from '../../../chat21-core/utils/utils'
 import { ImageRepoService } from 'src/chat21-core/providers/abstract/image-repo.service'
 import { PresenceService } from 'src/chat21-core/providers/abstract/presence.service'
 import { CreateCannedResponsePage } from 'src/app/pages/create-canned-response/create-canned-response.page'
@@ -100,7 +101,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
 
   private unsubscribe$: Subject<any> = new Subject<any>()
   private subscriptions: Array<any>
-  public tenant: string
+  public tenant: string;
   public loggedUser: UserModel
   public conversationWith: string
   public conversationWithFullname: string
@@ -128,9 +129,10 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   public showIonContent = false
   public conv_type: string
 
+  public messageStr: string;
   public tagsCanned: any = []
   public tagsCannedCount: number
-  public tagsCannedFilter: any = []
+  public tagsCannedFilter: Array<any> = []
   public HIDE_CANNED_RESPONSES: boolean = false
 
   public window: any = window
@@ -227,6 +229,8 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
 
       this.events.publish('supportconvid:haschanged', this.conversationWith)
     })
+
+
   }
 
   // -----------------------------------------------------------
@@ -634,6 +638,8 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
       'INFO_SUPPORT_CHAT_REOPENED',
       'INFO_SUPPORT_CHAT_CLOSED',
       'INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU',
+      'INFO_SUPPORT_LEAD_UPDATED',
+      'INFO_SUPPORT_MEMBER_LEFT_GROUP',
       'LABEL_TODAY',
       'LABEL_TOMORROW',
       'LABEL_LAST_ACCESS',
@@ -758,6 +764,8 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
                 conv.conversation_with_fullname,
                 conv.channel_type,
               )
+              let duration = getDateDifference(conv.timestamp, Date.now())
+              duration.days > 10? this.disableTextarea = true: this.disableTextarea = false
             }
           })
         }
@@ -768,11 +776,14 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
       this.logger.debug('[CONV-COMP] setHeaderContent getConversationDetail: archivedConversationsHandlerService', this.conversationWith, this.conv_type)
       this.archivedConversationsHandlerService.getConversationDetail(this.conversationWith, (conv) => {
         if (conv) {
+
           this.conversationAvatar = setConversationAvatar(
             conv.conversation_with,
             conv.conversation_with_fullname,
             conv.channel_type,
           )
+          let duration = getDateDifference(conv.timestamp, Date.now())
+          duration.days > 10? this.disableTextarea = true: this.disableTextarea = false
         }
         if(!conv){
           this.conversationsHandlerService.getConversationDetail(this.conversationWith, (conv) => {
@@ -797,6 +808,8 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     // this.logger.log('[CONVS-DETAIL] - setHeaderContent > conversationAvatar: ', this.conversationAvatar);
   }
 
+
+
   returnSendMessage(e: any) {
     this.logger.log('[CONVS-DETAIL] - returnSendMessage event', e, ' - conversationWith', this.conversationWith)
 
@@ -1032,7 +1045,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
       this.conversationAvatar = setConversationAvatar(
         this.conversationWith,
         this.conversationWithFullname,
-        this.conversationAvatar.channel_type
+        this.channelType
       )
       
     }
@@ -1181,20 +1194,14 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
               // Load canned responses
               // --------------------------------------------
               this.loadTagsCanned(strSearch, this.conversationWith)
-
+              this.HIDE_CANNED_RESPONSES = false
+              this.messageStr = strSearch
               // ------------------------------------------------------------------------------------------------------------------------------------------
               // Hide / display Canned when the SLASH has POSITION POS 0 and checking if there is a space after the SLASH (in this case it will be hidden)
               // ------------------------------------------------------------------------------------------------------------------------------------------
 
-              var after_slash = message.substring(
-                message.lastIndexOf('/') + 1,
-                message.length,
-              )
-              if (
-                pos === 0 &&
-                after_slash.length === 1 &&
-                after_slash.trim() === ''
-              ) {
+              var after_slash = message.substring( message.lastIndexOf('/') + 1, message.length)
+              if (pos === 0 && after_slash.length === 1 && after_slash.trim() === '' ) {
                 this.logger.log('[CONVS-DETAIL] - returnChangeTextArea after_slash --> there is a white space after ')
                 this.HIDE_CANNED_RESPONSES = true
                 this.tagsCannedFilter = []
@@ -1203,39 +1210,39 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
                 this.HIDE_CANNED_RESPONSES = false
               }
 
-              if (pos > 0) {
-                // ------------------------------------------------------------------------------------------------------------------------------------------
-                // Hide / display Canned when the SLASH has POSITION POS > and checking if there is a space after the SLASH (in this case they it be hidden)
-                // and if there is not a space before the SLASH (in this it will be hidden)
-                // ------------------------------------------------------------------------------------------------------------------------------------------
-
-                let beforeSlash = message.substr(pos - 1)
-                let afterSlash = message.substr(pos + 1)
-                this.logger.log('[CONVS-DETAIL] - returnChangeTextArea * POS ', pos)
-
-                this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash', beforeSlash)
-                this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> afterSlash', afterSlash)
-                var afterSlashParts = afterSlash.split('/')
-                var beforeSlashParts = beforeSlash.split('/')
-                this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> afterSlash parts', afterSlashParts)
-                this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash parts', beforeSlashParts)
-
-                if (beforeSlashParts.length === 2) {
-                  if (beforeSlashParts[0].indexOf(' ') >= 0 && afterSlashParts[0] === '') {
-                    this.HIDE_CANNED_RESPONSES = false
-                    this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash there is a white space After Not')
-                    // if (beforeSlashParts[0].indexOf(' ') >= 0 && afterSlashParts[0].indexOf(' ') >= 0)
-                  } else if (beforeSlashParts[0].indexOf(' ') < 0 && afterSlashParts[0] === '') {
-                    this.HIDE_CANNED_RESPONSES = true
-                    this.tagsCannedFilter = []
-                    this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash not thete is a white space After Not')
-                  } else if (beforeSlashParts[0].indexOf(' ') >= 0 && afterSlashParts[0] === ' ') {
-                    this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash not thete is a white space After YES')
-                    this.HIDE_CANNED_RESPONSES = true
-                    this.tagsCannedFilter = []
-                  }
-                }
-              }
+              // if (pos > 0) {
+              //   // ------------------------------------------------------------------------------------------------------------------------------------------
+              //   // Hide / display Canned when the SLASH has POSITION POS > and checking if there is a space after the SLASH (in this case they it be hidden)
+              //   // and if there is not a space before the SLASH (in this it will be hidden)
+              //   // ------------------------------------------------------------------------------------------------------------------------------------------
+
+              //   let beforeSlash = message.substr(pos - 1)
+              //   let afterSlash = message.substr(pos + 1)
+              //   this.logger.log('[CONVS-DETAIL] - returnChangeTextArea * POS ', pos)
+
+              //   this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash', beforeSlash)
+              //   this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> afterSlash', afterSlash)
+              //   var afterSlashParts = afterSlash.split('/')
+              //   var beforeSlashParts = beforeSlash.split('/')
+              //   this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> afterSlash parts', afterSlashParts)
+              //   this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash parts', beforeSlashParts)
+
+              //   if (beforeSlashParts.length === 2) {
+              //     if (beforeSlashParts[0].indexOf(' ') >= 0 && afterSlashParts[0] === '') {
+              //       this.HIDE_CANNED_RESPONSES = false
+              //       this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash there is a white space After Not')
+              //       // if (beforeSlashParts[0].indexOf(' ') >= 0 && afterSlashParts[0].indexOf(' ') >= 0)
+              //     } else if (beforeSlashParts[0].indexOf(' ') < 0 && afterSlashParts[0] === '') {
+              //       this.HIDE_CANNED_RESPONSES = true
+              //       this.tagsCannedFilter = []
+              //       this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash not thete is a white space After Not')
+              //     } else if (beforeSlashParts[0].indexOf(' ') >= 0 && afterSlashParts[0] === ' ') {
+              //       this.logger.log('[CONVS-DETAIL] - returnChangeTextArea  --> beforeSlash not thete is a white space After YES')
+              //       this.HIDE_CANNED_RESPONSES = true
+              //       this.tagsCannedFilter = []
+              //     }
+              //   }
+              // }
             } else {
               this.tagsCannedFilter = []
             }
@@ -1263,12 +1270,12 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     }
 
     this.logger.log('[CONVS-DETAIL] - loadTagsCanned conversationWith_segments ', conversationWith_segments)
-    let projectId = ''
+    let project = ''
 
     if (conversationWith_segments.length === 4) {
-      projectId = conversationWith_segments[2]
-      this.logger.log('[CONVS-DETAIL] - loadTagsCanned projectId ', projectId)
-      this.getAndShowCannedResponses(strSearch, projectId)
+      project = conversationWith_segments[2]
+      this.logger.log('[CONVS-DETAIL] - loadTagsCanned projectId ', project)
+      this.getAndShowCannedResponses(strSearch, project)
     } else {
       this.getProjectIdByConversationWith(strSearch, this.conversationWith)
     }
@@ -1298,7 +1305,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     this.logger.log('[CONVS-DETAIL] - loadTagsCanned tagsCanned.length', this.tagsCanned.length)
     //if(this.tagsCanned.length <= 0 ){
     this.tagsCanned = []
-    this.cannedResponsesService.getCannedResponses(tiledeskToken, projectId).subscribe((res) => {
+    this.cannedResponsesService.getAll(tiledeskToken, projectId).subscribe((res) => {
       this.logger.log('[CONVS-DETAIL] - loadTagsCanned  getCannedResponses RES', res)
 
       this.tagsCanned = res
@@ -1328,15 +1335,18 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     if (strSearch.length > 0) {
       strReplace = "<b class='highlight-search-string'>" + strSearch + '</b>'
     }
-    for (var i = 0; i < this.tagsCannedFilter.length; i++) {
-      let text = htmlEntities(this.tagsCannedFilter[i].text);
-      // const textCanned = "<div class='cannedText'>" + this.replacePlaceholderInCanned(this.tagsCannedFilter[i].text) + '</div>'
-      const textCanned = "<div class='cannedText'>" + this.replacePlaceholderInCanned(text) + '</div>'
-      let title = htmlEntities(this.tagsCannedFilter[i].title)
-      // this.tagsCannedFilter[i].title = "<div class='cannedContent'><div class='cannedTitle'>" + this.tagsCannedFilter[i].title.toString().replace(strSearch, strReplace.trim()) + '</div>' + textCanned + '</div>'
-      this.tagsCannedFilter[i].title = "<div class='cannedContent'><div class='cannedTitle'>" + title.toString().replace(strSearch, strReplace.trim()) + '</div>' + textCanned + '</div>'
-
-    }
+    // for (var i = 0; i < this.tagsCannedFilter.length; i++) {
+    //   let text = htmlEntities(this.tagsCannedFilter[i].text);
+    //   // const textCanned = "<div class='cannedText'>" + this.replacePlaceholderInCanned(this.tagsCannedFilter[i].text) + '</div>'
+    //   const textCanned = "<div class='cannedText'>" + this.replacePlaceholderInCanned(text) + '</div>'
+    //   let title = htmlEntities(this.tagsCannedFilter[i].title)
+    //   // this.tagsCannedFilter[i].title = "<div class='cannedContent'><div class='cannedTitle'>" + this.tagsCannedFilter[i].title.toString().replace(strSearch, strReplace.trim()) + '</div>' + textCanned + '</div>'
+    //   this.tagsCannedFilter[i].title = "<div class='cannedContent'><div class='cannedTitle'>" + title.toString().replace(strSearch, strReplace.trim()) + '</div>' + textCanned + '</div>'
+    // }
+    this.tagsCannedFilter.forEach(canned => {
+      canned.text = this.replacePlaceholderInCanned(canned.text);
+      canned.disabled = true
+    });
     if (this.tagsCannedCount === 0) {
       // const button = this.renderer.createElement('button');
       // const buttonText = this.renderer.createText('Click me');
@@ -1393,7 +1403,10 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
   }
 
   replaceTagInMessage(canned, event) {
-    if (this.tagsCannedCount > 0) {
+    if(!canned.disabled){
+      event.preventDefault();
+      event.stopPropagation();
+    }else if (this.tagsCannedCount > 0) {
       // console.log('[CONVS-DETAIL] replaceTagInMessage  event ', event)
       // console.log('[CONVS-DETAIL] replaceTagInMessage  canned ', canned)
       // console.log('[CONVS-DETAIL] replaceTagInMessage  canned title', canned.title)
@@ -1438,6 +1451,52 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     }
   }
 
+  onEditCanned(canned, ev){
+    ev.preventDefault()
+    ev.stopPropagation()
+    canned.disabled = false
+    this.logger.log('[CONVS-DETAIL] onEditCanned ', canned)
+    setTimeout(() => {
+      this.el.nativeElement.querySelector('#titleCanned_'+canned._id).setFocus()
+    }, 500);
+  }
+
+  onConfirmEditCanned(canned, ev){
+    ev.preventDefault()
+    ev.stopPropagation()
+    const tiledeskToken = this.tiledeskAuthService.getTiledeskToken()
+    this.logger.log('[CONVS-DETAIL] onConfirmEditCanned ', canned, ev)
+    this.cannedResponsesService.edit(tiledeskToken, canned.id_project, canned).subscribe(cannedRes=> {
+      canned.disabled = true
+    }, (error) => {
+      this.logger.error('[CONVS-DETAIL] - onConfirmEditCanned - ERROR  ', error)
+    }, () => {
+      this.logger.log('[CONVS-DETAIL] - onConfirmEditCanned * COMPLETE *')
+    })
+  }
+  
+  onDeleteCanned(canned, ev){
+    ev.preventDefault()
+    ev.stopPropagation()
+    const tiledeskToken = this.tiledeskAuthService.getTiledeskToken()
+    this.logger.log('[CONVS-DETAIL] onDeleteCanned ', canned)
+    this.cannedResponsesService.delete(tiledeskToken, canned.id_project, canned._id).subscribe(cannedRes=> {
+      if(cannedRes.status === 1000){
+        this.tagsCannedFilter.splice(this.tagsCannedFilter.findIndex(el => el._id === canned._id), 1)
+      }
+    }, (error) => {
+      this.logger.error('[CONVS-DETAIL] - onConfirmEditCanned - ERROR  ', error)
+    }, () => {
+      this.logger.log('[CONVS-DETAIL] - onConfirmEditCanned * COMPLETE *')
+    })
+  }
+
+  closeListCannedResponse(){
+    this.logger.log('[CONVS-DETAIL] close list canned . . .  ')
+    this.HIDE_CANNED_RESPONSES = true
+    this.tagsCannedFilter = []
+  }
+
   async presentCreateCannedResponseModal(): Promise<any> {
     const elTextArea = this.rowTextArea['el']
     const textArea = elTextArea.getElementsByTagName('ion-textarea')[0]
@@ -1593,11 +1652,11 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     }, 1000)
   }
 
-  returnOnBeforeMessageRender(event) {
+  onBeforeMessageRenderFN(event) {
     //this.onBeforeMessageRender.emit(event)
   }
 
-  returnOnAfterMessageRender(event) {
+  onAfterMessageRenderFN(event) {
     // this.onAfterMessageRender.emit(event)
   }
 
@@ -1607,7 +1666,7 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
 
   returnOnScrollContent(event: boolean) { }
 
-  returnOnAttachmentButtonClicked(event: any) {
+  onAttachmentButtonClickedFN(event: any) {
     this.logger.debug('[CONV-COMP] eventbutton', event)
     if (!event || !event.target.type) {
       return
@@ -1640,9 +1699,9 @@ export class ConversationDetailPage implements OnInit, OnDestroy, AfterViewInit
     }
   }
 
-  onImageRenderedFN(event) {
+  onElementRenderedFN(event) {
     const imageRendered = event
-    if (this.showButtonToBottom) {
+    if (event.status && this.ionContentChatArea) {
       this.scrollBottom(0)
     }
   }

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

@@ -770,6 +770,11 @@ export class ConversationListPage implements OnInit {
         }
       }
     }
+
+    if(conversation.conversation_with_fullname === 'Guest '){
+      conversation.conversation_with_fullname = 'guest' + '#' + this.getUUidConversation(conversation.uid)
+    }
+
   }
 
   // isMarkdownLink(last_message_text) {
@@ -783,6 +788,27 @@ export class ConversationListPage implements OnInit {
   //   }
   // }
 
+  private getUUidConversation(uid): string{
+    const conversationWith_segments = uid.split('-')
+    // Removes the last element of the array if is = to the separator
+    if (conversationWith_segments[conversationWith_segments.length - 1] === '') {
+      conversationWith_segments.pop()
+    }
+
+    this.logger.log('[CONVS-LIST] - getUUidConversation conversationWith_segments ', conversationWith_segments, conversationWith_segments.length)
+    let mini_uid = ''
+
+    if (conversationWith_segments.length === 4) {
+      mini_uid = conversationWith_segments[conversationWith_segments.length -1].substr(0,5)
+      this.logger.log('[CONVS-LIST] - getUUidConversation mini_uid segment===4', mini_uid)
+    } else {
+      this.logger.log('[CONVS-LIST] - else  getUUidConversation segment<4 ', mini_uid)
+      mini_uid = conversationWith_segments[conversationWith_segments.length -1].substr(-5)
+    }
+
+    return mini_uid
+  }
+
   navigateByUrl(converationType: string, uidConvSelected: string) {
 
     this.logger.log('[CONVS-LIST-PAGE] navigateByUrl uidConvSelected: ', uidConvSelected)
@@ -797,7 +823,7 @@ export class ConversationListPage implements OnInit {
       let pageUrl = 'conversation-detail/' + this.uidConvSelected + '/' + this.conversationSelected.conversation_with_fullname + '/' + converationType
       this.logger.log('[CONVS-LIST-PAGE] pageURL', pageUrl)
         // replace(/\(/g, '%28').replace(/\)/g, '%29') -> used for the encoder of any round brackets
-      this.router.navigateByUrl(pageUrl.replace(/\(/g, '%28').replace(/\)/g, '%29'))
+      this.router.navigateByUrl(pageUrl.replace(/\(/g, '%28').replace(/\)/g, '%29').replace( /#/g, "%23" ))
     } else {
       this.logger.log('[CONVS-LIST-PAGE] navigateByUrl this.conversationSelected conversation_with_fullname ', this.conversationSelected.conversation_with_fullname)
       this.logger.log('[CONVS-LIST-PAGE] checkPlatformIsMobile(): ', checkPlatformIsMobile())
@@ -808,7 +834,7 @@ export class ConversationListPage implements OnInit {
       }
       this.logger.log('[CONVS-LIST-PAGE] setUidConvSelected navigateByUrl--->: ', pageUrl)
       // replace(/\(/g, '%28').replace(/\)/g, '%29') -> used for the encoder of any round brackets
-      this.router.navigateByUrl(pageUrl.replace(/\(/g, '%28').replace(/\)/g, '%29'))
+      this.router.navigateByUrl(pageUrl.replace(/\(/g, '%28').replace(/\)/g, '%29').replace( /#/g, "%23" ))
     }
   }
 

package/src/app/pages/loader-preview/loader-preview.page.ts

@@ -73,10 +73,7 @@ export class LoaderPreviewPage implements OnInit, AfterViewInit {
   }
 
   ionViewDidEnter() {
-    this.logger.log(
-      '[LOADER-PREVIEW-PAGE] ionViewDidEnter thumbnailsPreview.nativeElement.offsetHeight',
-      this.thumbnailsPreview.nativeElement.offsetHeight,
-    )
+    this.logger.log('[LOADER-PREVIEW-PAGE] ionViewDidEnter thumbnailsPreview.nativeElement.offsetHeight',this.thumbnailsPreview.nativeElement.offsetHeight)
     this.calculateHeightPreviewArea()
   }
 
@@ -86,17 +83,11 @@ export class LoaderPreviewPage implements OnInit, AfterViewInit {
     // USE CASE IMAGE
     // ---------------------------------------------------------------------
     if (file.type.startsWith('image') && !file.type.includes('svg')) {
-      this.logger.log(
-        '[LOADER-PREVIEW-PAGE] - readAsDataURL - USE CASE IMAGE file TYPE',
-        file.type,
-      )
+      this.logger.log('[LOADER-PREVIEW-PAGE] - readAsDataURL - USE CASE IMAGE file TYPE',file.type)
       const reader = new FileReader()
       reader.onloadend = (evt) => {
         const img = reader.result.toString()
-        this.logger.log(
-          '[LOADER-PREVIEW-PAGE] - readAsDataURL - FileReader success ',
-          img,
-        )
+        this.logger.log('[LOADER-PREVIEW-PAGE] - readAsDataURL - FileReader success ',img)
         this.arrayFiles.push(img)
         if (!this.fileSelected) {
           this.fileSelected = img
@@ -232,9 +223,7 @@ export class LoaderPreviewPage implements OnInit, AfterViewInit {
       this.logger.log('typeFile: ', typeFile)
 
       const reader = new FileReader()
-      reader.addEventListener(
-        'load',
-        function () {
+      reader.addEventListener('load',function () {
           const img = reader.result.toString()
           that.logger.log('FileReader success')
           that.arrayFiles.push(img)
@@ -292,13 +281,9 @@ export class LoaderPreviewPage implements OnInit, AfterViewInit {
   }
 
   calculateHeightPreviewArea() {
-    const heightThumbnailsPreview = this.thumbnailsPreview.nativeElement
-      .offsetHeight
-    const heightMessageTextArea = this.messageTextArea.nativeElement
-      .offsetHeight
-    this.heightPreviewArea = (
-      heightMessageTextArea + heightThumbnailsPreview
-    ).toString()
+    const heightThumbnailsPreview = this.thumbnailsPreview.nativeElement.offsetHeight
+    const heightMessageTextArea = this.messageTextArea.nativeElement.offsetHeight
+    this.heightPreviewArea = (heightMessageTextArea + heightThumbnailsPreview).toString()
     // this.logger.log('heightThumbnailsPreview', heightThumbnailsPreview);
     // this.logger.log('heightMessageTextArea', this.messageTextArea);
     // this.logger.log('heightPreviewArea', this.heightPreviewArea);
@@ -349,10 +334,7 @@ export class LoaderPreviewPage implements OnInit, AfterViewInit {
 
   /** */
   onSendMessage() {
-    this.logger.log(
-      '[LOADER-PREVIEW-PAGE] onSendMessage messageString:',
-      this.messageString,
-    )
+    this.logger.log('[LOADER-PREVIEW-PAGE] onSendMessage messageString:',this.messageString)
     let file = this.selectedFiles.item(0)
     const file4Load = new Image()
     const nameImg = file.name
@@ -373,7 +355,6 @@ export class LoaderPreviewPage implements OnInit, AfterViewInit {
       fileSelected: file,
       messageString: this.messageString,
       metadata: metadata,
-      type: TYPE_MSG_IMAGE,
     })
   }
 

package/src/app/services/canned-responses/canned-responses.service.ts

@@ -26,8 +26,7 @@ export class CannedResponsesService {
   }
 
 
-  public getCannedResponses(token: string, projectid: string) {
-
+  public getAll(token: string, projectid: string) {
     const cannedResponsesURL = this.apiUrl + projectid + "/canned/";
     this.logger.log('[CANNED-RESPONSES-SERVICE] getCannedResponses - URL ', cannedResponsesURL);
 
@@ -37,13 +36,50 @@ export class CannedResponsesService {
         Authorization: token
       })
     };
-
-    return this.http
-      .get(cannedResponsesURL, httpOptions)
-      .pipe(map((res: any) => {
+    
+    return this.http.get(cannedResponsesURL, httpOptions).pipe(map((res: any) => {
         this.logger.log('[CANNED-RESPONSES-SERVICE] getCannedResponses - RES ', res);
         return res
-      }))
+    }))
+  }
+
+  public edit(token: string, projectid: string, canned: any){
+    const cannedResponsesURL = this.apiUrl + projectid + "/canned/"+ canned._id;
+    this.logger.log('[CANNED-RESPONSES-SERVICE] editCannedResponses - URL ', cannedResponsesURL);
+    
+    const httpOptions = {
+      headers: new HttpHeaders({
+        'Content-Type': 'application/json',
+        Authorization: token
+      })
+    };
+
+    const body = {
+      title: canned.title,
+      text: canned.text
+    }
+
+    return this.http.put(cannedResponsesURL, body, httpOptions).pipe(map((res: any) => {
+        this.logger.log('[CANNED-RESPONSES-SERVICE] editCannedResponses - RES ', res);
+        return res
+    }))
+  }
+
+  public delete(token: string, projectid: string, cannedID: string){
+    const cannedResponsesURL = this.apiUrl + projectid + "/canned/"+cannedID;
+    this.logger.log('[CANNED-RESPONSES-SERVICE] deleteCannedResponses - URL ', cannedResponsesURL);
+
+    const httpOptions = {
+      headers: new HttpHeaders({
+        'Content-Type': 'application/json',
+        Authorization: token
+      })
+    };
+
+    return this.http.delete(cannedResponsesURL, httpOptions).pipe(map((res: any) => {
+        this.logger.log('[CANNED-RESPONSES-SERVICE] deleteCannedResponses - RES ', res);
+        return res
+    }))
   }
 
 }

package/src/app/utils/scrollbar-theme.directive.ts

@@ -24,9 +24,10 @@ export class ScrollbarThemeDirective {
       ::-webkit-scrollbar {
           width: 6px;
          height: 8px;
+         display: none;
       }
       ::-webkit-scrollbar-track {
-      background: #f9f9f9;
+        background: #f9f9f9;
       }
       ::-webkit-scrollbar-thumb {
          background-color: #b9b9b9;

package/src/assets/i18n/ar.json

@@ -65,6 +65,8 @@
         "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
         "INFO_SUPPORT_CHAT_REOPENED": "تمت إعادة فتح الدردشة",
         "INFO_SUPPORT_CHAT_CLOSED": "الدردشة مغلقة",
+        "INFO_SUPPORT_LEAD_UPDATED":"تحديث الرصاص",
+        "INFO_SUPPORT_MEMBER_LEFT_GROUP":"تمت إزالته من المجموعة",
         "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU": "تم تعيين طلب دعم جديد لك",
         "LABEL_PROFILE": "الملف الشخصي",
         "LABEL_CLOSE": "مغلق",

package/src/assets/i18n/az.json

@@ -65,6 +65,8 @@
     "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
     "INFO_SUPPORT_CHAT_REOPENED": "Çat yenidən açıldı",
     "INFO_SUPPORT_CHAT_CLOSED": "Çat bağlandı",
+    "INFO_SUPPORT_LEAD_UPDATED":"Rəqəm yeniləndi",
+    "INFO_SUPPORT_MEMBER_LEFT_GROUP":"qrupdan çıxarıldı",
     "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU": "Sizə yeni dəstək sorğusu təyin edilib",
     "LABEL_PROFILE": "Profil",
     "LABEL_CLOSE": "Bağlı",

package/src/assets/i18n/de.json

@@ -65,6 +65,8 @@
   "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
   "INFO_SUPPORT_CHAT_REOPENED": "Chat wieder geöffnet",
   "INFO_SUPPORT_CHAT_CLOSED": "Chat geschlossen",
+  "INFO_SUPPORT_LEAD_UPDATED":"Leitung aktualisiert",
+  "INFO_SUPPORT_MEMBER_LEFT_GROUP":"aus der Gruppe entfernt",
   "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU": "Ihnen wurde eine neue Support-Anfrage zugewiesen",
   "LABEL_PROFILE": "Profil",
   "LABEL_CLOSE": "Abgeschlossen",

package/src/assets/i18n/en.json

@@ -65,6 +65,8 @@
   "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
   "INFO_SUPPORT_CHAT_REOPENED": "Chat reopened",
   "INFO_SUPPORT_CHAT_CLOSED": "Chat closed",
+  "INFO_SUPPORT_LEAD_UPDATED":"Lead updated",
+  "INFO_SUPPORT_MEMBER_LEFT_GROUP":"removed from group",
   "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU": "A new support request has been assigned to you",
   "LABEL_PROFILE": "Profile",
   "LABEL_CLOSE": "Closed",

package/src/assets/i18n/es.json

@@ -65,6 +65,8 @@
   "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
   "INFO_SUPPORT_CHAT_REOPENED": "Chat reabierto",
   "INFO_SUPPORT_CHAT_CLOSED": "Chat cerrado",
+  "INFO_SUPPORT_LEAD_UPDATED":"Cliente potencial actualizado",
+  "INFO_SUPPORT_MEMBER_LEFT_GROUP":"eliminado del grupo",
   "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU":"Se le ha asignado una nueva solicitud de soporte",
   "LABEL_PROFILE": "Perfil",
   "LABEL_CLOSE": "Cerrado",

package/src/assets/i18n/fr.json

@@ -65,6 +65,8 @@
   "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
   "INFO_SUPPORT_CHAT_REOPENED": "Chat rouvert",
   "INFO_SUPPORT_CHAT_CLOSED": "Chat fermé",
+  "INFO_SUPPORT_LEAD_UPDATED":"Prospect mis à jour",
+  "INFO_SUPPORT_MEMBER_LEFT_GROUP":"supprimé du groupe",
   "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU": "Une nouvelle demande de support vous a été attribuée",
   "LABEL_PROFILE": "Profil",
   "LABEL_CLOSE": "Fermé",

package/src/assets/i18n/it.json

@@ -65,6 +65,8 @@
     "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
     "INFO_SUPPORT_CHAT_REOPENED": "Chat riaperta",
     "INFO_SUPPORT_CHAT_CLOSED": "Chat chiusa",
+    "INFO_SUPPORT_LEAD_UPDATED":"Contatto aggiornato",
+    "INFO_SUPPORT_MEMBER_LEFT_GROUP":"rimosso dal gruppo",
     "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU":"Una nuova richiesta di supporto è stata assegnata a te",
     "LABEL_PROFILE": "Profilo",
     "LABEL_CLOSE": "Chiusa",

package/src/assets/i18n/kk.json

@@ -65,6 +65,8 @@
     "INFO_SUPPORT_USER_ADDED_MESSAGE": "{{ subject }} {{ verb }} {{ complement }}",
     "INFO_SUPPORT_CHAT_REOPENED": "Чат қайта ашылды",
     "INFO_SUPPORT_CHAT_CLOSED": "Чат жабылды",
+    "INFO_SUPPORT_LEAD_UPDATED":"Жетекші жаңартылды",
+    "INFO_SUPPORT_MEMBER_LEFT_GROUP":"топтан шығарылды",
     "INFO_A_NEW_SUPPORT_REQUEST_HAS_BEEN_ASSIGNED_TO_YOU": "Сізге жаңа қолдау сұрауы тағайындалды",
     "LABEL_PROFILE": "Профиль",
     "LABEL_CLOSE": "Жабық",