@subiz/widget-v4 4.1.161 → 4.1.163

package/dist/HASH

@@ -1 +1 @@
-1989dde475e
+198a2dde018

package/dist/screenshoot.js

@@ -7202,6 +7202,13 @@ class MessageInput extends common/* Com */.Mw {
   }
   focus() {
     if (this.props.disabled) return;
+    const activeElement = document.activeElement;
+    let focused = false;
+    if (activeElement) {
+      if (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA') focused = true;
+      if (activeElement.hasAttribute('contenteditable') && activeElement.getAttribute('contenteditable') === 'true') focused = true;
+    }
+    if (focused) return;
     this.refMessageInput.current && this.refMessageInput.current.focus();
     util/* default */.A.setTimeout(() => {
       this.refMessageInput.current && this.refMessageInput.current.focus();
@@ -8848,7 +8855,7 @@ class Event extends common/* Com */.Mw {
     let ev = this.props.event.ev;
     let attachments = util/* default */.A.get(ev, 'data.message.attachments');
     let hasForm = util/* default */.A.find(attachments, att => att.type === 'form');
-    if (ev.id === 'evshpgaeetsplfqprzmynrvrl') hasForm = true;
+    if (isEmptyMessage(util/* default */.A.get(ev, 'data.message'))) return null;
     this.tryLoadOrder(ev);
     let t = new util/* default */.A.Date(ev.created).toLocaleString();
     if (util/* default */.A.get(ev, 'by.type') !== 'user') {
@@ -9117,6 +9124,10 @@ class Event extends common/* Com */.Mw {
     return acc.name;
   }
 }
+function isEmptyMessage(msg) {
+  if (!msg) return true;
+  if (!msg.text && !msg.block && !util/* default */.A.size(msg.attachments)) return true;
+}
 ;// ./src/chatbox/Events.js
 
 
@@ -11737,7 +11748,25 @@ class lib_Widget {
     return this.store.sendConversion(formid, values, impressiontoken);
   }
   startConvo(req) {
-    if (!req.is_light) return this.store.startConvo(req);else return this.store.startLightConvo(req.bot_id, req.welcome_message, req.locale, req.is_testing, req.bot_version);
+    req = util/* default */.A.cloneDeep(req) || {};
+    if (req.welcome_message) {
+      return this.store.startLightConvo(req.bot_id, req.welcome_message, req.locale, req.is_testing, req.bot_version);
+    }
+    let members = req.members || [];
+    if (req.bot_id) {
+      let botid = req.bot_id;
+      delete req.bot_id;
+      if (!util/* default */.A.find(members, m => b.id == botid)) {
+        members.push({
+          type: 'bot',
+          id: botid,
+          bot_version: req.bot_version
+        });
+      }
+    }
+    req.members = members;
+    req.initial_by = this.store.matchUser().id;
+    return this.store.startConvo(req);
   }
   async showGreeting() {
     await this.domGate.entry();

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@subiz/widget-v4",
-	"version": "4.1.161",
+	"version": "4.1.163",
 	"main": "./compiled_src/lib.js",
 	"scripts": {
 		"dev": "npx webpack serve --config webpack.dev.js",

package/src/chatbox/Event.js

@@ -234,7 +234,8 @@ export default class Event extends Com {
 		let ev = this.props.event.ev
 		let attachments = sb.get(ev, 'data.message.attachments')
 		let hasForm = sb.find(attachments, (att) => att.type === 'form')
-		if (ev.id === 'evshpgaeetsplfqprzmynrvrl') hasForm = true
+		if (sb.isEmptyMessage(sb.get(ev, 'data.message'))) return null
+
 		this.tryLoadOrder(ev)
 		let t = new sb.Date(ev.created).toLocaleString()
 		// message of agent

package/src/chatbox/MessageInput.js

@@ -242,6 +242,16 @@ export default class MessageInput extends Com {
 
 	focus() {
 		if (this.props.disabled) return
+		// check document has current input focused, so we dont interupt the compose procedure
+		const activeElement = document.activeElement
+		let focused = false
+		if (activeElement) {
+			if (activeElement.tagName === 'INPUT' || activeElement.tagName === 'TEXTAREA') focused = true
+			if (activeElement.hasAttribute('contenteditable') && activeElement.getAttribute('contenteditable') === 'true')
+				focused = true
+		}
+		if (focused) return
+
 		this.refMessageInput.current && this.refMessageInput.current.focus()
 		sb.setTimeout(() => {
 			this.refMessageInput.current && this.refMessageInput.current.focus()

package/src/chatbox/TextMessage.js

@@ -73,7 +73,7 @@ export default class TextMessage extends Com {
 	}
 
 	renderBlock(block) {
-		if (isEmptyBlock(block)) return null
+		if (sb.isEmptyBlock(block)) return null
 		let t = new sb.Date(sb.get(this.props.ev, 'created')).toLocaleString()
 		let byType = sb.get(this.props.ev, 'by.type')
 		if (byType !== 'user') byType = 'agent'
@@ -94,15 +94,3 @@ export default class TextMessage extends Com {
 		)
 	}
 }
-
-function isEmptyBlock(block) {
-	if (!block || !block.type) return true
-	let hasContent =
-		sb.size(
-			sb.filter(
-				sb.map(block.content, (block) => isEmptyBlock(block)),
-				(isEmpty) => !isEmpty,
-			),
-		) > 0
-	return !sb.trim(block.text) && !hasContent
-}

package/src/lib.js

@@ -218,12 +218,12 @@ class Widget {
 		return this.store.sendConversion(formid, values, impressiontoken)
 	}
 
+	// req.bot_id != "" -> start conversation with bot id
 	startConvo(req) {
 		req = sb.cloneDeep(req) || {}
 		if (req.welcome_message) {
 			return this.store.startLightConvo(req.bot_id, req.welcome_message, req.locale, req.is_testing, req.bot_version)
 		}
-		console.log(req)
 		let members = req.members || []
 		if (req.bot_id) {
 			let botid = req.bot_id

package/src/store/store.js

@@ -1067,8 +1067,6 @@ export default class Store {
 		let {body: convo, error} = await this.api.start(req)
 		this.convoGate.open()
 
-
-
 		if (error) return {error}
 		this._setConvo(convo)
 		return {convo}

package/src/util/common.js

@@ -12,7 +12,7 @@ var op = require('./op.js')
  * @return  Array           The HSL representation
  */
 export function rgbToHsl(r, g, b) {
-	;(r /= 255), (g /= 255), (b /= 255)
+	;((r /= 255), (g /= 255), (b /= 255))
 
 	var max = Math.max(r, g, b),
 		min = Math.min(r, g, b)
@@ -721,9 +721,9 @@ export function replaceCssVariable(css, setting) {
 				'desktop_button.height',
 				'desktop_button.margin_x',
 				'desktop_button.margin_y',
-        'form_header_font_size',
-        'form_desc_font_size',
-        'form_input_label_font_size',
+				'form_header_font_size',
+				'form_desc_font_size',
+				'form_input_label_font_size',
 				'width',
 				'height',
 			].includes(path)
@@ -1548,3 +1548,20 @@ function absLink(url) {
 	if (!url.startsWith('http://') && !url.startsWith('https://') && !url.startsWith('//')) return 'http://' + url
 	return url
 }
+
+export function isEmptyBlock(block) {
+	if (!block || !block.type) return true
+	let hasContent =
+		size(
+			filter(
+				map(block.content, (block) => isEmptyBlock(block)),
+				(isEmpty) => !isEmpty,
+			),
+		) > 0
+	return !trim(block.text) && !hasContent
+}
+
+export function isEmptyMessage(msg) {
+	if (!msg) return true
+	if (!msg.text && isEmptyBlock(msg.block) && !size(msg.attachments)) return true
+}

package/tracking.js

@@ -0,0 +1,44 @@
+// send signal to server when the chatbox is not visible
+
+setTimeout(() => {
+	var $button = document.querySelector('div.chat-button')
+
+	let status = ''
+	if ($button) {
+		var rect = $button.getBoundingClientRect()
+		var visible = rect.width > 0 && rect.height > 0
+		if (visible) {
+			// the chatbox is visible
+			return
+		} else {
+			// the chatbox is not visible
+			status = 'hidden'
+		}
+	} else {
+		// the chatbox is not found in DOM
+		status = 'not-found'
+	}
+
+	// Collect device and browser info
+	var info = {
+		status: status,
+		userAgent: navigator.userAgent,
+		platform: navigator.platform,
+		language: navigator.language,
+		timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+	}
+
+	// Send via XHR
+	var xhr = new XMLHttpRequest()
+	xhr.open('POST', 'https://api.subiz.com.vn/4.1/chatbox-failed', true)
+	xhr.withCredentials = false
+	xhr.setRequestHeader('Content-Type', 'text/plain')
+
+	xhr.onreadystatechange = function () {
+		if (xhr.readyState === XMLHttpRequest.DONE) {
+			console.log('Server responded with:', xhr.status, xhr.responseText)
+		}
+	}
+
+	xhr.send(JSON.stringify(info))
+}, 10000)