@hhgtech/hhg-components 1.29.227 → 1.29.229

package/build/lead.js

@@ -2,45 +2,45 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var tslib_es6 = require('./tslib.es6-e58ceba6.js');
+var tslib_es6 = require('./tslib.es6-fc5e1a60.js');
 var React = require('react');
 var debounce = require('lodash/debounce');
 var form = require('@mantine/form');
-var index = require('./index-08815a0f.js');
-var index$1 = require('./index-5e86defd.js');
+var index = require('./index-140f01a3.js');
+var index$1 = require('./index-e71897a5.js');
 var core = require('@mantine/core');
-var index$2 = require('./index-7fbfdd1e.js');
-var index$4 = require('./index-e502fc38.js');
-var utils = require('./utils-79a4ce98.js');
+var index$2 = require('./index-39eba437.js');
+var index$4 = require('./index-b78d6d75.js');
+var utils = require('./utils-226ba0f5.js');
 require('@mantine/dates');
-require('./index-ea0115d3.js');
-require('./index-6d444948.js');
-var index$7 = require('./index-f920e71b.js');
-require('./useMantineLocale-22c73a38.js');
-var index$5 = require('./index-0f26e823.js');
-require('./index.styles-1fb12375.js');
-var translationsContext = require('./translationsContext-d3766a9a.js');
+require('./index-64a4a31a.js');
+require('./index-fd6472b5.js');
+var index$7 = require('./index-3976a86e.js');
+require('./useMantineLocale-eb83b92f.js');
+var index$5 = require('./index-394922ac.js');
+require('./index.styles-d30cb144.js');
+var translationsContext = require('./translationsContext-6b23f1d7.js');
 require('@mantine/hooks');
-var utils$1 = require('./utils-43ad9e4f.js');
-require('./other-dbadd13e.js');
-require('./index-873333b0.js');
-var usePlacesAutocomplete = require('./usePlacesAutocomplete-5a6bf127.js');
-var index$3 = require('./index-cf9d38e9.js');
-var index$6 = require('./index-fe4e93c1.js');
+var utils$1 = require('./utils-20990f15.js');
+require('./other-91752da3.js');
+require('./index-8aa02f0d.js');
+var usePlacesAutocomplete = require('./usePlacesAutocomplete-217fe935.js');
+var index$3 = require('./index-3b579e14.js');
+var index$6 = require('./index-9254fb4d.js');
 var uuid = require('uuid');
 var miscTheme = require('./miscTheme.js');
-var index$8 = require('./index-60a69a63.js');
+var index$8 = require('./index-f8247620.js');
 var ReactDOM = require('react-dom');
 var miscCookieHelper = require('./miscCookieHelper.js');
 var dayjs = require('dayjs');
-var Close = require('./Close-2cc3d6d9.js');
+var Close = require('./Close-3a3eacc5.js');
 require('@hhgtech/icons/other');
 require('@emotion/styled');
 require('@mantine/carousel');
-require('./Locale-01de5771.js');
-require('./index-0365d6e2.js');
+require('./Locale-86a67801.js');
+require('./index-1c17aefe.js');
 require('classnames');
-require('./useUniqueId-35fb3e95.js');
+require('./useUniqueId-f21a8b2b.js');
 require('./constantsSite.js');
 require('@hhgtech/icons/core');
 require('date-fns/locale');
@@ -230,6 +230,16 @@ const validateEmailOrPhoneOnSubot = ({ bot_id, email, phone, }) => {
         },
     });
 };
+const validatePhoneNumberOnLeadGen = ({ campaign_id, phone, }) => {
+    return leadApi.call({
+        url: 'api/collection/log/check-phone-with-campaign',
+        method: 'post',
+        data: {
+            campaign_id,
+            phone,
+        },
+    });
+};
 const sendSMSOtpLead = ({ phone, type, }) => {
     return leadApi.call({
         url: type === 'phone' ? 'api/sms/otp' : 'api/sms/whatsapp_otp',
@@ -255,6 +265,7 @@ const Service = {
     campaignGetById,
     validateEmailOrPhoneOnSubot,
     validateEmailOrPhoneOnLeadGen,
+    validatePhoneNumberOnLeadGen,
     sendSMSOtpLead,
     verifyOtpLead,
 };
@@ -283,9 +294,20 @@ const checkUsedEmailOrPhone = (campaignId, campaign_subot_id, data) => tslib_es6
         }
     }
 });
