@subiz/widget-v4 4.1.198 → 4.1.200

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@subiz/widget-v4",
-	"version": "4.1.198",
+	"version": "4.1.200",
 	"main": "./compiled_src/lib.js",
 	"scripts": {
 		"dev": "npx webpack serve --config webpack.dev.js",
@@ -13,26 +13,27 @@
 		"@subiz/flow": "^1.1.0",
 		"@subiz/wsclient": "^4.0.34",
 		"cookie_js": "1.4.2",
-		"core-js": "^3.47.0",
+		"core-js": "^3.49.0",
 		"css-loader": "5.2.7",
 		"file-loader": "^6.2.0",
-		"less": "^4.5.1",
-		"less-loader": "^12.3.0",
+		"less": "^4.6.4",
+		"less-loader": "^12.3.2",
 		"preact": "10.19.3"
 	},
 	"devDependencies": {
+		"tape": "^5.9.0",
 		"@babel/cli": "^7.28.6",
-		"@babel/core": "^7.28.6",
+		"@babel/core": "^7.29.0",
 		"@babel/plugin-proposal-class-properties": "^7.18.6",
 		"@babel/plugin-transform-react-jsx": "^7.28.6",
-		"@babel/preset-env": "^7.28.6",
-		"babel-loader": "^10.0.0",
+		"@babel/preset-env": "^7.29.2",
+		"babel-loader": "^10.1.1",
 		"babel-plugin-syntax-jsx": "^6.18.0",
-		"html-webpack-plugin": "^5.6.5",
-		"puppeteer": "^24.35.0",
-		"webpack": "^5.104.1",
-		"webpack-bundle-analyzer": "^5.1.1",
-		"webpack-cli": "^6.0.1",
+		"html-webpack-plugin": "^5.6.6",
+		"puppeteer": "^24.40.0",
+		"webpack": "^5.105.4",
+		"webpack-bundle-analyzer": "^5.2.0",
+		"webpack-cli": "^7.0.2",
 		"webpack-dev-server": "^5.2.3"
 	}
 }

package/src/bot.js

