@subiz/widget-v4 4.1.85 → 4.1.87

package/package.json

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

package/preview.js

@@ -1,18 +1,22 @@
 import Widget from './src/lib.js'
-import { h, render } from 'preact'
+import {h, render} from 'preact'
 
-async function main () {
+async function main() {
 	var accid =
 		getUrlParameter('id') || getUrlParameter('acc_id') || getUrlParameter('account_id') || 'acqsulrowbxiugvginhw'
 	var real = getUrlParameter('real')
 	let widget
 	if (real) {
-		widget = new Widget('https://api.subiz.com.vn/4.0/', 'https://file-subiz.com/', 'https://rt-0.subiz.com.vn/')
+		widget = new Widget(
+			'https://api.subiz.com.vn/4.0/',
+			'https://vcdn.subiz-cdn.com/file/',
+			'https://api.subiz.com.vn/rt/0/',
+		)
 	} else {
 		widget = new Widget(
 			'https://api.subiz.com.vn/4.0/',
-			'https://file-subiz.com/',
-			'https://rt-0.subiz.com.vn/',
+			'https://vcdn.subiz-cdn.com/file/',
+			'https://api.subiz.com.vn/rt/0/',
 			true,
 			true,
 		)
@@ -30,57 +34,58 @@ async function main () {
 	let hash = document.location.hash.substr(1)
 	let plugin = JSON.parse(decodeURIComponent(atob(hash)))
 
-	plugin.triggers = [{ type: 'after_pageview', after_pageview_sec: 0, enabled: true }]
+	plugin.triggers = [{type: 'after_pageview', after_pageview_sec: 0, enabled: true}]
 	if (plugin._dont_close !== false) plugin._dont_close = true
 	plugin._page_index = 0
 
-	console.log("PLUGIN", plugin)
+	console.log('PLUGIN', plugin)
 	widget._overridePlugin([plugin])
 	// widget._overrideDeviceType('mobile')
 	await widget.setAccount(accid, $div)
 }
 
-function addBody () {
+function addBody() {
 	var $div = document.createElement('div')
 	document.body.appendChild($div)
 	render(
-		<div style="opacity: 0.75">
-			<header class="header">
-				<nav class="navbar navbar-default navbar-fixed-top">
-					<div class="container">
-						<nav class="navbar navbar-expand-lg">
-							<a class="navbar-brand" href="#">
+		<div style='opacity: 0.75'>
+			<header class='header'>
+				<nav class='navbar navbar-default navbar-fixed-top'>
+					<div class='container'>
+						<nav class='navbar navbar-expand-lg'>
+							<a class='navbar-brand' href='#'>
 								<img
-									style="width: 40px; height: 40px; margin-right: 20px"
+									style='width: 40px; height: 40px; margin-right: 20px'
 									src={require('./assets/img/examplte_logo.svg')}
 								/>{' '}
 								Ngựa vằn
 							</a>
 							<button
-								class="navbar-toggler collapsed"
-								type="button"
-								data-toggle="collapse"
-								data-target="#navbarCollapse"
-								aria-controls="navbarCollapse"
-								aria-expanded="false"
-								aria-label="Toggle navigation">
-								<span class="navbar-toggler-icon">
-									<i class="fas fa-bars"></i>
+								class='navbar-toggler collapsed'
+								type='button'
+								data-toggle='collapse'
+								data-target='#navbarCollapse'
+								aria-controls='navbarCollapse'
+								aria-expanded='false'
+								aria-label='Toggle navigation'
+							>
+								<span class='navbar-toggler-icon'>
+									<i class='fas fa-bars'></i>
 								</span>
 							</button>
-							<div class="navbar-collapse collapse" id="navbarCollapse" style="">
-								<ul class="navbar-nav ml-auto">
-									<li class="current">
-										<a href="#home">Trang chủ</a>
+							<div class='navbar-collapse collapse' id='navbarCollapse' style=''>
+								<ul class='navbar-nav ml-auto'>
+									<li class='current'>
+										<a href='#home'>Trang chủ</a>
 									</li>
 									<li>
-										<a href="#pricing">Bảng giá</a>
+										<a href='#pricing'>Bảng giá</a>
 									</li>
 									<li>
-										<a href="#blog">Blog</a>
+										<a href='#blog'>Blog</a>
 									</li>
-									<li class="discover-link">
-										<a href="#" class="external discover-btn">
+									<li class='discover-link'>
+										<a href='#' class='external discover-btn'>
 											Bắt đầu
 										</a>
 									</li>
@@ -91,10 +96,10 @@ function addBody () {
 				</nav>
 			</header>
 
-			<section class="home-section" id="home">
-				<div class="container">
-					<div class="row">
-						<div class="col-md-6 padding-top-80">
+			<section class='home-section' id='home'>
+				<div class='container'>
+					<div class='row'>
+						<div class='col-md-6 padding-top-80'>
 							<h1>Chào mừng đến với Ngựa Vằn, dịch vụ giao hàng uy tín nhất tại Việt Nam</h1>
 
 							<p>
@@ -102,34 +107,34 @@ function addBody () {
 								central location. There are no limits to how you can look at your data.
 							</p>
 
-							<a href="#" class="btn-blue scrool">
+							<a href='#' class='btn-blue scrool'>
 								Start Your Free Trial
 							</a>
 						</div>
 
-						<div class="col-md-6">
+						<div class='col-md-6'>
 							<img
-								src="https://demo.epic-webdesign.com/tf-essentials/v1/images/website-development.jpg"
-								class="hero-image width-100"
-								alt="pic"
+								src='https://demo.epic-webdesign.com/tf-essentials/v1/images/website-development.jpg'
+								class='hero-image width-100'
+								alt='pic'
 							/>
 						</div>
 					</div>
 				</div>
 			</section>
 
-			<section class="section-grey section-top-border" id="about">
-				<div class="container">
-					<div class="row">
-						<div class="col-md-12 text-center">
-							<h2 class="section-title">Integrated solutions designed for small business</h2>
+			<section class='section-grey section-top-border' id='about'>
+				<div class='container'>
+					<div class='row'>
+						<div class='col-md-12 text-center'>
+							<h2 class='section-title'>Integrated solutions designed for small business</h2>
 
-							<p class="section-subtitle">Communicate with flexible tools that go where your team goes.</p>
+							<p class='section-subtitle'>Communicate with flexible tools that go where your team goes.</p>
 						</div>
 
-						<div class="col-md-4">
-							<div class="main-services">
-								<img src={require('./assets/img/main-service1.png')} class="width-100" alt="pic" />
+						<div class='col-md-4'>
+							<div class='main-services'>
+								<img src={require('./assets/img/main-service1.png')} class='width-100' alt='pic' />
 
 								<h3>Designers</h3>
 
@@ -138,15 +143,15 @@ function addBody () {
 									netsum.
 								</p>
 
-								<a href="#about" class="btn-blue-line small scrool">
+								<a href='#about' class='btn-blue-line small scrool'>
 									Essentials for Designers
 								</a>
 							</div>
 						</div>
 
-						<div class="col-md-4">
-							<div class="main-services">
-								<img src={require('./assets/img/main-service2.png')} class="width-100" alt="pic" />
+						<div class='col-md-4'>
+							<div class='main-services'>
+								<img src={require('./assets/img/main-service2.png')} class='width-100' alt='pic' />
 
 								<h3>Marketers</h3>
 
@@ -155,15 +160,15 @@ function addBody () {
 									netsum.
 								</p>
 
-								<a href="#about" class="btn-blue-line small scrool">
+								<a href='#about' class='btn-blue-line small scrool'>
 									Essentials for Marketers
 								</a>
 							</div>
 						</div>
 
-						<div class="col-md-4">
-							<div class="main-services">
-								<img src="./assets/img/main-service3.png" class="width-100" alt="pic" />
+						<div class='col-md-4'>
+							<div class='main-services'>
+								<img src='./assets/img/main-service3.png' class='width-100' alt='pic' />
 
 								<h3>Agencies</h3>
 
@@ -172,7 +177,7 @@ function addBody () {
 									netsum.
 								</p>
 
-								<a href="#about" class="btn-blue-line small scrool">
+								<a href='#about' class='btn-blue-line small scrool'>
 									Essentials for Agencies
 								</a>
 							</div>
@@ -181,112 +186,112 @@ function addBody () {
 				</div>
 			</section>
 
-			<section class="section-grey" id="pricing">
-				<div class="container">
-					<div class="row">
-						<div class="col-md-12 text-center padding-bottom-40">
-							<h2 class="section-title">Pricing for every business, at any stage</h2>
+			<section class='section-grey' id='pricing'>
+				<div class='container'>
+					<div class='row'>
+						<div class='col-md-12 text-center padding-bottom-40'>
+							<h2 class='section-title'>Pricing for every business, at any stage</h2>
 
-							<p class="section-subtitle">All pricing packages are backed up by a 30-day money back guarantee.</p>
+							<p class='section-subtitle'>All pricing packages are backed up by a 30-day money back guarantee.</p>
 						</div>
 
-						<div class="col-md-4">
-							<div class="price-box">
-								<ul class="pricing-list">
-									<li class="price-title">BASIC</li>
+						<div class='col-md-4'>
+							<div class='price-box'>
+								<ul class='pricing-list'>
+									<li class='price-title'>BASIC</li>
 
-									<li class="price-value">$25</li>
+									<li class='price-value'>$25</li>
 
-									<li class="price-subtitle">Per Month</li>
+									<li class='price-subtitle'>Per Month</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>Custom Charts
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>Custom Charts
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>5 Mailboxes, 10 Gb Storage
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>5 Mailboxes, 10 Gb Storage
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>Unlimited Free Dashboards
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>Unlimited Free Dashboards
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>Access to all APIs
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>Access to all APIs
 									</li>
 
-									<li class="price-tag-line">
-										<a href="#">FREE 15-DAY TRIAL</a>
+									<li class='price-tag-line'>
+										<a href='#'>FREE 15-DAY TRIAL</a>
 									</li>
 								</ul>
 							</div>
 						</div>
 
-						<div class="col-md-4">
-							<div class="price-box">
-								<div class="ribbon blue">
+						<div class='col-md-4'>
+							<div class='price-box'>
+								<div class='ribbon blue'>
 									<span>Popular</span>
 								</div>
 
-								<ul class="pricing-list">
-									<li class="price-title">STANDARD</li>
+								<ul class='pricing-list'>
+									<li class='price-title'>STANDARD</li>
 
-									<li class="price-value">$99</li>
+									<li class='price-value'>$99</li>
 
-									<li class="price-subtitle">Per Month</li>
+									<li class='price-subtitle'>Per Month</li>
 
-									<li class="price-text strong">
-										<i class="fas fa-check blue"></i>
+									<li class='price-text strong'>
+										<i class='fas fa-check blue'></i>
 										<strong>All Basic features</strong>
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>15 Mailboxes, 50 Gb Storage
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>15 Mailboxes, 50 Gb Storage
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>Interactive Screen Sharing
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>Interactive Screen Sharing
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>Full Reports History
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>Full Reports History
 									</li>
 
-									<li class="price-tag">
-										<a href="#">FREE 15-DAY TRIAL</a>
+									<li class='price-tag'>
+										<a href='#'>FREE 15-DAY TRIAL</a>
 									</li>
 								</ul>
 							</div>
 						</div>
 
-						<div class="col-md-4">
-							<div class="price-box">
-								<ul class="pricing-list">
-									<li class="price-title white-text">PRO</li>
+						<div class='col-md-4'>
+							<div class='price-box'>
+								<ul class='pricing-list'>
+									<li class='price-title white-text'>PRO</li>
 
-									<li class="price-value white-text">$199</li>
+									<li class='price-value white-text'>$199</li>
 
-									<li class="price-subtitle white-text">Per Month</li>
+									<li class='price-subtitle white-text'>Per Month</li>
 
-									<li class="price-text white-text">
-										<i class="fas fa-check blue"></i>
+									<li class='price-text white-text'>
+										<i class='fas fa-check blue'></i>
 										<strong>All Standard Features</strong>
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>50 Mailboxes, 90 Gb Storage
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>50 Mailboxes, 90 Gb Storage
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>Dedicated Account Manager
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>Dedicated Account Manager
 									</li>
 
-									<li class="price-text">
-										<i class="fas fa-check blue"></i>24/7 Priority Support
+									<li class='price-text'>
+										<i class='fas fa-check blue'></i>24/7 Priority Support
 									</li>
 
-									<li class="price-tag-line">
-										<a href="#">FREE 15-DAY TRIAL</a>
+									<li class='price-tag-line'>
+										<a href='#'>FREE 15-DAY TRIAL</a>
 									</li>
 								</ul>
 							</div>
@@ -294,71 +299,71 @@ function addBody () {
 					</div>
 				</div>
 			</section>
-			<section class="section-grey partners-paddings section-top-border section-bottom-border">
-				<div class="container">
-					<div class="row">
-						<div class="col-md-12 text-center">
-							<h3 class="section-title">Tin tưởng bởi 250 doanh nghiệp</h3>
+			<section class='section-grey partners-paddings section-top-border section-bottom-border'>
+				<div class='container'>
+					<div class='row'>
+						<div class='col-md-12 text-center'>
+							<h3 class='section-title'>Tin tưởng bởi 250 doanh nghiệp</h3>
 						</div>
-						<div class="col-md-12 text-center">
-							<ul class="partners-mentions">
+						<div class='col-md-12 text-center'>
+							<ul class='partners-mentions'>
 								<li>
-									<img src={require('./assets/img/award4a.png')} alt="CSS Awards" />
+									<img src={require('./assets/img/award4a.png')} alt='CSS Awards' />
 								</li>
 								<li>
-									<img src={require('./assets/img/award1a.png')} alt="Awwwards" />
+									<img src={require('./assets/img/award1a.png')} alt='Awwwards' />
 								</li>
 								<li>
-									<img src={require('./assets/img/award5.png')} alt="CSS Winner" />
+									<img src={require('./assets/img/award5.png')} alt='CSS Winner' />
 								</li>
 								<li>
-									<img src={require('./assets/img/award3a.png')} alt="CSS Design Awards" />
+									<img src={require('./assets/img/award3a.png')} alt='CSS Design Awards' />
 								</li>
 							</ul>
 						</div>
 					</div>
 				</div>
 			</section>
-			<div class="footer">
-				<div class="container">
-					<div class="row">
-						<div class="col-md-12 text-center">
+			<div class='footer'>
+				<div class='container'>
+					<div class='row'>
+						<div class='col-md-12 text-center'>
 							<p>Bản quyền thuộc về Ngựa Vằn @2022</p>
 
-							<ul class="footer_social">
+							<ul class='footer_social'>
 								<li>
-									<a href="#">
-										<i class="fab fa-twitter"></i>
+									<a href='#'>
+										<i class='fab fa-twitter'></i>
 									</a>
 								</li>
 
 								<li>
-									<a href="#">
-										<i class="fab fa-pinterest"></i>
+									<a href='#'>
+										<i class='fab fa-pinterest'></i>
 									</a>
 								</li>
 
 								<li>
-									<a href="#">
-										<i class="fab fa-facebook-square"></i>
+									<a href='#'>
+										<i class='fab fa-facebook-square'></i>
 									</a>
 								</li>
 
 								<li>
-									<a href="#">
-										<i class="fab fa-instagram"></i>
+									<a href='#'>
+										<i class='fab fa-instagram'></i>
 									</a>
 								</li>
 
 								<li>
-									<a href="#">
-										<i class="fab fa-skype"></i>
+									<a href='#'>
+										<i class='fab fa-skype'></i>
 									</a>
 								</li>
 
 								<li>
-									<a href="#">
-										<i class="fab fa-dribble"></i>
+									<a href='#'>
+										<i class='fab fa-dribble'></i>
 									</a>
 								</li>
 							</ul>
@@ -371,7 +376,7 @@ function addBody () {
 	)
 }
 
-function getUrlParameter (name) {
+function getUrlParameter(name) {
 	name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]')
 	var regex = new RegExp('[\\?&]' + name + '=([^&#]*)')
 	var results = regex.exec(location.search)

package/screenshoot.js

@@ -3,8 +3,8 @@ import Widget from './src/lib.js'
 let accid = 'acqsulrowbxiugvginhw'
 let widget = new Widget(
 	'https://api.subiz.com.vn/4.0/',
-	'https://file-subiz.com/',
-	'https://rt-0.subiz.com.vn/',
+	'https://vcdn.subiz-cdn.com/file/',
+	'https://api.subiz.com.vn/rt/0/',
 	true,
 	true,
 )

package/src/chatbox/TextMessage.js

@@ -49,9 +49,8 @@ export default class TextMessage extends Com {
 	}
 
 	renderBlock(block) {
-		if (sb.size(block) == 0) return null
+		if (isEmptyBlock(block)) return null
 		let byType = sb.get(this.props.ev, 'by.type')
-
 		if (byType !== 'user') byType = 'agent'
 		if (byType === 'agent') {
 			return (
@@ -67,3 +66,15 @@ 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/chatbox/Widget.js

@@ -15,7 +15,7 @@ let Order = false
 const LoadOrder = () => import(/*webpackChunkName: "Order" */ './Order.js')
 import ListField from './ListField.js'
 
-const defaultAvatar = 'https://file-subiz.com/fiqoahedjbgwclpouoml-avatar_default_baa8a1d7.png'
+const defaultAvatar = 'https://vcdn.subiz-cdn.com/file/fiqoahedjbgwclpouoml-avatar_default_baa8a1d7.png'
 
 import Spinner from './spinner.js'
 import Time from './time.js'

package/src/store/store.js

@@ -660,7 +660,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://file-subiz.com/fiqpezhkmeyesdscyetk-default_logo.jpg'
+			setting.account.logo_url = 'https://vcdn.subiz-cdn.com/file/fiqpezhkmeyesdscyetk-default_logo.jpg'
 		}
 		// user && session
 		if (setting.user) {