+const checkUsedPhoneOnly = (campaignId, phone) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
+    var _a;
+    const resLeadGen = yield Service.validatePhoneNumberOnLeadGen({
+        campaign_id: campaignId,
+        phone,
+    });
+    if (((_a = resLeadGen === null || resLeadGen === void 0 ? void 0 : resLeadGen._messages) === null || _a === void 0 ? void 0 : _a[0]) === 'Phone was exist') {
+        return 'validator.phoneUsed';
+    }
+});
 const validatedCache = {
     email: {},
     phone: {},
+    phoneOnly: {},
 };
 const checkUsedEmailOrPhoneWithCache = (campaignId, campaign_subot_id, data) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
     const key = 'email' in data ? 'email' : 'phone';
@@ -314,15 +336,45 @@ const checkUsedEmailOrPhoneWithCache = (campaignId, campaign_subot_id, data) =>
     }
     return res;
 });
+const checkUsedPhoneOnlyWithCache = (campaignId, phone) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
+    if (validatedCache.phoneOnly[phone]) {
+        if (validatedCache.phoneOnly[phone].value) {
+            return 'validator.phoneUsed';
+        }
+        else if (!validatedCache.phoneOnly[phone].value &&
+            validatedCache.phoneOnly[phone].expire > Date.now()) {
+            return '';
+        }
+    }
+    const res = checkUsedPhoneOnly(campaignId, phone);
+    if (res) {
+        validatedCache.phoneOnly[phone] = {
+            value: true,
+        };
+    }
+    else {
+        validatedCache.phoneOnly[phone] = {
+            value: false,
+            expire: Date.now() + 1000 * 60,
+        };
+    }
+    return res;
+});
 const clearCacheUsedEmailOrPhone = () => {
     validatedCache.email = {};
     validatedCache.phone = {};
+    validatedCache.phoneOnly = {};
 };
 
 // You can give context variables any name
 const [LeadFormProvider$1, useLeadFormContext$1, useLeadForm$1] = form.createFormContext();
 const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validatingEmailRef, campaignId, campaign_subot_id = [], }) => {
     const { t } = index.useTranslations();
+    React.useEffect(() => {
+        if (!window.intlTelInputUtils) {
+            require('intl-tel-input/build/js/utils');
+        }
+    }, []);
     const validateObj = React.useMemo(() => {
         const InputBlocks = [
             'TextBlock',
@@ -339,14 +391,20 @@ const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validati
             'TncBlock',
         ];
         // ALL are required and can skip if not touched yet
-        const withSharedCheck = (name, cb) => {
+        const withSharedCheck = (name, cb, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        block) => {
             return (value) => {
+                var _a;
+                const isBLockRequired = (_a = block === null || block === void 0 ? void 0 : block.data) === null || _a === void 0 ? void 0 : _a.required;
                 if (!formRef.current.isTouched(name))
                     return;
                 if (typeof value === 'undefined' ||
                     value === '' ||
                     (Array.isArray(value) && value.length === 0)) {
-                    return t('validator.required');
+                    return isBLockRequired
+                        ? t('validator.required')
+                        : cb === null || cb === void 0 ? void 0 : cb(value);
                 }
                 return cb === null || cb === void 0 ? void 0 : cb(value);
             };
@@ -354,18 +412,22 @@ const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validati
         return listBlockAdded
             .filter((b) => InputBlocks.includes(b.name))
             .reduce((r, b) => {
+            var _a;
+            const isRequired = (_a = b.data.required) !== null && _a !== void 0 ? _a : true;
             if (b.name === 'NumberBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (isNaN(Number(value))) {
+                        if (value && isNaN(Number(value))) {
                             return t('validator.number');
                         }
-                    }) });
+                    }, b) });
             }
             else if (b.name === 'EmailBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+                        if (value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
                             return t('validator.email');
                         }
+                        if (!value)
+                            return;
                         validatingEmailRef.current = true;
                         setTimeout(() => {
                             formRef.current.setFieldError(b.data.value, 'Validating...');
@@ -387,56 +449,77 @@ const useLeadFormConfig$1 = ({ listBlockAdded = [], validatingPhoneRef, validati
                                 validatingEmailRef.current = false;
                             });
                         }, 200);
