@subiz/widget-v4 4.0.85 → 4.0.88

package/src/chatbox/Widget.js

@@ -18,7 +18,7 @@ const defaultAvatar = 'https://file-subiz.com/fiqoahedjbgwclpouoml-avatar_defaul
 import Spinner from './spinner.js'
 import Time from './time.js'
 import {Com} from '../common.js'
-import {h} from 'preact'
+import {h, createRef} from 'preact'
 
 //  ['cid', 'view', 'isShow'], 	// view: chat, list
 export default class Widget extends Com {
@@ -36,6 +36,7 @@ export default class Widget extends Com {
 		this.props.store.onUpdate(this, (_) => this.forceUpdate())
 	}
 
+	msgInput = createRef()
 	componentDidMount() {
 		if (!this.props.store.isMobile()) this.focusInput()
 	}
@@ -484,7 +485,7 @@ export default class Widget extends Com {
 
 	blur() {
 		if (this.props.store.isPreview) return
-		var $input = this.msgInput
+		var $input = this.msgInput.current
 		if (!$input) return
 		setTimeout(() => $input && $input.blur())
 		setTimeout(() => $input && $input.blur(), 300) // force lose focus
@@ -512,7 +513,7 @@ export default class Widget extends Com {
 			return
 		}
 
-		var $input = this.msgInput
+		var $input = this.msgInput.current
 		if (!$input) return
 		setTimeout(() => $input.focus())
 		setTimeout(() => $input.focus(), 300) // force focus
@@ -524,7 +525,7 @@ export default class Widget extends Com {
 		this.focusInput()
 	}
 
-	async sendMessage(message) {
+	sendMessage = async (message) => {
 		let text = message.text
 		if (!this.props.cid) {
 			this.creating = true
@@ -554,9 +555,9 @@ export default class Widget extends Com {
 		let $input = (
 			<MessageInput
 				store={this.props.store}
-				ref={(ref) => (this.msgInput = ref)}
+				ref={this.msgInput}
 				cid={this.props.cid}
-				onSend={(e) => this.sendMessage(e)}
+				onSend={this.sendMessage}
 				t={this.props.t}
 			/>
 		)
@@ -578,6 +579,7 @@ export default class Widget extends Com {
 						isShow={this.props.isShow}
 						onLink={this.onLink}
 						store={this.props.store}
+						chatbox={this.props.plugin.chatbox || {}}
 						onFormSubmit={(e) => this.onEventFormSubmit(e)}
 						ref={(ref) => (this.events = ref)}
 						cid={this.props.cid}
@@ -679,6 +681,7 @@ export default class Widget extends Com {
 	}
 
 	renderConvoSummary(convo) {
+		let accountSetting = this.props.plugin.chatbox || {}
 		let agentM = this.props.store.matchAgent('*')
 
 		let ags = sb.filter(convo.members, (m) => {
@@ -688,9 +691,8 @@ export default class Widget extends Com {
 		agentids = agentids || sb.agentsOfConvo(convo)[0]
 
 		let agents = sb.map(agentids, (id) => agentM[id] || {avatar_url: defaultAvatar, fullname: 'Offline Agent'})
-
 		var name = sb.each(agents, (ag) => ag.fullname).join(', ')
-		if (!name) name = this.props.store.matchAccount().name
+		if (accountSetting.hide_agent_profile || !name) name = this.props.store.matchAccount().name
 		if (!name) name = this.props.t('agent')
 
 		var $you = null
@@ -699,7 +701,6 @@ export default class Widget extends Com {
 		}
 
 		let seen = sb.isConvoSeen(convo, this.props.store.matchUser().id)
-
 		var lastmsg = this.renderMessagePreview(convo.last_message_sent || {data: {message: sb.get(convo, 'last_message')}})
 
 		var time =

package/src/chatbox/main.js

@@ -125,8 +125,15 @@ export default class Main extends Com {
 		}
 		p = p || {}
 
-		if (this.props.store.isMobile()) modifyViewport()
+		if (!p.view && !p.cid) {
+			let convoM = this.props.store.matchConvo('*')
+			let redconvo = sb.find(convoM, (convo) => !sb.isConvoSeen(convo, this.props.store.matchUser().id))
+			// try to show first convo
+			p.cid = sb.get(redconvo, 'id', sb.get(convoM, '0.id'))
+			p.view = 'chat'
+		}
 
+		if (this.props.store.isMobile()) modifyViewport()
 		this.setState({widgetConvoId: p.cid, widgetView: p.view})
 		this.props.store.setIsOpen(true)
 

package/src/popup/popup.js

@@ -215,12 +215,25 @@ export default class Popup extends Com {
 
 			let user = sb.cloneDeep(this.props.store.matchUser())
 			let is_lead = false
+
+			// modified pairs to convert data of multiple-choice value ['khu_vuc', '1'], ['khu_vuc', '2'] => ['khu_vuc', '1,2']
+			let modifiedPairs = {}
 			for (var pair of formData.entries()) {
+				if (modifiedPairs[pair[0]]) {
+					let currentValue = sb.get(modifiedPairs, `${pair[0]}.1`, '')
+					currentValue += `,${pair[1]}`
+					sb.set(modifiedPairs, `${pair[0]}.1`, currentValue)
+				} else {
+					modifiedPairs[pair[0]] = [pair[0], pair[1]]
+				}
+			}
+
+			for (const [_, pair] of Object.entries(modifiedPairs)) {
 				let page = sb.get(this.props.plugin.popup, `pages.${this.getPageIndex()}`)
 				let form = sb.find(page.components, (com) => com.type === 'form')
 				let fields = sb.get(form, 'form.fields', [])
 
-				let field = sb.find(fields, (field) => field.key === pair[0])
+				let field = sb.find(fields, (field) => field.key === pair[0]) || {}
 				if (!field.type) return
 
 				summitFields.push({key: pair[0], type: field.type, value: sb.stringify(pair[1])})

package/src/store/store.js

@@ -13,7 +13,7 @@ cookie.defaults.expires = 3650 // 10 year
 const MAX_CONVO = 20
 const page_loaded = sb.Date.now()
 
-// available localstorage key mask, user, session, hasManuallyClosed, isopen, close_preview_at, lastview, bot_run_logs, plugin_run_logs
+// available localstorage key mask, user, hasManuallyClosed, isopen, close_preview_at, lastview, bot_run_logs, plugin_run_logs
 export default class Store {
 	constructor(ApiURL, FileURL, RealtimeURL, inmem, fakeapi, agenttoken) {
 		this.agent_token = agenttoken
@@ -98,7 +98,8 @@ export default class Store {
 	}
 
 	isInsync(key) {
-		return sb.Date.now() - (this.g_sync[key] || 0) < 300000
+		// refetch after 10 mins
+		return sb.Date.now() - (this.g_sync[key] || 0) < 600000
 	}
 
 	async fetchShippingAddresses() {
@@ -114,6 +115,7 @@ export default class Store {
 	updateOrder(order) {
 		return this.api.updateOrder(order)
 	}
+
 	createShippingAddress(addr) {
 		return this.api.createShippingAddress(addr)
 	}
@@ -218,7 +220,6 @@ export default class Store {
 
 	suggest_addresses = (keyword) => this.api.suggest_address(keyword)
 
-	matchSession = () => this.kv.match('session') || {}
 	matchAccount = () => this.cache.match('account')
 	matchPaymentMethods = () => this.cache.match('payment_methods')
 
@@ -303,6 +304,8 @@ export default class Store {
 		return {error}
 	}
 
+	matchLocation = () => this.cache.match('location') || {}
+
 	matchBot = () => this.cache.match('bot') || {}
 
 	readyGate = new sb.Gate()
@@ -530,26 +533,6 @@ export default class Store {
 		// user && session
 		if (setting.user) {
 			setting.user.account_id = setting.account.id
-			let oldsession = this.matchSession()
-			let session = setting.user.session
-			if (session) {
-				if (session.id === oldsession.id) {
-					// refresh session, but keep old local fields
-					session._urls = oldsession._urls
-				} else {
-					// session changed, clear all old data
-				}
-			} else {
-				// dont change session
-				session = oldsession
-			}
-
-			session._urls = session._urls || []
-			session._urls.push(location.href)
-			while (session._urls.length > 1000) session._urls.shift()
-
-			this.kv.put('session', session)
-
 			delete setting.user.session
 			this._setUser(setting.user)
 		}
@@ -561,6 +544,10 @@ export default class Store {
 			delete setting.account
 		}
 
+		// location
+		let location = sb.get(setting, 'location', [])
+		this.cache.put('location', location)
+
 		// bot
 		let bots = sb.get(setting, 'bots', [])
 		let botM = {}
@@ -601,7 +588,7 @@ export default class Store {
 	// send the content view, the first presence and record domain
 	async track() {
 		let user = this.kv.match('user') || {}
-		await this.api.sendContentView(
+		let out = await this.api.sendContentView(
 			this.device,
 			location.href,
 			document.title,
@@ -609,9 +596,15 @@ export default class Store {
 			this._currentViewingProduct.source_id,
 			this._currentViewingProduct.sku,
 		)
+
+		let traffic_source = sb.get(out, 'body.by.device.source', '')
+		if (traffic_source) this.kv.put('traffic_source', traffic_source)
+
 		this.sendPresence()
 	}
 
+	matchTrafficSource = () => this.kv.match('traffic_source')
+
 	async onWs(ev) {
 		if (!ev || !ev.type) return
 		ev.created = sb.getMs(ev.created)
@@ -925,17 +918,15 @@ export default class Store {
 	}
 
 	logBotRun(botid) {
-		let session = this.matchSession()
 		let log = this.kv.match('bot_run_logs') || {}
-		log[botid] = {bot_id: botid, created: this.now(), session_id: session.id}
+		log[botid] = {bot_id: botid, created: this.now()}
 		this.kv.put('bot_run_logs', log)
 	}
 
 	sendImpression(id) {
 		let user = this.kv.match('user') || {}
 		let log = this.kv.match('plugin_run_logs') || {}
-		let session = this.matchSession()
-		log[id] = {web_plugin_id: id, created: this.now(), session_id: session.id}
+		log[id] = {web_plugin_id: id, created: this.now()}
 		this.kv.put('plugin_run_logs', log)
 		return this.api.sendImpression({
 			account_id: user.account_id,
@@ -944,7 +935,6 @@ export default class Store {
 			user_id: user.id,
 			url: window.location.href,
 			device: this.device,
-			session_id: session.id,
 		})
 	}
 
@@ -965,7 +955,6 @@ export default class Store {
 			device: this.device,
 			submission,
 			impression_token: impressionToken,
-			session_id: this.matchSession().id,
 		})
 	}
 
@@ -1007,7 +996,7 @@ export default class Store {
 		let startms = sb.Date.now()
 
 		// store not init
-		if (!sb.get(this.kv.match('user'), 'id')) return setTimeout(() => this.loopTime(), 120000)
+		if (!sb.get(this.kv.match('user'), 'id')) return setTimeout(() => this.loopTime(), 240000)
 
 		let {body: t, error} = await this.api.time()
 		if (error) return setTimeout(() => this.loopTime(), 30000)
@@ -1015,7 +1004,7 @@ export default class Store {
 		var serverMs = new sb.Date(t).getTime() + latences
 		var localMs = sb.Date.now()
 		this.timeDiff = Math.floor(serverMs - localMs)
-		setTimeout(() => this.loopTime(), 120000)
+		setTimeout(() => this.loopTime(), 240000)
 	}
 
 	replaceFileUrl(src) {
@@ -1161,16 +1150,15 @@ function sendToFBPixel(category, action, label) {
 }
 
 function sendToGA(category, action, label) {
-	console.log('SENT.', category, action, label)
+	// console.log('SENT.', category, action, label)
+	if (window.gtag) window.gtag('event', category, {Action: action, Label: label})
 	if (window.ga && window.ga.getAll) {
+		// only send gtag when ga is not available
 		const allTrackers = window.ga.getAll() || []
 		allTrackers.forEach(function (tracker) {
 			const name = tracker.get('name')
 			window.ga(name + '.send', 'event', category, action, label)
 		})
-	} else {
-		// only send gtag when ga is not available
-		if (window.gtag) window.gtag('event', category, {Action: action, Label: label})
 	}
 }
 

package/src/util/common.js

@@ -247,13 +247,13 @@ export function throttle(func, wait, options) {
 	var timeout = null
 	var previous = 0
 	if (!options) options = {}
-	var later = function() {
+	var later = function () {
 		previous = options.leading === false ? 0 : new Date().getTime()
 		timeout = null
 		result = func.apply(context, args)
 		if (!timeout) context = args = null
 	}
-	return function() {
+	return function () {
 		var now = new Date().getTime()
 		if (!previous && options.leading === false) previous = now
 		var remaining = wait - (now - previous)
@@ -331,7 +331,8 @@ export function isNumber(num) {
 }
 
 export function isEmail(email) {
-	const re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
+	const re =
+		/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
 	return re.test(String(email).toLowerCase())
 }
 
@@ -650,7 +651,7 @@ function browserName() {
 	// Safari 3.0+ "[object HTMLElementConstructor]"
 	var isSafari =
 		/constructor/i.test(window.HTMLElement) ||
-		(function(p) {
+		(function (p) {
 			return p.toString() === '[object SafariRemoteNotification]'
 		})(!window['safari'] || (typeof safari !== 'undefined' && window['safari'].pushNotification))
 
@@ -697,15 +698,10 @@ function osName() {
 // frequencty
 function check_frequently(freq, lastrun, store) {
 	if (!lastrun) return true
-	// only for popup?
-	//var run = store.matchLastPluginRun(plugin.id)
-	//if (!run) return true
-
 	if (op.get(freq, 'once_per_user')) return false
 
-	var session = store.matchSession() || {}
 	if (op.get(freq, 'once_per_session')) {
-		if (lastrun.session_id === session.id) return false
+		if (sameDay(lastrun.created, Date.now())) return false
 	}
 
 	if (op.get(freq, 'interval_sec')) {
@@ -718,7 +714,7 @@ function check_frequently(freq, lastrun, store) {
 
 export function checkRunConditions(freq, conds, lastrun, store) {
 	var acc = store.matchAccount() || {}
-	var session = store.matchSession() || {}
+	var location = store.matchLocation() || {}
 
 	// check frequently first
 	if (!check_frequently(freq, lastrun, store)) return false
@@ -754,13 +750,13 @@ export function checkRunConditions(freq, conds, lastrun, store) {
 				if (size(cond.exclude_locations) > 0) {
 					let found = find(cond.exclude_locations, (loc) => {
 						if (loc.city_name && loc.country_code) {
-							if (loc.city_name === session.city_name && loc.country_code === session.country_code) return true
+							if (loc.city_name === location.city_name && loc.country_code === location.country_code) return true
 						}
 						if (loc.city_name && !loc.country_code) {
-							if (loc.city_name === session.city_name) return true
+							if (loc.city_name === location.city_name) return true
 						}
 						if (!loc.city_name && loc.country_code) {
-							if (loc.country_code === session.country_code) return true
+							if (loc.country_code === location.country_code) return true
 						}
 					})
 					if (found) return false
@@ -769,13 +765,13 @@ export function checkRunConditions(freq, conds, lastrun, store) {
 				if (size(cond.locations) > 0) {
 					let found = find(cond.locations, (loc) => {
 						if (loc.city_name && loc.country_code) {
-							if (loc.city_name === session.city_name && loc.country_code === session.country_code) return true
+							if (loc.city_name === location.city_name && loc.country_code === location.country_code) return true
 						}
 						if (loc.city_name && !loc.country_code) {
-							if (loc.city_name === session.city_name) return true
+							if (loc.city_name === location.city_name) return true
 						}
 						if (!loc.city_name && loc.country_code) {
-							if (loc.country_code === session.country_code) return true
+							if (loc.country_code === location.country_code) return true
 						}
 					})
 					if (!found) return false
@@ -828,7 +824,8 @@ export function checkRunConditions(freq, conds, lastrun, store) {
 				break
 			case 'source':
 				if (size(cond.sources) > 0) {
-					if (!find(cond.sources, (src) => norm(src) === norm(session.source))) return false
+					let source = store.matchTrafficSource()
+					if (!find(cond.sources, (src) => norm(src) === norm(source))) return false
 				}
 				break
 			case 'user_attribute':
@@ -1077,7 +1074,7 @@ export var sleep = (ms) => new Promise((res) => setTimeout(res, ms))
 export function formatCurrency(val) {
 	if (!val) return '0 đ'
 	val = Math.round(val)
-	return val.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,')+ ' đ'
+	return val.toString().replace(/(\d)(?=(\d{3})+(?!\d))/g, '$1,') + ' đ'
 }
 
 function replaceFileUrl(src) {