@chat21/chat21-web-widget 5.0.54 → 5.0.56-rc.1

package/CHANGELOG.md

@@ -1,5 +1,14 @@
 # chat21-web-widget ver 5.0
 
+### 5.0.56-rc.1
+- added: custom colors to senderFullname to better distinguish the user
+- bug-fixed: cannot read text.trim() of undefined if no text is sent with an image
+- bug-fixed: markdown not split work correctly
+- bug-fixed: dispose loader bubbles if wait command message is received
+
+### 5.0.55 in PROD
+- added: preflight property to /message API body
+
 ### 5.0.54 in PROD
 
 ### 5.0.53-rc.8

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@chat21/chat21-web-widget",
   "author": "Tiledesk SRL",
-  "version": "5.0.54",
+  "version": "5.0.56-rc.1",
   "license": "MIT",
   "homepage": "https://www.tiledesk.com",
   "repository": {

package/src/app/component/conversation-detail/conversation-content/conversation-content.component.html

@@ -5,7 +5,7 @@
     <div class="c21-body-content" tabindex="1520" aria-label=" messaggi della conversazione: ">
   
       <!-- CONTENT !isNewConversation && [class.active]="isShowSpinner"  -->
-      <span *ngIf="messages && this.messages.length === 0">
+      <span *ngIf="messages && this.messages.length === 0 && !isTypings">
         <user-typing class="loading"
           [color]="stylesMap?.get('iconColor')"
           [translationMap]="translationMap"
@@ -34,7 +34,7 @@
                             <!--backgroundColor non viene ancora usato -->
                             <!-- class="messages msg_sent slide-in-right" -->
                             <chat-bubble-message class="messages msg_sent"
-                              [class.no-background]="(isImage(message) || isFrame(message)) && message?.text.trim() === '' "  
+                              [class.no-background]="(isImage(message) || isFrame(message)) && message?.text && message?.textmessage?.text.trim() === '' "  
                               [class.emoticon]="isEmojii(message?.text)"
                               [ngStyle]="{'background': stylesMap.get('bubbleSentBackground'), 'color': stylesMap.get('bubbleSentTextColor')}"
                               [ngClass]="{'button-in-msg' : message?.metadata && message?.metadata?.button}"
@@ -70,7 +70,7 @@
                             <!-- [ngClass]="{'slide-in-left': !isFirstMessage(message?.sender, i)}"  -->
                             <chat-bubble-message class="messages msg_receive"
                               [ngClass]="{'slide-in-left': false}"
-                              [class.no-background]="(isImage(message) || isFrame(message)) && message?.text.trim() === '' "  
+                              [class.no-background]="(isImage(message) || isFrame(message)) && message?.text && message?.text.trim() === '' "  
                               [class.emoticon]="isEmojii(message?.text)"
                               [style.margin-left]="isSameSender(message?.sender, i)? '50px': null"
                               [ngStyle]="{'background': stylesMap.get('bubbleReceivedBackground'), 'color': stylesMap.get('bubbleReceivedTextColor')}"

package/src/app/component/message/bubble-message/bubble-message.component.html

@@ -6,8 +6,8 @@
     
     <div>
 
-      <div *ngIf="messageType(MESSAGE_TYPE_OTHERS, message) && !isSameSender" 
-        [style.color]="convertColorToRGBA(fontColor, 65)"
+      <div *ngIf="messageType(MESSAGE_TYPE_OTHERS, message) && !isSameSender"
+        [style.color]="fullnameColor"
         [ngStyle]="{'margin': (isImage(message) || isFrame(message))? '10px 16px 8px 16px': '10px 8px 0px 8px'}" class="message_sender_fullname">
         {{message?.sender_fullname}}
       </div>

package/src/app/component/message/bubble-message/bubble-message.component.ts

@@ -7,6 +7,7 @@ import { MESSAGE_TYPE_MINE, MESSAGE_TYPE_OTHERS } from 'src/chat21-core/utils/co
 import { convertColorToRGBA } from 'src/chat21-core/utils/utils';
 import { isFile, isFrame, isImage, messageType } from 'src/chat21-core/utils/utils-message';
 import { MAX_WIDTH_IMAGES, MIN_WIDTH_IMAGES} from 'src/chat21-core/utils/constants';
+import { getColorBck } from 'src/chat21-core/utils/utils-user';
 
 @Component({
   selector: 'chat-bubble-message',
@@ -36,7 +37,7 @@ export class BubbleMessageComponent implements OnInit {
   MESSAGE_TYPE_OTHERS = MESSAGE_TYPE_OTHERS;
  // ========== end:: check message type functions ======= //
   sizeImage : { width: number, height: number}
-
+  fullnameColor: string;
   private logger: LoggerService = LoggerInstance.getInstance()
   constructor(public sanitizer: DomSanitizer) { }
 
@@ -48,6 +49,13 @@ export class BubbleMessageComponent implements OnInit {
       this.sizeImage = this.getMetadataSize(this.message.metadata)
     }
 
+    if(this.fontColor){
+      this.fullnameColor = convertColorToRGBA(this.fontColor, 65)
+    }
+    if(this.message && this.message.sender_fullname && this.message.sender_fullname.trim() !== ''){
+      this.fullnameColor = getColorBck(this.message.sender_fullname)
+    }
+
   }
 
   /**

package/src/app/component/message/text/text.component.scss

@@ -28,5 +28,5 @@ p {
 }
 
 p ::ng-deep a {
-    word-break: break-all
+    word-break: break-word;
 }

package/src/assets/twp/index.html

@@ -288,13 +288,14 @@
                 }
             }, 1000);
             
+            setTimeout(() => {
+                document.getElementById("preloader").style.display = "none";
+            }, 1000);
+
         });
         
         window.Tiledesk('onInit', function(event_data) {
             console.log("onInit Tiledesk FN", event_data); 
-            setTimeout(() => {
-                document.getElementById("preloader").style.display = "none";
-            }, 1000);
             //open widget after 3s if is closed
             // setTimeout(() => {
             //     if(event_data && event_data.detail && event_data.detail.global && !event_data.detail.global.isOpen){

package/src/chat21-core/providers/tiledesk/tiledesk-requests.service.ts

@@ -60,7 +60,9 @@ export class TiledeskRequestsService {
         Authorization: token
       })
     };
-    const body = message;
+    let body = message;
+    body['preflight'] = true
+    
     return this.http.post(url, body, httpOptions).toPromise().then(res => {
       this.logger.log('[TILEDESK-SERVICE] - SEND MESSAGE TO A REQUEST res ', res);
       return res

package/src/chat21-core/utils/utils.ts

@@ -5,21 +5,8 @@ import 'moment/locale/it.js';
 import * as firebase from 'firebase/app';
 import 'firebase/storage';
 
-import { environment } from '../../environments/environment';
 // tslint:disable-next-line:max-line-length
-import {
-  MAX_WIDTH_IMAGES,
-  STORAGE_PREFIX,
-  TYPE_DIRECT,
-  TYPE_SUPPORT_GROUP
-} from './constants';
-
-import {
-  avatarPlaceholder,
-  getColorBck,
-  getImageUrlThumbFromFirebasestorage
- } from './utils-user';
-import { time } from 'console';
+
 import { ConversationModel } from '../models/conversation';
 /**
  * Shortest description  for phone and tablet
@@ -226,19 +213,6 @@ export function supports_html5_session() {
   }
 }
 
-export function setStoragePrefix(): string{
-  let prefix = STORAGE_PREFIX;
-  try {
-      // const sv = 'sv' + environment.shemaVersion + '_';
-      // prefix = prefix + sv;
-      prefix = environment.storage_prefix + '_';
-  } catch (e) {
-      this.g.wdLog(['> Error :' + e]);
-  }
-  return prefix + this.g.projectid + '_';
-}
-
-
 export function convertMessage(messageText) {
   if (messageText) {
     messageText = convert(messageText);
@@ -568,24 +542,6 @@ export function getDateDifference(startTimestampDate, endTimestampDate){
   return {days, hours, minutes}
 }
 
-
-// export function getUrlImgProfile(uid: string) {
-//   const baseLocation = this.g.baseLocation;
-//   if (!uid || uid === 'system' ) {
-//     return baseLocation + IMG_PROFILE_BOT;
-//   } else if ( uid === 'error') {
-//     return baseLocation + IMG_PROFILE_DEFAULT;
-//   } else {
-//       return getImageUrlThumb(uid);
-//   }
-// }
-
-export function getImageUrlThumb(FIREBASESTORAGE_BASE_URL_IMAGE: string, uid: string) {
-  let imageurl = FIREBASESTORAGE_BASE_URL_IMAGE + environment['firebaseConfig'].storageBucket + '/o/profiles%2F' + uid + '%2Fthumb_photo.jpg?alt=media';
-  return imageurl;
-}
-
-
 /**
  *
  * @param string