-                    }) });
+                    }, b) });
             }
             else if (b.name === 'PhoneBlock' ||
                 b.name === 'PhoneOtpBlock' ||
                 b.name === 'WhatsappOtpBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (window.intlTelInputUtils &&
+                        if (value &&
+                            window.intlTelInputUtils &&
                             !window.intlTelInputUtils.isValidNumber(String(value), LEAD_LOCALE.countryCode)) {
                             return t('validator.phone');
                         }
+                        if (!value)
+                            return;
                         validatingPhoneRef.current = true;
                         setTimeout(() => {
                             formRef.current.setFieldError(b.data.value, 'Validating...');
-                            checkUsedEmailOrPhoneWithCache(campaignId, campaign_subot_id, {
-                                phone: value,
-                            })
-                                .then((tKey) => {
-                                if (tKey) {
-                                    formRef.current.setFieldError(b.data.value, t(tKey));
-                                }
-                                else {
-                                    formRef.current.clearFieldError(b.data.value);
-                                }
-                                validatingPhoneRef.current = false;
-                            })
-                                .catch((e) => {
-                                console.error(e);
-                                formRef.current.setFieldError(b.data.value, e.message || 'Something went wrong');
-                                validatingPhoneRef.current = false;
-                            });
+                            if (b.data.singleSubmission) {
+                                checkUsedPhoneOnlyWithCache(campaignId, value)
+                                    .then((tKey) => {
+                                    if (tKey) {
+                                        formRef.current.setFieldError(b.data.value, t(tKey));
+                                    }
+                                    else {
+                                        formRef.current.clearFieldError(b.data.value);
+                                    }
+                                    validatingPhoneRef.current = false;
+                                })
+                                    .catch((err) => {
+                                    console.error(err);
+                                    formRef.current.setFieldError(b.data.value, err.message || 'Something went wrong');
+                                    validatingPhoneRef.current = false;
+                                });
+                            }
+                            else {
+                                checkUsedEmailOrPhoneWithCache(campaignId, campaign_subot_id, {
+                                    phone: value,
+                                })
+                                    .then((tKey) => {
+                                    if (tKey) {
+                                        formRef.current.setFieldError(b.data.value, t(tKey));
+                                    }
+                                    else {
+                                        formRef.current.clearFieldError(b.data.value);
+                                    }
+                                    validatingPhoneRef.current = false;
+                                })
+                                    .catch((e) => {
+                                    console.error(e);
+                                    formRef.current.setFieldError(b.data.value, e.message || 'Something went wrong');
+                                    validatingPhoneRef.current = false;
+                                });
+                            }
                         }, 200);
                     }) });
             }
             else if (b.name === 'DateBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (isNaN(Date.parse(value))) {
+                        if (value && isNaN(Date.parse(value))) {
                             return t('validator.date');
                         }
-                    }) });
+                    }, b) });
             }
             else if (b.name === 'TncBlock') {
                 return Object.assign(Object.assign({}, r), { [`TNC-` + b.id]: withSharedCheck('TNC-' + b.id, (value) => {
-                        console.log('value', value);
-                        if (!value) {
+                        if (isRequired && !value) {
                             return t('validator.required');
                         }
                     }) });
             }
             else {
-                return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value) });
+                return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, undefined, b) });
             }
         }, {});
     }, [listBlockAdded.map((b) => b.name).join(',')]);
@@ -519,7 +602,7 @@ var useStyles$2 = core.createStyles(() => {
 });
 
 const libraries$1 = ['places'];