@@ -11,27 +11,17 @@ export default function (store) {
 			run = () => true // dont run twice
 			let match = sb.checkRunConditions(bot.initiative_frequency, bot.conditions, store.matchLastBotRun(bot.id), store)
 			if (!match) return
-			if (bot.id.startsWith('at')) {
-				if (!bot.welcome_message) return
+
+			let welcomMessages = bot.welcome_messages
+			if (sb.size(welcomMessages)) {
 				let {error} = await store.startLightConvo(
 					bot.id,
-					bot.welcome_message,
+					bot.welcome_messages,
 					common.getLocale(bot, sb.detectLang()),
 					false,
 				)
-				if (error) return console.error(error)
 				store.logBotRun(bot.id)
-				return
 			}
-			// old bot, should deprecated
-			let {error} = await store.startConvo({
-				initial_by: bot.id,
-				locale: common.getLocale(bot, sb.detectLang()),
-				state: 'active',
-				members: [{type: 'bot', id: bot.id}],
-			})
-			if (error) return console.error(error)
-			store.logBotRun(bot.id)
 		}
 
 		let triggers = sb.get(bot, 'triggers') || []

package/src/chatbox/Event.js

@@ -451,7 +451,7 @@ export default class Event extends Com {
 						<div class='message-event-action-btn-svg dislike' />
 					</div>
 				</div>
-				{sb.get(this.props.event, 'is_end') && (
+				{sb.get(this.props.event, 'is_end') && !this.props.isConvoEnded && (
 					<div class='message-event-actions-static'>
 						<div class={likecls} onClick={() => this.onSendReaction(hasLike ? 'remove_like' : 'like')}>
 							<div class='message-event-action-btn-svg like' />

package/src/chatbox/Events.js

@@ -148,7 +148,7 @@ export default class Events extends Com {
 		events.push(fakeev)
 
 		let $events = sb.map(events, (ev) => {
-			let isLast = ev.is_last_message_send
+			let isLast = ev.is_last_message_send && sb.get(convo, 'state') !== 'ended'
 			return (
 				<Event
 					isLast={isLast}
@@ -160,6 +160,7 @@ export default class Events extends Com {
 					onPostback={this.props.onPostback}
 					onFocusSourceEventFromQuote={this.onFocusSourceEventFromQuote}
 					ref={(ele) => this.setEventChildRef(ele, ev.ev.id)}
+					isConvoEnded={sb.get(convo, 'state') === 'ended'}
 					event={ev}
 					t={this.props.t}
 					key={ev.ev.id}
@@ -206,7 +207,7 @@ export default class Events extends Com {
 		if (this.state.loading) $tryAgainBtn = <Spinner size='16' mode='blue' />
 		return (
 			<div class='widget-body--events-container widget-body--events-container__error'>
-				<img alt='empty' src={convoemptyimg} />
+				<img alt='empty' class='widget_body_empty_img' src={convoemptyimg} />
 				<div class='widget_body__events__error_msg'>{this.props.t('load_convo_error')}</div>
 				<div class='widget_body__events__error_retry'>{$tryAgainBtn}</div>
 			</div>

package/src/chatbox/Header.js

@@ -20,7 +20,7 @@ export default class Header extends Com {
 				height={38}
 				alt={acc.name}
 				class='avatar avatar__account'
-				src={this.props.store.replaceFileUrl(logo_url) || require('../../assets/img/image_default.png')}
+				src={this.props.store.replaceFileUrl(logo_url) || require('../../assets/img/default_logo.svg')}
 			/>
 		)
 	}
@@ -37,7 +37,7 @@ export default class Header extends Com {
 				width={38}
 				height={38}
 				class='avatar avatar__account'
-				src={this.props.store.replaceFileUrl(logoUrl) || require('../../assets/img/image_default.png')}
+				src={this.props.store.replaceFileUrl(logoUrl) || require('../../assets/img/default_logo.svg')}
 			/>
 		)
 	}

package/src/chatbox/QuickReplies.js

@@ -1,25 +1,25 @@
 import sb from '../util/index.js'
-import { Com } from '../common.js'
-import { h } from 'preact'
+import {Com} from '../common.js'
+import {h} from 'preact'
 
 // 	props: [ ev],
 export default class QuickReplies extends Com {
-	constructor (props) {
+	constructor(props) {
 		super(props)
 	}
 
-	render () {
+	render() {
 		if (sb.get(this.props.ev, 'by.type') === 'user') return null
 
 		let quickreplies = []
-		sb.map(sb.get(this.props.ev, 'data.message.attachments', []), att => {
+		sb.map(sb.get(this.props.ev, 'data.message.attachments', []), (att) => {
 			if (!att) return
 			if (att.type === 'quick_replies') {
 				quickreplies = sb.get(att, 'quick_replies', [])
 			}
 		})
 
-		quickreplies = sb.filter(quickreplies, r => r.title)
+		quickreplies = sb.filter(quickreplies, (r) => r.title)
 
 		if (quickreplies.length === 0) return null
 
@@ -29,7 +29,7 @@ export default class QuickReplies extends Com {
 
 		// has user msg bellow => dont show
 		let events = sb.map(this.props.store.listEvents(cid))
-		events = sb.orderBy(events, 'created', 'asc').filter(ev => ev.type === 'message_sent')
+		events = sb.orderBy(events, 'created', 'asc').filter((ev) => ev.type === 'message_sent')
 		let evindex = 0
 		for (var i = 0; i < events.length; i++) {
 			if (events[i].id === this.props.ev.id) {
@@ -42,12 +42,12 @@ export default class QuickReplies extends Com {
 			if (sb.get(events[i], 'by.type') === 'user') return null
 		}
 
-		let $replies = sb.map(quickreplies, r => (
-			<div class="message_quick_reply" onClick={e => this.props.onSelect(r)}>
+		let $replies = sb.map(quickreplies, (r) => (
+			<div class='message_quick_reply' onClick={(e) => this.props.onSelect(r)} title={r.title}>
 				{r.title}
 			</div>
 		))
 
-		return <div class="message_quick_replies">{$replies}</div>
+		return <div class='message_quick_replies'>{$replies}</div>
 	}
 }

package/src/chatbox/Widget.js

@@ -70,6 +70,7 @@ export default class Widget extends Com {
 
 				console.log('check ev pass condition', ev)
 				if (!messageSentDict[ev.id]) {
+					let accid = sb.get(this.props.store.matchAccount(), 'id')
 					this.props.store.sendBugReport(
 						'[WIDGET ' + accid + '] Missing agent message sent evid ' + ev.id + ', cid ' + sb.convoOfEv(ev),
 					)
@@ -753,7 +754,7 @@ export default class Widget extends Com {
 			$body = (
 				<div class='convo-list--list'>
 					<div class='empty-container'>
-						<img alt='empty' src={empty} />
+						<img class='widget_body_empty_img' alt='empty' src={empty} />
 						<div class='empty-desc'>{this.props.t('empty_convo')}</div>
 					</div>
 				</div>
@@ -855,7 +856,7 @@ export default class Widget extends Com {
 				locale: this.props.t.locale(),
 				message: text,
 				members: [{type: 'bot', id: botid, bot_version: oldconvo.bot_version}],
-				initial_by: this.props.store.matchUser().id,
+				initial_by: botid,
 				is_testing: oldconvo.is_testing,
 				greeting_message: greeting_msg,
 			})

package/src/lib.js

@@ -84,6 +84,8 @@ class Widget {
 		let ref = param.ref
 
 		let user = await this.store.init(accid, undefined, ref, param)
+
+		if (this.store.isDead()) return user
 		sb.setTimeout(() => window.postMessage({type: 'widget_loaded', account_id: accid}, '*'), 0) // send to chrome extension
 
 		// add container to client site
@@ -266,7 +268,7 @@ class Widget {
 	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)
+			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) {

package/src/plugin.js

@@ -12,6 +12,7 @@ function Plugin(plugin, store, $container, lib) {
 	if (!$container) throw '$div must is a valid html node'
 	var $div = document.createElement('div')
 	$div.id = plugin.id
+	if (store.isDead()) return
 	let acc = store.matchAccount()
 	$div.setAttribute('sbz-plugin-type', plugin.type)
 	$div.setAttribute('sbz-plugin-account-id', acc.id)

package/src/store/store.js

@@ -846,7 +846,7 @@ export default class Store {
 		setting = sb.cloneDeep(setting) || {}
 		setting.account = Object.assign({}, setting.account, this.forceAcc)
 		if (!setting.account.logo_url) {
-			setting.account.logo_url = 'https://vcdn.subiz-cdn.com/file/fiqpezhkmeyesdscyetk-default_logo.jpg'
+			setting.account.logo_url = 'https://vcdn.subiz-cdn.com/widget-v4/public/assets/img/default_logo.dd13a2b.svg'
 		}
 		// user && session
 		if (setting.user) {
@@ -1121,28 +1121,34 @@ export default class Store {
 		this.kv.put('light_convos', this.lightConvos)
 	}
 
-	startLightConvo(botid, message, locale, is_testing, botversion) {
+	startLightConvo(botid, messages, locale, is_testing, botversion) {
 		let convoid = 'cslight' + botid + '_' + this.now()
 		let user = this.cache.match('user') || {}
 
 		let old = this.lightConvos[convoid]
 		if (old) return {convo: old}
 		let now = this.now()
-		let ev = {}
-		ev.created = now
-		ev.event_time = now
-		ev.id = 'evfake' + now
-		ev.type = 'message_sent'
-		ev.by = {id: botid, type: 'bot'}
-		ev.data = {message: message}
-		ev.data.message.conversation_id = convoid
+
+		let lastev = {}
+		let newevs = sb.map(messages, (message, idx) => {
+			let ev = {}
+			ev.created = now
+			ev.event_time = now
+			ev.id = 'evfake' + now + idx
+			ev.type = 'message_sent'
+			ev.by = {id: botid, type: 'bot'}
+			ev.data = {message: message}
+			ev.data.message.conversation_id = convoid
+			lastev = ev
+			return ev
+		})
 		let newconvo = {
 			id: convoid,
 			locale: locale,
 			initial_by: botid,
 			created: now,
 			actived: now,
-			last_message_sent: ev,
+			last_message_sent: lastev,
 			members: [
 				{type: 'user', id: user.id},
 				{type: 'bot', id: botid, membership: 'active'},
@@ -1150,13 +1156,14 @@ export default class Store {
 			state: 'active',
 			touchpoint: {id: convoid, channel: 'subiz', source: 'web'},
 			traffic_source: 'direct',
-			events: [ev],
+			events: newevs,
+			//events: [ev],
 			is_testing: is_testing,
 			bot_versio: botversion,
 		}
 		this.lightConvos[convoid] = newconvo
 		this.kv.put('light_convos', this.lightConvos)
-		this.pubsub.publish('events', ev)
+		this.pubsub.publish('events', lastev)
 		return {convo: newconvo}
 	}
 
@@ -1467,6 +1474,9 @@ export default class Store {
 		this.pubsub.publish('destroy')
 	}
 
+	isDead() {
+		return this._die
+	}
 	destroy() {
 		this._die = true
 		this.clearBrowserData()

package/src/util/common.js

@@ -950,22 +950,8 @@ export function checkRunConditions(freq, conds, lastrun, store) {
 		var cond = conds[i]
 		switch (cond.key) {
 			case 'url':
-				let exclude_urls = filter(cond.exclude_urls, (url) => norm(url))
-				if (size(exclude_urls) > 0) {
-					let found = find(exclude_urls, (url) => {
-						return norm(window.location.href).indexOf(norm(url)) > -1
-					})
-					if (found) return false
-				}
-
-				// ignore empty url
-				let urls = filter(cond.urls, (url) => norm(url))
-				if (size(urls) > 0) {
-					let found = find(urls, (url) => {
-						return norm(window.location.href).indexOf(norm(url)) > -1
-					})
-					if (!found) return false
-				}
+				//  url = qlhd.minvoice.com.vn, exclude_urls ["minvoice.com.vn","minvoice.net","hdt.minvoice.com.vn"], urls ["qlhd.minvoice.com.vn"]  => must pass
+				if (!checkUrlCondition(cond, window.location.href)) return false
 				break
 			case 'url_path':
 				let excludePaths = filter(cond.exclude_url_paths, (url) => norm(url))
@@ -1616,3 +1602,32 @@ function isEmptyAttachment(msg) {
 		) == 0
 	)
 }
+export function checkUrlCondition(cond, href) {
+	//  url = qlhd.minvoice.com.vn, exclude_urls ["minvoice.com.vn","minvoice.net","hdt.minvoice.com.vn"], urls ["qlhd.minvoice.com.vn"]  => must pass
+	let exclude_urls = filter(cond.exclude_urls, (url) => norm(url))
+	let foundExclude = false
+	let excludeLen = 0
+	map(exclude_urls, (url) => {
+		if (norm(href).indexOf(url) > -1) {
+			if (excludeLen < size(url)) excludeLen = size(url)
+			foundExclude = true
+		}
+	})
+
+	// ignore empty url
+	let includeLen = 0
+	let urls = filter(cond.urls, (url) => norm(url))
+	let foundInclude = size(urls) == 0
+	map(urls, (url) => {
+		if (norm(href).indexOf(url) > -1) {
+			if (includeLen < size(url)) includeLen = size(url)
+			foundInclude = true
+		}
+	})
+	if (foundExclude) {
+		if (excludeLen >= includeLen) return false
+	}
+
+	if (!foundInclude) return false
+	return true
+}