-const LocationBlock$1 = ({ name, placeholder, locale, }) => {
+const LocationBlock$1 = ({ name, placeholder, locale, required = true, }) => {
     var _a;
     const form = useLeadFormContext$1();
     const [searchValue, setSearchValue] = React.useState('');
@@ -563,7 +646,7 @@ const LocationBlock$1 = ({ name, placeholder, locale, }) => {
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         LoadScript && (React__default["default"].createElement(LoadScript, { googleMapsApiKey: usePlacesAutocomplete.GOOGLE_API_KEY, libraries: libraries$1, loadingElement: React__default["default"].createElement(React__default["default"].Fragment, null) })),
         React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": name, "data-control": 'text' }),
-        React__default["default"].createElement(index$2.Select, Object.assign({ className: "lead-modal__form-control", label: placeholder, placeholder: placeholder, withAsterisk: true, name: name, data: options, searchValue: searchValue, onSearchChange: (query) => {
+        React__default["default"].createElement(index$2.Select, Object.assign({ className: "lead-modal__form-control", label: placeholder, placeholder: placeholder, withAsterisk: required, name: name, data: options, searchValue: searchValue, onSearchChange: (query) => {
                 setSearchValue(query);
             }, filter: () => true, clearable: true, searchable: true, onChange: (val) => setAddress(val || ''), icon: React__default["default"].createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" },
                 React__default["default"].createElement("path", { d: "M10 9.792q.605 0 1.032-.427.426-.428.426-1.032 0-.603-.426-1.031A1.4 1.4 0 0 0 10 6.875q-.604 0-1.032.427a1.4 1.4 0 0 0-.426 1.031q0 .604.426 1.032.428.426 1.032.427m0 8.083q-.145 0-.292-.042a.7.7 0 0 1-.27-.145Q6.478 15 5.01 12.708 3.54 10.418 3.54 8.5q0-3.021 1.949-4.823T10 1.875t4.51 1.802q1.95 1.802 1.949 4.823 0 1.917-1.468 4.208-1.47 2.292-4.427 4.98a.7.7 0 0 1-.271.145 1 1 0 0 1-.292.042", fill: "#8C8C8C" })), autoComplete: 'no-auto-complete-' + randRef.current, rightSection: React__default["default"].createElement(React__default["default"].Fragment, null) }, form.getInputProps(name)))));
@@ -581,30 +664,32 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
     });
     const form = useLeadFormContext$1();
     return (React__default["default"].createElement(React__default["default"].Fragment, null, listBlockAdded.map((b, index) => {
+        var _a;
         const { name = '', data = {} } = b || {};
         const { placeholder, value, align, listQuestion, isSendMailChimp = false, newtab, url, } = data;
+        const required = (_a = data.required) !== null && _a !== void 0 ? _a : true;
         switch (name) {
             case 'TitleBlock':
                 return (React__default["default"].createElement(TitleBlock$1, { key: index, align: align }, value));
             case 'SubtitleBlock':
                 return (React__default["default"].createElement(SubtitleBlock$1, { key: index, align: align }, value));
             case 'TextBlock':
-                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: true, spellCheck: false, type: "text", placeholder: placeholder, className: cx('leadgen-control', classes.control), 
+                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "text", placeholder: placeholder, className: cx('leadgen-control', classes.control), 
                     // onChangeRaw={(e) => inputOnChange('text', e)}
                     label: placeholder, "data-control": "text", name: value }, form.getInputProps(value))));
             case 'NumberBlock':
-                return (React__default["default"].createElement(index$2.NumberInput, Object.assign({ key: index, withAsterisk: true, spellCheck: false, type: "number", placeholder: placeholder, className: cx('leadgen-control', classes.control), 
+                return (React__default["default"].createElement(index$2.NumberInput, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "number", placeholder: placeholder, className: cx('leadgen-control', classes.control), 
                     // onChange={(e) => inputOnChange('number', e)}
                     label: placeholder, "data-control": "number", name: value }, form.getInputProps(value))));
             case 'EmailBlock':
-                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: true, spellCheck: false, 
+                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: required, spellCheck: false, 
                     // type="email"
                     placeholder: placeholder, className: cx('leadgen-control', classes.control), label: placeholder, "data-control": "email", name: value }, form.getInputProps(value))));
             case 'PhoneOtpBlock':
             case 'WhatsappOtpBlock':
             case 'PhoneBlock': {
                 const id = popupId + '-' + value + '-' + index;
-                return (React__default["default"].createElement(index$2.Input.Wrapper, Object.assign({ size: "md", withAsterisk: true, key: index, label: placeholder, 
+                return (React__default["default"].createElement(index$2.Input.Wrapper, Object.assign({ size: "md", withAsterisk: required, key: index, label: placeholder, 
                     // error={errorField.phone}
                     className: cx('leadgen-control', classes.control), labelProps: {
                         htmlFor: id,
@@ -616,11 +701,11 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
                         id: id, defaultCountry: (locale ? utils.MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel" })));
             }
             case 'LocationBlock': {
-                return (React__default["default"].createElement(LocationBlock$1, { key: index, name: value, placeholder: placeholder, locale: locale }));
+                return (React__default["default"].createElement(LocationBlock$1, { key: index, name: value, placeholder: placeholder, locale: locale, required: required }));
             }
             case 'DateBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
-                    React__default["default"].createElement(index$4.DatePicker, Object.assign({ withAsterisk: true, key: index, type: "default", name: value, placeholder: placeholder, className: cx('leadgen-control', classes.control), label: placeholder, "data-control": "date", popoverProps: popoverProps }, form.getInputProps(value))),
+                    React__default["default"].createElement(index$4.DatePicker, Object.assign({ withAsterisk: required, key: index, type: "default", name: value, placeholder: placeholder, className: cx('leadgen-control', classes.control), label: placeholder, "data-control": "date", popoverProps: popoverProps }, form.getInputProps(value))),
                     React__default["default"].createElement("input", { type: "hidden", name: value, "data-control": "date" })));
             case 'LinkButtonBlock':
                 return (React__default["default"].createElement("div", { key: index },
@@ -634,7 +719,7 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
                     isSendMailChimp && (React__default["default"].createElement("div", { style: {
                             display: 'none',
                         }, "data-name": value + '-mailchimp' })),
-                    React__default["default"].createElement(index$2.Checkbox.Group, Object.assign({ withAsterisk: true, className: cx('leadgen-control', classes.control), key: index, label: placeholder, size: "md", sx: {
+                    React__default["default"].createElement(index$2.Checkbox.Group, Object.assign({ withAsterisk: required, className: cx('leadgen-control', classes.control), key: index, label: placeholder, size: "md", sx: {
                             display: 'flex',
                             flexDirection: 'column',
                             gap: 8,
@@ -642,11 +727,11 @@ const Fields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, style
             case 'RadioBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
                     isSendMailChimp && (React__default["default"].createElement(index$2.Input, { type: "hidden", name: value + '-mailchimp', value: isSendMailChimp })),
-                    React__default["default"].createElement(index$2.Radio.Group, Object.assign({ withAsterisk: true, className: cx('leadgen-control', classes.control), key: index, label: placeholder, size: "md" }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$2.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio" }))))));
+                    React__default["default"].createElement(index$2.Radio.Group, Object.assign({ withAsterisk: required, className: cx('leadgen-control', classes.control), key: index, label: placeholder, size: "md" }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$2.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio" }))))));
             case 'DropdownBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
                     React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": value, "data-control": 'dropdown' }),
-                    React__default["default"].createElement(index$2.Select, Object.assign({ key: index, className: cx('leadgen-control', classes.control), label: placeholder, withAsterisk: true, name: value, data: listQuestion.map((l) => ({
+                    React__default["default"].createElement(index$2.Select, Object.assign({ key: index, className: cx('leadgen-control', classes.control), label: placeholder, withAsterisk: required, name: value, data: listQuestion.map((l) => ({
                             value: l.value,
                             label: l.placeholder,
                         })) }, form.getInputProps(value)))));
@@ -1082,8 +1167,8 @@ var viVN = {
 	"validator.max": "Hãy nhập từ {0} trở xuống.",
 	"validator.min": "Hãy nhập từ {0} trở lên.",
 	"validator.phone": "Nhập đúng định dạng số điện thoại",
-	"validator.emailUsed": "Email này đã được sử dụng cho chiến dịch.",
-	"validator.phoneUsed": "Số điện thoại này đã được sử dụng cho chiến dịch.",
+	"validator.emailUsed": "Email này đã được sử dụng.",
+	"validator.phoneUsed": "Số điện thoại này đã được sử dụng.",
 	"lead.otp.title": "Nhập OTP",
 	"lead.otp.desc": "Chúng tôi đã gửi OTP đến số điện thoại của bạn {phone}",
 	"lead.otp.verify": "Xác minh",
@@ -1264,14 +1349,20 @@ const useLeadFormConfig = ({ listBlockAdded = [], validatingPhoneRef, validating
             'TncBlock',
         ];
         // ALL are required and can skip if not touched yet
-        const withSharedCheck = (name, cb) => {
+        const withSharedCheck = (name, cb, 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        block) => {
             return (value) => {
+                var _a;
+                const isBLockRequired = (_a = block === null || block === void 0 ? void 0 : block.data) === null || _a === void 0 ? void 0 : _a.required;
                 if (!formRef.current.isTouched(name))
                     return;
                 if (typeof value === 'undefined' ||
                     value === '' ||
                     (Array.isArray(value) && value.length === 0)) {
-                    return t('validator.required');
+                    return isBLockRequired
+                        ? t('validator.required')
+                        : cb === null || cb === void 0 ? void 0 : cb(value);
                 }
                 return cb === null || cb === void 0 ? void 0 : cb(value);
             };
@@ -1279,18 +1370,22 @@ const useLeadFormConfig = ({ listBlockAdded = [], validatingPhoneRef, validating
         return listBlockAdded
             .filter((b) => InputBlocks.includes(b.name))
             .reduce((r, b) => {
+            var _a;
+            const isRequired = (_a = b.data.required) !== null && _a !== void 0 ? _a : true;
             if (b.name === 'NumberBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (isNaN(Number(value))) {
+                        if (value && isNaN(Number(value))) {
                             return t('validator.number');
                         }
-                    }) });
+                    }, b) });
             }
             else if (b.name === 'EmailBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
+                        if (value && !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(value)) {
                             return t('validator.email');
                         }
+                        if (!value)
+                            return;
                         validatingEmailRef.current = true;
                         setTimeout(() => {
                             formRef.current.setFieldError(b.data.value, 'Validating...');
@@ -1312,55 +1407,77 @@ const useLeadFormConfig = ({ listBlockAdded = [], validatingPhoneRef, validating
                                 validatingEmailRef.current = false;
                             });
                         }, 200);
-                    }) });
+                    }, b) });
             }
             else if (b.name === 'PhoneBlock' ||
                 b.name === 'PhoneOtpBlock' ||
                 b.name === 'WhatsappOtpBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (window.intlTelInputUtils &&
+                        if (value &&
+                            window.intlTelInputUtils &&
                             !window.intlTelInputUtils.isValidNumber(String(value), LEAD_LOCALE.countryCode)) {
                             return t('validator.phone');
                         }
+                        if (!value)
+                            return;
                         validatingPhoneRef.current = true;
                         setTimeout(() => {
                             formRef.current.setFieldError(b.data.value, 'Validating...');
-                            checkUsedEmailOrPhoneWithCache(campaignId, campaign_subot_id, {
-                                phone: value,
-                            })
-                                .then((tKey) => {
-                                if (tKey) {
-                                    formRef.current.setFieldError(b.data.value, t(tKey));
-                                }
-                                else {
-                                    formRef.current.clearFieldError(b.data.value);
-                                }
-                                validatingPhoneRef.current = false;
-                            })
-                                .catch((e) => {
-                                console.error(e);
-                                formRef.current.setFieldError(b.data.value, e.message || 'Something went wrong');
-                                validatingPhoneRef.current = false;
-                            });
+                            if (b.data.singleSubmission) {
+                                checkUsedPhoneOnlyWithCache(campaignId, value)
+                                    .then((tKey) => {
+                                    if (tKey) {
+                                        formRef.current.setFieldError(b.data.value, t(tKey));
+                                    }
+                                    else {
+                                        formRef.current.clearFieldError(b.data.value);
+                                    }
+                                    validatingPhoneRef.current = false;
+                                })
+                                    .catch((err) => {
+                                    console.error(err);
+                                    formRef.current.setFieldError(b.data.value, err.message || 'Something went wrong');
+                                    validatingPhoneRef.current = false;
+                                });
+                            }
+                            else {
+                                checkUsedEmailOrPhoneWithCache(campaignId, campaign_subot_id, {
+                                    phone: value,
+                                })
+                                    .then((tKey) => {
+                                    if (tKey) {
+                                        formRef.current.setFieldError(b.data.value, t(tKey));
+                                    }
+                                    else {
+                                        formRef.current.clearFieldError(b.data.value);
+                                    }
+                                    validatingPhoneRef.current = false;
+                                })
+                                    .catch((e) => {
+                                    console.error(e);
+                                    formRef.current.setFieldError(b.data.value, e.message || 'Something went wrong');
+                                    validatingPhoneRef.current = false;
+                                });
+                            }
                         }, 200);
-                    }) });
+                    }, b) });
             }
             else if (b.name === 'DateBlock') {
                 return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, (value) => {
-                        if (isNaN(Date.parse(value))) {
+                        if (value && isNaN(Date.parse(value))) {
                             return t('validator.date');
                         }
-                    }) });
+                    }, b) });
             }
             else if (b.name === 'TncBlock') {
                 return Object.assign(Object.assign({}, r), { [`TNC-` + b.id]: withSharedCheck('TNC-' + b.id, (value) => {
-                        if (!value) {
+                        if (isRequired && !value) {
                             return t('validator.required');
                         }
-                    }) });
+                    }, b) });
             }
             else {
-                return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value) });
+                return Object.assign(Object.assign({}, r), { [b.data.value]: withSharedCheck(b.data.value, undefined, b) });
             }
         }, {});
     }, [listBlockAdded.map((b) => b.name).join(',')]);
@@ -1375,7 +1492,7 @@ const useLeadFormConfig = ({ listBlockAdded = [], validatingPhoneRef, validating
 };
 
 const libraries = ['places'];
-const LocationBlock = ({ name, placeholder, locale, }) => {
+const LocationBlock = ({ name, placeholder, locale, required = true, }) => {
     var _a;
     const form = useLeadFormContext();
     const [searchValue, setSearchValue] = React.useState('');
@@ -1419,7 +1536,7 @@ const LocationBlock = ({ name, placeholder, locale, }) => {
     return (React__default["default"].createElement(React__default["default"].Fragment, null,
         LoadScript && (React__default["default"].createElement(LoadScript, { googleMapsApiKey: usePlacesAutocomplete.GOOGLE_API_KEY, libraries: libraries, loadingElement: React__default["default"].createElement(React__default["default"].Fragment, null) })),
         React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": name, "data-control": 'text' }),
-        React__default["default"].createElement(index$2.Select, Object.assign({ className: "lead-modal__form-control", label: placeholder, placeholder: placeholder, withAsterisk: true, name: name, data: options, searchValue: searchValue, onSearchChange: (query) => {
+        React__default["default"].createElement(index$2.Select, Object.assign({ className: "lead-modal__form-control", label: placeholder, placeholder: placeholder, withAsterisk: required, name: name, data: options, searchValue: searchValue, onSearchChange: (query) => {
                 setSearchValue(query);
             }, filter: () => true, clearable: true, searchable: true, onChange: (val) => setAddress(val || ''), icon: React__default["default"].createElement("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none" },
                 React__default["default"].createElement("path", { d: "M10 9.792q.605 0 1.032-.427.426-.428.426-1.032 0-.603-.426-1.031A1.4 1.4 0 0 0 10 6.875q-.604 0-1.032.427a1.4 1.4 0 0 0-.426 1.031q0 .604.426 1.032.428.426 1.032.427m0 8.083q-.145 0-.292-.042a.7.7 0 0 1-.27-.145Q6.478 15 5.01 12.708 3.54 10.418 3.54 8.5q0-3.021 1.949-4.823T10 1.875t4.51 1.802q1.95 1.802 1.949 4.823 0 1.917-1.468 4.208-1.47 2.292-4.427 4.98a.7.7 0 0 1-.271.145 1 1 0 0 1-.292.042", fill: "#8C8C8C" })), autoComplete: 'no-auto-complete-' + randRef.current, rightSection: React__default["default"].createElement(React__default["default"].Fragment, null) }, form.getInputProps(name)))));
@@ -1432,30 +1549,32 @@ const TitleBlock = ({ children, align, }) => (React__default["default"].createEl
 const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmit, }) => {
     const form = useLeadFormContext();
     return (React__default["default"].createElement(React__default["default"].Fragment, null, listBlockAdded.map((b, index) => {
+        var _a;
         const { name = '', data = {} } = b || {};
         const { placeholder, value, align, listQuestion, isSendMailChimp = false, newtab, url, } = data;
+        const required = (_a = data.required) !== null && _a !== void 0 ? _a : true;
         switch (name) {
             case 'TitleBlock':
                 return (React__default["default"].createElement(TitleBlock, { key: index, align: align }, value));
             case 'SubtitleBlock':
                 return (React__default["default"].createElement(SubtitleBlock, { key: index, align: align }, value));
             case 'TextBlock':
-                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: true, spellCheck: false, type: "text", placeholder: placeholder, className: "lead-modal__form-control", 
+                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "text", placeholder: placeholder, className: "lead-modal__form-control", 
                     // onChangeRaw={(e) => inputOnChange('text', e)}
                     label: placeholder, "data-control": "text", name: value }, form.getInputProps(value))));
             case 'NumberBlock':
-                return (React__default["default"].createElement(index$2.NumberInput, Object.assign({ key: index, withAsterisk: true, spellCheck: false, type: "number", placeholder: placeholder, className: "lead-modal__form-control", 
+                return (React__default["default"].createElement(index$2.NumberInput, Object.assign({ key: index, withAsterisk: required, spellCheck: false, type: "number", placeholder: placeholder, className: "lead-modal__form-control", 
                     // onChange={(e) => inputOnChange('number', e)}
                     label: placeholder, "data-control": "number", name: value }, form.getInputProps(value))));
             case 'EmailBlock':
-                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: true, spellCheck: false, 
+                return (React__default["default"].createElement(index$2.Input, Object.assign({ key: index, withAsterisk: required, spellCheck: false, 
                     // type="email"
                     placeholder: placeholder, className: "lead-modal__form-control", label: placeholder, "data-control": "email", name: value }, form.getInputProps(value))));
             case 'PhoneOtpBlock':
             case 'WhatsappOtpBlock':
             case 'PhoneBlock': {
                 const id = popupId + '-' + value + '-' + index;
-                return (React__default["default"].createElement(index$2.Input.Wrapper, Object.assign({ size: "md", withAsterisk: true, key: index, label: placeholder, 
+                return (React__default["default"].createElement(index$2.Input.Wrapper, Object.assign({ size: "md", withAsterisk: required, key: index, label: placeholder, 
                     // error={errorField.phone}
                     className: "lead-modal__form-control", labelProps: {
                         htmlFor: id,
@@ -1467,11 +1586,11 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                         id: id, defaultCountry: (locale ? utils.MAPPED_LOCALE[locale] || 'VN' : 'VN'), "data-control": "tel" })));
             }
             case 'LocationBlock': {
-                return (React__default["default"].createElement(LocationBlock, { key: index, name: value, placeholder: placeholder, locale: locale }));
+                return (React__default["default"].createElement(LocationBlock, { key: index, name: value, placeholder: placeholder, locale: locale, required: required }));
             }
             case 'DateBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
-                    React__default["default"].createElement(index$4.DatePicker, Object.assign({ withAsterisk: true, key: index, type: "default", name: value, placeholder: placeholder, className: "lead-modal__form-control", label: placeholder, "data-control": "date" }, form.getInputProps(value))),
+                    React__default["default"].createElement(index$4.DatePicker, Object.assign({ withAsterisk: required, key: index, type: "default", name: value, placeholder: placeholder, className: "lead-modal__form-control", label: placeholder, "data-control": "date" }, form.getInputProps(value))),
                     React__default["default"].createElement("input", { type: "hidden", name: value, "data-control": "date" })));
             case 'LinkButtonBlock':
                 return (React__default["default"].createElement("div", { key: index },
@@ -1485,7 +1604,7 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
                     isSendMailChimp && (React__default["default"].createElement("div", { style: {
                             display: 'none',
                         }, "data-name": value + '-mailchimp' })),
-                    React__default["default"].createElement(index$2.Checkbox.Group, Object.assign({ withAsterisk: true, className: "lead-modal__form-control", key: index, label: placeholder, size: "md", sx: {
+                    React__default["default"].createElement(index$2.Checkbox.Group, Object.assign({ withAsterisk: required, className: "lead-modal__form-control", key: index, label: placeholder, size: "md", sx: {
                             display: 'flex',
                             flexDirection: 'column',
                             gap: 8,
@@ -1493,11 +1612,11 @@ const LightboxFields = ({ listBlockAdded, popupId, locale, onClose, onOtherSubmi
             case 'RadioBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
                     isSendMailChimp && (React__default["default"].createElement(index$2.Input, { type: "hidden", name: value + '-mailchimp', value: isSendMailChimp })),
-                    React__default["default"].createElement(index$2.Radio.Group, Object.assign({ withAsterisk: true, className: "lead-modal__form-control", key: index, label: placeholder, size: "md" }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$2.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio" }))))));
+                    React__default["default"].createElement(index$2.Radio.Group, Object.assign({ withAsterisk: required, className: "lead-modal__form-control", key: index, label: placeholder, size: "md" }, form.getInputProps(value)), listQuestion.map((l, _index) => (React__default["default"].createElement(index$2.Radio, { name: value, key: _index, value: l.value, label: l.placeholder, "data-control": "radio" }))))));
             case 'DropdownBlock':
                 return (React__default["default"].createElement(React__default["default"].Fragment, null,
                     React__default["default"].createElement("div", { style: { display: 'none' }, "data-extra": true, "data-name": value, "data-control": 'dropdown' }),
-                    React__default["default"].createElement(index$2.Select, Object.assign({ key: index, className: "lead-modal__form-control", label: placeholder, withAsterisk: true, name: value, data: listQuestion.map((l) => ({
+                    React__default["default"].createElement(index$2.Select, Object.assign({ key: index, className: "lead-modal__form-control", label: placeholder, withAsterisk: required, name: value, data: listQuestion.map((l) => ({
                             value: l.value,
                             label: l.placeholder,
                         })) }, form.getInputProps(value)))));
@@ -2634,11 +2753,12 @@ const _LeadGen = ({ apiUrl: apiUrlProp, siteDomain, siteId, locale, apiSubotUrl,
     }, []);
     const onSubmit = (currentForm, formDataObj, categoryLevel, categoryData) => tslib_es6.__awaiter(void 0, void 0, void 0, function* () {
         var _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-        debugger;
         if (!formDataObj)
             return;
         LeadLog('submitHandler', categoryLevel, categoryData);
-        const formData = Object.keys(formDataObj).map((key) => ({
+        const formData = Object.keys(formDataObj)
+            .filter((key) => !!formDataObj[key])
+            .map((key) => ({
             name: key,
             value: String(formDataObj[key]),
         }));