s-platform-landing-section 0.1.36-beta.1 → 0.1.36-beta.11

package/dist/index.modern.js

@@ -19,7 +19,7 @@ import 'slick-carousel/slick/slick-theme.css';
 import { BsCurrencyDollar } from 'react-icons/bs';
 import { GoCreditCard, GoClock } from 'react-icons/go';
 import { GrPowerCycle } from 'react-icons/gr';
-import { RiMessengerFill, RiDoubleQuotesL, RiDeleteBin7Line } from 'react-icons/ri';
+import { RiMessengerFill, RiDoubleQuotesL, RiDoubleQuotesR, RiDeleteBin7Line } from 'react-icons/ri';
 import { HiOutlineLocationMarker, HiOutlineArrowNarrowLeft, HiOutlineArrowNarrowRight } from 'react-icons/hi';
 import { GiNewspaper } from 'react-icons/gi';
 
@@ -112,33 +112,34 @@ var getDurationValue = function getDurationValue(attributes) {
   return durationAtt ? ((durationAtt === null || durationAtt === void 0 ? void 0 : (_durationAtt$value = durationAtt.value) === null || _durationAtt$value === void 0 ? void 0 : _durationAtt$value[0]) || "0") + " p" : "";
 };
 var genProductSlugVi = function genProductSlugVi(productName, id) {
-  var _productName$replace;
-  return (productName === null || productName === void 0 ? void 0 : (_productName$replace = productName.replace(/\s+/g, "-")) === null || _productName$replace === void 0 ? void 0 : _productName$replace.replace(/\//g, "~")) + "-" + id;
+  var _productName$replace, _productName$replace$, _productName$replace$2, _productName$replace$3, _productName$replace$4;
+  var slug = productName === null || productName === void 0 ? void 0 : (_productName$replace = productName.replace(/%/g, 'pct')) === null || _productName$replace === void 0 ? void 0 : (_productName$replace$ = _productName$replace.replace(/\//g, 'fs')) === null || _productName$replace$ === void 0 ? void 0 : (_productName$replace$2 = _productName$replace$.replace(/&/g, 'amp')) === null || _productName$replace$2 === void 0 ? void 0 : (_productName$replace$3 = _productName$replace$2.replace(/-/g, 'hyp')) === null || _productName$replace$3 === void 0 ? void 0 : (_productName$replace$4 = _productName$replace$3.replace(/\s+/g, '-')) === null || _productName$replace$4 === void 0 ? void 0 : _productName$replace$4.replace(/(?:[\0-!#%-'\*\+\/<-\?\\\^`\{\}\x7F-\xA9\xAB-\xB4\xB6-\xB9\xBB-\xBF\xD7\xF7\u02C2-\u02C5\u02D2-\u02DF\u02E5-\u02EB\u02ED\u02EF-\u036F\u0375\u0378\u0379\u037E\u0380-\u0385\u0387\u038B\u038D\u03A2\u03F6\u0482-\u0489\u0530\u0557\u0558\u055A-\u055F\u0589-\u05CF\u05EB-\u05EE\u05F3-\u061F\u064B-\u066D\u0670\u06D4\u06D6-\u06E4\u06E7-\u06ED\u06F0-\u06F9\u06FD\u06FE\u0700-\u070F\u0711\u0730-\u074C\u07A6-\u07B0\u07B2-\u07C9\u07EB-\u07F3\u07F6-\u07F9\u07FB-\u07FF\u0816-\u0819\u081B-\u0823\u0825-\u0827\u0829-\u083F\u0859-\u085F\u086B-\u086F\u0888\u088F-\u089F\u08CA-\u0903\u093A-\u093C\u093E-\u094F\u0951-\u0957\u0962-\u0970\u0981-\u0984\u098D\u098E\u0991\u0992\u09A9\u09B1\u09B3-\u09B5\u09BA-\u09BC\u09BE-\u09CD\u09CF-\u09DB\u09DE\u09E2-\u09EF\u09F2-\u09FB\u09FD-\u0A04\u0A0B-\u0A0E\u0A11\u0A12\u0A29\u0A31\u0A34\u0A37\u0A3A-\u0A58\u0A5D\u0A5F-\u0A71\u0A75-\u0A84\u0A8E\u0A92\u0AA9\u0AB1\u0AB4\u0ABA-\u0ABC\u0ABE-\u0ACF\u0AD1-\u0ADF\u0AE2-\u0AF8\u0AFA-\u0B04\u0B0D\u0B0E\u0B11\u0B12\u0B29\u0B31\u0B34\u0B3A-\u0B3C\u0B3E-\u0B5B\u0B5E\u0B62-\u0B70\u0B72-\u0B82\u0B84\u0B8B-\u0B8D\u0B91\u0B96-\u0B98\u0B9B\u0B9D\u0BA0-\u0BA2\u0BA5-\u0BA7\u0BAB-\u0BAD\u0BBA-\u0BCF\u0BD1-\u0C04\u0C0D\u0C11\u0C29\u0C3A-\u0C3C\u0C3E-\u0C57\u0C5B\u0C5C\u0C5E\u0C5F\u0C62-\u0C7F\u0C81-\u0C84\u0C8D\u0C91\u0CA9\u0CB4\u0CBA-\u0CBC\u0CBE-\u0CDC\u0CDF\u0CE2-\u0CF0\u0CF3-\u0D03\u0D0D\u0D11\u0D3B\u0D3C\u0D3E-\u0D4D\u0D4F-\u0D53\u0D57-\u0D5E\u0D62-\u0D79\u0D80-\u0D84\u0D97-\u0D99\u0DB2\u0DBC\u0DBE\u0DBF\u0DC7-\u0E00\u0E31\u0E34-\u0E3F\u0E47-\u0E80\u0E83\u0E85\u0E8B\u0EA4\u0EA6\u0EB1\u0EB4-\u0EBC\u0EBE\u0EBF\u0EC5\u0EC7-\u0EDB\u0EE0-\u0EFF\u0F01-\u0F3F\u0F48\u0F6D-\u0F87\u0F8D-\u0FFF\u102B-\u103E\u1040-\u104F\u1056-\u1059\u105E-\u1060\u1062-\u1064\u1067-\u106D\u1071-\u1074\u1082-\u108D\u108F-\u109F\u10C6\u10C8-\u10CC\u10CE\u10CF\u10FB\u1249\u124E\u124F\u1257\u1259\u125E\u125F\u1289\u128E\u128F\u12B1\u12B6\u12B7\u12BF\u12C1\u12C6\u12C7\u12D7\u1311\u1316\u1317\u135B-\u137F\u1390-\u139F\u13F6\u13F7\u13FE-\u1400\u166D\u166E\u1680\u169B-\u169F\u16EB-\u16F0\u16F9-\u16FF\u1712-\u171E\u1732-\u173F\u1752-\u175F\u176D\u1771-\u177F\u17B4-\u17D6\u17D8-\u17DB\u17DD-\u181F\u1879-\u187F\u1885\u1886\u18A9\u18AB-\u18AF\u18F6-\u18FF\u191F-\u194F\u196E\u196F\u1975-\u197F\u19AC-\u19AF\u19CA-\u19FF\u1A17-\u1A1F\u1A55-\u1AA6\u1AA8-\u1B04\u1B34-\u1B44\u1B4D-\u1B82\u1BA1-\u1BAD\u1BB0-\u1BB9\u1BE6-\u1BFF\u1C24-\u1C4C\u1C50-\u1C59\u1C7E\u1C7F\u1C8B-\u1C8F\u1CBB\u1CBC\u1CC0-\u1CE8\u1CED\u1CF4\u1CF7-\u1CF9\u1CFB-\u1CFF\u1DC0-\u1DFF\u1F16\u1F17\u1F1E\u1F1F\u1F46\u1F47\u1F4E\u1F4F\u1F58\u1F5A\u1F5C\u1F5E\u1F7E\u1F7F\u1FB5\u1FBD\u1FBF-\u1FC1\u1FC5\u1FCD-\u1FCF\u1FD4\u1FD5\u1FDC-\u1FDF\u1FED-\u1FF1\u1FF5\u1FFD-\u2070\u2072-\u207E\u2080-\u208F\u209D-\u2101\u2103-\u2106\u2108\u2109\u2114\u2116-\u2118\u211E-\u2123\u2125\u2127\u2129\u212E\u213A\u213B\u2140-\u2144\u214A-\u214D\u214F-\u2182\u2185-\u2BFF\u2CE5-\u2CEA\u2CEF-\u2CF1\u2CF4-\u2CFF\u2D26\u2D28-\u2D2C\u2D2E\u2D2F\u2D68-\u2D6E\u2D70-\u2D7F\u2D97-\u2D9F\u2DA7\u2DAF\u2DB7\u2DBF\u2DC7\u2DCF\u2DD7\u2DDF-\u2E2E\u2E30-\u3004\u3007-\u3030\u3036-\u303A\u303D-\u3040\u3097-\u309C\u30A0\u30FB\u3100-\u3104\u3130\u318F-\u319F\u31C0-\u31EF\u3200-\u33FF\u4DC0-\u4DFF\uA48D-\uA4CF\uA4FE\uA4FF\uA60D-\uA60F\uA620-\uA629\uA62C-\uA63F\uA66F-\uA67E\uA69E\uA69F\uA6E6-\uA716\uA720\uA721\uA789\uA78A\uA7CE\uA7CF\uA7D2\uA7D4\uA7DD-\uA7F1\uA802\uA806\uA80B\uA823-\uA83F\uA874-\uA881\uA8B4-\uA8F1\uA8F8-\uA8FA\uA8FC\uA8FF-\uA909\uA926-\uA92F\uA947-\uA95F\uA97D-\uA983\uA9B3-\uA9CE\uA9D0-\uA9DF\uA9E5\uA9F0-\uA9F9\uA9FF\uAA29-\uAA3F\uAA43\uAA4C-\uAA5F\uAA77-\uAA79\uAA7B-\uAA7D\uAAB0\uAAB2-\uAAB4\uAAB7\uAAB8\uAABE\uAABF\uAAC1\uAAC3-\uAADA\uAADE\uAADF\uAAEB-\uAAF1\uAAF5-\uAB00\uAB07\uAB08\uAB0F\uAB10\uAB17-\uAB1F\uAB27\uAB2F\uAB5B\uAB6A-\uAB6F\uABE3-\uABFF\uD7A4-\uD7AF\uD7C7-\uD7CA\uD7FC-\uD7FF\uE000-\uF8FF\uFA6E\uFA6F\uFADA-\uFAFF\uFB07-\uFB12\uFB18-\uFB1C\uFB1E\uFB29\uFB37\uFB3D\uFB3F\uFB42\uFB45\uFBB2-\uFBD2\uFD3E-\uFD4F\uFD90\uFD91\uFDC8-\uFDEF\uFDFC-\uFE6F\uFE75\uFEFD-\uFF20\uFF3B-\uFF40\uFF5B-\uFF65\uFFBF-\uFFC1\uFFC8\uFFC9\uFFD0\uFFD1\uFFD8\uFFD9\uFFDD-\uFFFF]|\uD800[\uDC0C\uDC27\uDC3B\uDC3E\uDC4E\uDC4F\uDC5E-\uDC7F\uDCFB-\uDE7F\uDE9D-\uDE9F\uDED1-\uDEFF\uDF20-\uDF2C\uDF41\uDF4A-\uDF4F\uDF76-\uDF7F\uDF9E\uDF9F\uDFC4-\uDFC7\uDFD0-\uDFFF]|\uD801[\uDC9E-\uDCAF\uDCD4-\uDCD7\uDCFC-\uDCFF\uDD28-\uDD2F\uDD64-\uDD6F\uDD7B\uDD8B\uDD93\uDD96\uDDA2\uDDB2\uDDBA\uDDBD-\uDDBF\uDDF4-\uDDFF\uDF37-\uDF3F\uDF56-\uDF5F\uDF68-\uDF7F\uDF86\uDFB1\uDFBB-\uDFFF]|\uD802[\uDC06\uDC07\uDC09\uDC36\uDC39-\uDC3B\uDC3D\uDC3E\uDC56-\uDC5F\uDC77-\uDC7F\uDC9F-\uDCDF\uDCF3\uDCF6-\uDCFF\uDD16-\uDD1F\uDD3A-\uDD7F\uDDB8-\uDDBD\uDDC0-\uDDFF\uDE01-\uDE0F\uDE14\uDE18\uDE36-\uDE5F\uDE7D-\uDE7F\uDE9D-\uDEBF\uDEC8\uDEE5-\uDEFF\uDF36-\uDF3F\uDF56-\uDF5F\uDF73-\uDF7F\uDF92-\uDFFF]|\uD803[\uDC49-\uDC7F\uDCB3-\uDCBF\uDCF3-\uDCFF\uDD24-\uDD49\uDD66-\uDD6E\uDD86-\uDE7F\uDEAA-\uDEAF\uDEB2-\uDEC1\uDEC5-\uDEFF\uDF1D-\uDF26\uDF28-\uDF2F\uDF46-\uDF6F\uDF82-\uDFAF\uDFC5-\uDFDF\uDFF7-\uDFFF]|\uD804[\uDC00-\uDC02\uDC38-\uDC70\uDC73\uDC74\uDC76-\uDC82\uDCB0-\uDCCF\uDCE9-\uDD02\uDD27-\uDD43\uDD45\uDD46\uDD48-\uDD4F\uDD73-\uDD75\uDD77-\uDD82\uDDB3-\uDDC0\uDDC5-\uDDD9\uDDDB\uDDDD-\uDDFF\uDE12\uDE2C-\uDE3E\uDE41-\uDE7F\uDE87\uDE89\uDE8E\uDE9E\uDEA9-\uDEAF\uDEDF-\uDF04\uDF0D\uDF0E\uDF11\uDF12\uDF29\uDF31\uDF34\uDF3A-\uDF3C\uDF3E-\uDF4F\uDF51-\uDF5C\uDF62-\uDF7F\uDF8A\uDF8C\uDF8D\uDF8F\uDFB6\uDFB8-\uDFD0\uDFD2\uDFD4-\uDFFF]|\uD805[\uDC35-\uDC46\uDC4B-\uDC5E\uDC62-\uDC7F\uDCB0-\uDCC3\uDCC6\uDCC8-\uDD7F\uDDAF-\uDDD7\uDDDC-\uDDFF\uDE30-\uDE43\uDE45-\uDE7F\uDEAB-\uDEB7\uDEB9-\uDEFF\uDF1B-\uDF3F\uDF47-\uDFFF]|\uD806[\uDC2C-\uDC9F\uDCE0-\uDCFE\uDD07\uDD08\uDD0A\uDD0B\uDD14\uDD17\uDD30-\uDD3E\uDD40\uDD42-\uDD9F\uDDA8\uDDA9\uDDD1-\uDDE0\uDDE2\uDDE4-\uDDFF\uDE01-\uDE0A\uDE33-\uDE39\uDE3B-\uDE4F\uDE51-\uDE5B\uDE8A-\uDE9C\uDE9E-\uDEAF\uDEF9-\uDFBF\uDFE1-\uDFFF]|\uD807[\uDC09\uDC2F-\uDC3F\uDC41-\uDC71\uDC90-\uDCFF\uDD07\uDD0A\uDD31-\uDD45\uDD47-\uDD5F\uDD66\uDD69\uDD8A-\uDD97\uDD99-\uDEDF\uDEF3-\uDF01\uDF03\uDF11\uDF34-\uDFAF\uDFB1-\uDFFF]|\uD808[\uDF9A-\uDFFF]|\uD809[\uDC00-\uDC7F\uDD44-\uDFFF]|[\uD80A\uD812-\uD817\uD819\uD824-\uD82A\uD82D\uD82E\uD830-\uD834\uD836\uD83C-\uD83F\uD87C\uD87D\uD87F\uD889-\uDBFF][\uDC00-\uDFFF]|\uD80B[\uDC00-\uDF8F\uDFF1-\uDFFF]|\uD80D[\uDC30-\uDC40\uDC47-\uDC5F]|\uD810[\uDFFB-\uDFFF]|\uD811[\uDE47-\uDFFF]|\uD818[\uDC00-\uDCFF\uDD1E-\uDFFF]|\uD81A[\uDE39-\uDE3F\uDE5F-\uDE6F\uDEBF-\uDECF\uDEEE-\uDEFF\uDF30-\uDF3F\uDF44-\uDF62\uDF78-\uDF7C\uDF90-\uDFFF]|\uD81B[\uDC00-\uDD3F\uDD6D-\uDE3F\uDE80-\uDEFF\uDF4B-\uDF4F\uDF51-\uDF92\uDFA0-\uDFDF\uDFE2\uDFE4-\uDFFF]|\uD821[\uDFF8-\uDFFF]|\uD823[\uDCD6-\uDCFE\uDD09-\uDFFF]|\uD82B[\uDC00-\uDFEF\uDFF4\uDFFC\uDFFF]|\uD82C[\uDD23-\uDD31\uDD33-\uDD4F\uDD53\uDD54\uDD56-\uDD63\uDD68-\uDD6F\uDEFC-\uDFFF]|\uD82F[\uDC6B-\uDC6F\uDC7D-\uDC7F\uDC89-\uDC8F\uDC9A-\uDFFF]|\uD835[\uDC55\uDC9D\uDCA0\uDCA1\uDCA3\uDCA4\uDCA7\uDCA8\uDCAD\uDCBA\uDCBC\uDCC4\uDD06\uDD0B\uDD0C\uDD15\uDD1D\uDD3A\uDD3F\uDD45\uDD47-\uDD49\uDD51\uDEA6\uDEA7\uDEC1\uDEDB\uDEFB\uDF15\uDF35\uDF4F\uDF6F\uDF89\uDFA9\uDFC3\uDFCC-\uDFFF]|\uD837[\uDC00-\uDEFF\uDF1F-\uDF24\uDF2B-\uDFFF]|\uD838[\uDC00-\uDC2F\uDC6E-\uDCFF\uDD2D-\uDD36\uDD3E-\uDD4D\uDD4F-\uDE8F\uDEAE-\uDEBF\uDEEC-\uDFFF]|\uD839[\uDC00-\uDCCF\uDCEC-\uDDCF\uDDEE\uDDEF\uDDF1-\uDFDF\uDFE7\uDFEC\uDFEF\uDFFF]|\uD83A[\uDCC5-\uDCFF\uDD44-\uDD4A\uDD4C-\uDFFF]|\uD83B[\uDC00-\uDDFF\uDE04\uDE20\uDE23\uDE25\uDE26\uDE28\uDE33\uDE38\uDE3A\uDE3C-\uDE41\uDE43-\uDE46\uDE48\uDE4A\uDE4C\uDE50\uDE53\uDE55\uDE56\uDE58\uDE5A\uDE5C\uDE5E\uDE60\uDE63\uDE65\uDE66\uDE6B\uDE73\uDE78\uDE7D\uDE7F\uDE8A\uDE9C-\uDEA0\uDEA4\uDEAA\uDEBC-\uDFFF]|\uD869[\uDEE0-\uDEFF]|\uD86D[\uDF3A-\uDF3F]|\uD86E[\uDC1E\uDC1F]|\uD873[\uDEA2-\uDEAF]|\uD87A[\uDFE1-\uDFEF]|\uD87B[\uDE5E-\uDFFF]|\uD87E[\uDE1E-\uDFFF]|\uD884[\uDF4B-\uDF4F]|\uD888[\uDFB0-\uDFFF]|[\uD800-\uDBFF](?![\uDC00-\uDFFF])|(?:[^\uD800-\uDBFF]|^)[\uDC00-\uDFFF])/g, '');
+  return slug + "-" + id;
 };
 var getLinkProductDetail = function getLinkProductDetail(product) {
   var slug = genProductSlugVi(product === null || product === void 0 ? void 0 : product.productName, product === null || product === void 0 ? void 0 : product.productId);
-  return "/san-pham/" + slug;
+  return "/san-pham/" + encodeURIComponent(slug);
 };
 var getLinkServiceDetail = function getLinkServiceDetail(product) {
   var slug = genProductSlugVi(product === null || product === void 0 ? void 0 : product.productName, product === null || product === void 0 ? void 0 : product.productId);
-  return "/dich-vu/" + slug;
+  return "/dich-vu/" + encodeURIComponent(slug);
 };
 var getLinkNewsDetail = function getLinkNewsDetail(news) {
   var slug = genProductSlugVi(news === null || news === void 0 ? void 0 : news.title, news === null || news === void 0 ? void 0 : news.articleId);
   var category = genProductSlugVi(news === null || news === void 0 ? void 0 : news.catName, news === null || news === void 0 ? void 0 : news.catId);
-  return "/tin-tuc/" + category + "/" + slug;
+  return "/tin-tuc/" + encodeURIComponent(category) + "/" + encodeURIComponent(slug);
 };
 var getLinkNewsByCategory = function getLinkNewsByCategory(news) {
   var slug = genProductSlugVi(news === null || news === void 0 ? void 0 : news.catName, news === null || news === void 0 ? void 0 : news.catId);
-  return "/tin-tuc-theo-danh-muc/" + slug;
+  return "/tin-tuc-theo-danh-muc/" + encodeURIComponent(slug);
 };
 var getLinkProductsByCategory = function getLinkProductsByCategory(product) {
   if (product !== null && product !== void 0 && product.categoryName) {
     var slug = genProductSlugVi(product === null || product === void 0 ? void 0 : product.categoryName, product === null || product === void 0 ? void 0 : product.categoryId);
-    return "/danh-muc/" + slug;
+    return "/danh-muc/" + encodeURIComponent(slug);
   } else {
     var _slug12 = genProductSlugVi(product === null || product === void 0 ? void 0 : product.cateName, product === null || product === void 0 ? void 0 : product.categoryId);
-    return "/danh-muc/" + _slug12;
+    return "/danh-muc/" + encodeURIComponent(_slug12);
   }
 };
 var LinkToPage = function LinkToPage(props) {
@@ -152,7 +153,7 @@ var genLinkSearch = function genLinkSearch(keyword) {
 };
 var configSvg = function configSvg(data) {
   var _data$replace, _data$replace$replace;
-  return data === null || data === void 0 ? void 0 : (_data$replace = data.replace(/<path(?![^>]*fill=")[^>]*>/g, "<path fill=\"currentColor\" $&")) === null || _data$replace === void 0 ? void 0 : (_data$replace$replace = _data$replace.replace(/width="[^"]*"/, '')) === null || _data$replace$replace === void 0 ? void 0 : _data$replace$replace.replace(/height="[^"]*"/, '');
+  return data === null || data === void 0 ? void 0 : (_data$replace = data.replace(/<path(?![^>]*fill=")[^>]*>/g, "<path fill=\"currentColor\" $&")) === null || _data$replace === void 0 ? void 0 : (_data$replace$replace = _data$replace.replace(/width=['"][^'"]*['"]/g, '')) === null || _data$replace$replace === void 0 ? void 0 : _data$replace$replace.replace(/height=['"][^'"]*['"]/g, '');
 };
 var urlMappings = {
   "/products": "/san-pham",
@@ -433,7 +434,7 @@ var NavBar7 = function NavBar7(props) {
     href: "/",
     className: "flex items-center gap-2"
   }, /*#__PURE__*/React__default.createElement("img", {
-    className: "object-cover w-12 max-h-12",
+    className: "object-contain w-12 h-12",
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl
   }), /*#__PURE__*/React__default.createElement("h3", {
     className: "text-xl md:text-2xl text-primary font-headingFont text-wrap line-clamp-2 leading-tight"
@@ -496,7 +497,7 @@ var NavBar7 = function NavBar7(props) {
     href: "/",
     className: "flex flex-1 gap-2 items-center"
   }, /*#__PURE__*/React__default.createElement("img", {
-    className: "object-cover w-12 max-h-12",
+    className: "object-contain w-12 h-12",
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl
   }), /*#__PURE__*/React__default.createElement("h3", {
     className: "text-xl md:text-2xl font-headingFont text-wrap text-primary line-clamp-2"
@@ -530,7 +531,7 @@ var NavBar7 = function NavBar7(props) {
     className: "flex gap-2 items-center mb-2"
   }, /*#__PURE__*/React__default.createElement("img", {
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
-    className: "max-h-14 w-14 object-cover"
+    className: "h-14 w-14 object-contain"
   }), /*#__PURE__*/React__default.createElement("h3", {
     className: "text-xl font-headingFont text-primary line-clamp-1"
   }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName))), /*#__PURE__*/React__default.createElement("button", {
@@ -726,7 +727,7 @@ var NavBar1 = function NavBar1(props) {
     href: "/",
     className: "flex items-center gap-2"
   }, /*#__PURE__*/React__default.createElement("img", {
-    className: "object-cover w-12 max-h-12",
+    className: "object-contain w-12 h-12",
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
     alt: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName
   }), /*#__PURE__*/React__default.createElement("h3", {
@@ -788,7 +789,7 @@ var NavBar1 = function NavBar1(props) {
     href: "/",
     className: "flex flex-1 gap-2 items-center"
   }, /*#__PURE__*/React__default.createElement("img", {
-    className: "object-cover w-12  max-h-12",
+    className: "object-contain w-12 h-12",
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
     alt: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName
   }), /*#__PURE__*/React__default.createElement("h3", {
@@ -823,7 +824,7 @@ var NavBar1 = function NavBar1(props) {
     className: "flex gap-2 items-center mb-2"
   }, /*#__PURE__*/React__default.createElement("img", {
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
-    className: "max-h-14 w-14 bg-cover bg-no-repeat"
+    className: "h-14 w-14 object-contain"
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "text-xl font-headingFont text-primary line-clamp-1"
   }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName))), /*#__PURE__*/React__default.createElement("button", {
@@ -1233,7 +1234,7 @@ var Hero2 = function Hero2(props) {
     className: "absolute inset-y-0 right-[2%] md:right-[4%] w-[58%] md:w-[54%] flex flex-col gap-2 md:gap-4 xl:gap-6 justify-center items-start px-4 pt-4 pb-2 md:px-8 md:pt-8 md:pb-6 xl:p-8"
   }, shopConfig !== null && shopConfig !== void 0 && shopConfig.logoUrl ? /*#__PURE__*/React__default.createElement("img", {
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
-    className: "h-6 w-6 sm:h-10 sm:w-10 md:h-12 md:w-12 lg:w-14 lg:h-14 xl:h-20 xl:w-20"
+    className: "h-6 w-6 object-contain sm:h-10 sm:w-10 md:h-12 md:w-12 lg:w-14 lg:h-14 xl:h-20 xl:w-20"
   }) : null, /*#__PURE__*/React__default.createElement("div", {
     className: "font-medium line-clamp-2 lg:line-clamp-1 text-2xl md:text-3xl lg:text-4xl xl:text-6xl",
     style: {
@@ -1259,7 +1260,7 @@ var Hero5 = function Hero5(props) {
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "absolute inset-0 flex flex-col top-[8%] md:top-[10%] gap-1 md:gap-4 p-4 lg:p-10 w-3/5 md:w-1/2 max-w-[90%] left-1 lg:left-10 xl:left-20"
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "text-xl sm:text-2xl md:text-3xl lg:text-4xl text-textHeading overflow-hidden text-ellipsis font-medium line-clamp-2 xl:line-clamp-1",
+    className: "text-xl sm:text-2xl md:text-3xl lg:text-4xl text-textHeading overflow-hidden text-ellipsis font-medium line-clamp-2",
     style: {
       lineHeight: 1.5
     }
@@ -1282,14 +1283,14 @@ var Hero6 = function Hero6(props) {
     alt: data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$ = _data$data2[0]) === null || _data$data2$ === void 0 ? void 0 : _data$data2$.title,
     className: "object-cover w-full min-h-[30vh] max-h-[100vh]"
   }), /*#__PURE__*/React__default.createElement("div", {
-    className: "absolute inset-0 flex flex-col items-center justify-center md:gap-1 lg:gap-2 text-center py-1 md:py-4 px-10 md:px-20 "
+    className: "absolute w-full  md:w-2/3 mx-auto inset-0 flex flex-col items-center justify-center md:gap-1 lg:gap-2 text-center py-1 md:py-4 px-10"
   }, data !== null && data !== void 0 && (_data$data3 = data.data) !== null && _data$data3 !== void 0 && (_data$data3$ = _data$data3[0]) !== null && _data$data3$ !== void 0 && _data$data3$.title ? /*#__PURE__*/React__default.createElement("div", {
     className: "text-primary font-headingFont text-center line-clamp-1 text-2xl md:text-4xl xl:text-6xl text-ellipsis",
     style: {
       lineHeight: "2"
     }
   }, data === null || data === void 0 ? void 0 : (_data$data4 = data.data) === null || _data$data4 === void 0 ? void 0 : (_data$data4$ = _data$data4[0]) === null || _data$data4$ === void 0 ? void 0 : _data$data4$.title) : null, /*#__PURE__*/React__default.createElement("div", {
-    className: "flex flex-col gap-2 md:gap-4 lg:gap-6 "
+    className: "flex flex-col gap-4 lg:gap-6 "
   }, data !== null && data !== void 0 && (_data$data5 = data.data) !== null && _data$data5 !== void 0 && (_data$data5$ = _data$data5[0]) !== null && _data$data5$ !== void 0 && _data$data5$.description ? /*#__PURE__*/React__default.createElement("div", {
     className: "line-clamp-2 lg:line-clamp-3 md:text-xl xl:text-2xl",
     style: {
@@ -7638,20 +7639,17 @@ var CategoryController = function CategoryController(props) {
 
 var Hero13 = function Hero13(props) {
   var _sectionData$, _sectionData$$srcImag, _data$data, _data$data$;
-  var listRef = useRef(null);
-  var _useState = useState(false);
   var shopConfig = props.shopConfig,
     data = props.data;
   var sectionData = data === null || data === void 0 ? void 0 : data.data;
-  var _CategoryController = CategoryController(props);
   return /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("img", {
     src: sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$ = sectionData[0]) === null || _sectionData$ === void 0 ? void 0 : (_sectionData$$srcImag = _sectionData$.srcImages) === null || _sectionData$$srcImag === void 0 ? void 0 : _sectionData$$srcImag[0],
     alt: data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : _data$data$.title,
     className: "w-full object-cover"
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "fixed right-6 bottom-10 md:bottom-24 z-50 flex flex-col gap-4 w-max"
-  }, /*#__PURE__*/React__default.createElement("a", {
-    href: shopConfig !== null && shopConfig !== void 0 && shopConfig.shopPhone ? "tel:" + (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopPhone) : "#"
+  }, (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopPhone) && /*#__PURE__*/React__default.createElement("a", {
+    href: "tel:" + (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopPhone)
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "relative w-max"
   }, /*#__PURE__*/React__default.createElement("span", {
@@ -7660,9 +7658,9 @@ var Hero13 = function Hero13(props) {
     className: "relative z-10 p-2 rounded-full bg-primary text-textButton animate-bounce"
   }, /*#__PURE__*/React__default.createElement(AiOutlinePhone, {
     size: 36
-  })))), /*#__PURE__*/React__default.createElement("a", {
+  })))), (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopMessenger) && /*#__PURE__*/React__default.createElement("a", {
     href: (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopMessenger) || "#",
-    target: shopConfig !== null && shopConfig !== void 0 && shopConfig.shopMessenger ? "_blank" : "_self"
+    target: "_blank"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "relative w-max"
   }, /*#__PURE__*/React__default.createElement("span", {
@@ -7671,9 +7669,9 @@ var Hero13 = function Hero13(props) {
     className: "relative z-10 p-2 rounded-full bg-primary text-textButton animate-bounce"
   }, /*#__PURE__*/React__default.createElement(FaFacebookMessenger, {
     size: 32
-  })))), /*#__PURE__*/React__default.createElement("a", {
-    href: (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopFacebookPage) || "#",
-    target: shopConfig !== null && shopConfig !== void 0 && shopConfig.shopFacebookPage ? "_blank" : "_self"
+  })))), (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopZalo) && /*#__PURE__*/React__default.createElement("a", {
+    href: "https://zalo.me/" + (shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopZalo) || "#",
+    target: "_blank"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "relative w-max"
   }, /*#__PURE__*/React__default.createElement("span", {
@@ -7723,7 +7721,9 @@ var Hero15 = function Hero15(props) {
   var _props$data = props.data,
     data = _props$data === void 0 ? {} : _props$data,
     _props$shopConfigStyl = props.shopConfigStyle,
-    shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl;
+    shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   return /*#__PURE__*/React__default.createElement("div", {
     className: SECTION_CLASS + " grid grid-cols-1 md:grid-cols-2 py-12 !bg-primary gap-6 md:gap-10"
   }, /*#__PURE__*/React__default.createElement("img", {
@@ -7738,7 +7738,8 @@ var Hero15 = function Hero15(props) {
   }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : (_data$data3$ = _data$data3[0]) === null || _data$data3$ === void 0 ? void 0 : _data$data3$.description), /*#__PURE__*/React__default.createElement("hr", {
     className: "w-1/3"
   }), (data === null || data === void 0 ? void 0 : (_data$data4 = data.data) === null || _data$data4 === void 0 ? void 0 : (_data$data4$ = _data$data4[0]) === null || _data$data4$ === void 0 ? void 0 : (_data$data4$$buttons = _data$data4$.buttons) === null || _data$data4$$buttons === void 0 ? void 0 : _data$data4$$buttons.length) > 0 ? /*#__PURE__*/React__default.createElement(LinkToPage, {
-    href: (data === null || data === void 0 ? void 0 : (_data$data5 = data.data) === null || _data$data5 === void 0 ? void 0 : (_data$data5$ = _data$data5[0]) === null || _data$data5$ === void 0 ? void 0 : (_data$data5$$buttons = _data$data5$.buttons) === null || _data$data5$$buttons === void 0 ? void 0 : (_data$data5$$buttons$ = _data$data5$$buttons[0]) === null || _data$data5$$buttons$ === void 0 ? void 0 : _data$data5$$buttons$.route) || (data === null || data === void 0 ? void 0 : (_data$data6 = data.data) === null || _data$data6 === void 0 ? void 0 : (_data$data6$ = _data$data6[0]) === null || _data$data6$ === void 0 ? void 0 : (_data$data6$$buttons = _data$data6$.buttons) === null || _data$data6$$buttons === void 0 ? void 0 : (_data$data6$$buttons$ = _data$data6$$buttons[0]) === null || _data$data6$$buttons$ === void 0 ? void 0 : _data$data6$$buttons$.link) || "#"
+    Link: Link,
+    href: convertURL(data === null || data === void 0 ? void 0 : (_data$data5 = data.data) === null || _data$data5 === void 0 ? void 0 : (_data$data5$ = _data$data5[0]) === null || _data$data5$ === void 0 ? void 0 : (_data$data5$$buttons = _data$data5$.buttons) === null || _data$data5$$buttons === void 0 ? void 0 : (_data$data5$$buttons$ = _data$data5$$buttons[0]) === null || _data$data5$$buttons$ === void 0 ? void 0 : _data$data5$$buttons$.route) || (data === null || data === void 0 ? void 0 : (_data$data6 = data.data) === null || _data$data6 === void 0 ? void 0 : (_data$data6$ = _data$data6[0]) === null || _data$data6$ === void 0 ? void 0 : (_data$data6$$buttons = _data$data6$.buttons) === null || _data$data6$$buttons === void 0 ? void 0 : (_data$data6$$buttons$ = _data$data6$$buttons[0]) === null || _data$data6$$buttons$ === void 0 ? void 0 : _data$data6$$buttons$.link) || "#"
   }, /*#__PURE__*/React__default.createElement(Button, {
     label: data === null || data === void 0 ? void 0 : (_data$data7 = data.data) === null || _data$data7 === void 0 ? void 0 : (_data$data7$ = _data$data7[0]) === null || _data$data7$ === void 0 ? void 0 : (_data$data7$$buttons = _data$data7$.buttons) === null || _data$data7$$buttons === void 0 ? void 0 : (_data$data7$$buttons$ = _data$data7$$buttons[0]) === null || _data$data7$$buttons$ === void 0 ? void 0 : _data$data7$$buttons$.label,
     shopConfigStyle: shopConfigStyle,
@@ -7750,7 +7751,7 @@ var Hero15 = function Hero15(props) {
 };
 
 var Hero16 = function Hero16(props) {
-  var _data$data, _data$data$, _data$data$$srcImages, _data$data2, _data$data2$, _data$data2$$srcImage;
+  var _data$data, _data$data$, _data$data$$srcImages, _data$data2, _data$data2$, _data$data3, _data$data3$, _data$data4, _data$data4$, _data$data4$$srcImage;
   var _props$data = props.data,
     data = _props$data === void 0 ? {} : _props$data,
     _props$shopConfigStyl = props.shopConfigStyle,
@@ -7771,19 +7772,19 @@ var Hero16 = function Hero16(props) {
     className: "min-h-[480px] w-full h-full relative"
   }, /*#__PURE__*/React__default.createElement("img", {
     src: data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : (_data$data$$srcImages = _data$data$.srcImages) === null || _data$data$$srcImages === void 0 ? void 0 : _data$data$$srcImages[0],
-    className: "object-cover max-w-full h-auto"
+    className: "object-cover w-full h-full min-h-[480px]"
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "absolute top-0 left-0 z-0 bg-secondary opacity-80 w-full h-full"
   }), /*#__PURE__*/React__default.createElement("div", {
-    className: "w-full md:w-2/3 absolute top-[10%] md:top-1/3 left-0 z-10 px-4 xl:px-20 flex flex-col gap-6 text-textButton my-auto"
+    className: "w-full sm:w-2/3 absolute z-20 top-[15%] md:top-1/3 left-0 z-10 px-4 xl:px-20 flex flex-col gap-6 text-textButton my-auto"
   }, /*#__PURE__*/React__default.createElement("h2", {
     className: "font-medium text-2xl lg:text-4xl"
-  }, "Thu\u1ED1c t\u1ED1t, gi\xE1 t\u1ED1t - V\xEC s\u1EE9c kh\u1ECFe c\u1EE7a b\u1EA1n"), /*#__PURE__*/React__default.createElement("div", {
+  }, data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$ = _data$data2[0]) === null || _data$data2$ === void 0 ? void 0 : _data$data2$.title), /*#__PURE__*/React__default.createElement("div", {
     className: " text-lg lg:text-2xl"
-  }, "Ch\xFAng t\xF4i lu\xF4n n\u1ED5 l\u1EF1c h\u1EBFt m\xECnh cung c\u1EA5p s\u1EA3n ph\u1EA9m v\xE0 d\u1ECBch v\u1EE5 \u0111\xFAng v\u1EDBi gi\xE1 tr\u1ECB m\xE0 kh\xE1ch h\xE0ng mong \u0111\u1EE3i."), /*#__PURE__*/React__default.createElement("div", {
-    className: "flex flex-col md:flex-row gap-4 w-full"
+  }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : (_data$data3$ = _data$data3[0]) === null || _data$data3$ === void 0 ? void 0 : _data$data3$.description), /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-col sm:flex-row gap-4 w-full"
   }, /*#__PURE__*/React__default.createElement(Input, {
-    wrapClassName: "w-full md:w-2/3 xl:w-[85%]",
+    wrapClassName: "w-2/3 sm:w-[80%] xl:w-[85%]",
     icons: /*#__PURE__*/React__default.createElement(LuSearch, {
       className: "text-gray3",
       size: 18
@@ -7816,32 +7817,37 @@ var Hero16 = function Hero16(props) {
     d: "M75.1847 149.804C55 189.553 14.9932 204.532 0 212H480V0C424.514 20.7319 393 94.1529 216.361 62.1956C120.186 44.7957 96.1405 108.537 75.1847 149.804Z",
     fill: "currentColor"
   }))), /*#__PURE__*/React__default.createElement("img", {
-    src: data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$ = _data$data2[0]) === null || _data$data2$ === void 0 ? void 0 : (_data$data2$$srcImage = _data$data2$.srcImages) === null || _data$data2$$srcImage === void 0 ? void 0 : _data$data2$$srcImage[1],
-    className: "object-cover w-[28%] h-auto absolute right-10 opacity-100 bottom-0 z-10"
+    src: data === null || data === void 0 ? void 0 : (_data$data4 = data.data) === null || _data$data4 === void 0 ? void 0 : (_data$data4$ = _data$data4[0]) === null || _data$data4$ === void 0 ? void 0 : (_data$data4$$srcImage = _data$data4$.srcImages) === null || _data$data4$$srcImage === void 0 ? void 0 : _data$data4$$srcImage[1],
+    className: "object-cover w-[25%] h-auto max-h-full absolute right-10 opacity-100 bottom-0 z-10"
   }));
 };
 
 var Features2 = function Features2(props) {
-  var data = props.data;
+  var data = props.data,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var sectionData = data === null || data === void 0 ? void 0 : data.data;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "" + SECTION_DEFAULT_CLASS
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "p-6 grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-6 lg:gap-8 rounded-xl bg-bgSecondary"
   }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
-    return /*#__PURE__*/React__default.createElement("div", {
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
+      href: convertURL(item === null || item === void 0 ? void 0 : item.route) || (item === null || item === void 0 ? void 0 : item.link) || "#"
+    }, /*#__PURE__*/React__default.createElement("div", {
       className: "flex flex-col gap-2 items-center text-sm lg:text-lg font-semibold text-center",
       key: "dfgg-" + index
     }, item !== null && item !== void 0 && item.svgImage ? /*#__PURE__*/React__default.createElement("div", {
-      className: "w-12 text-primary md:w-16 lg:w-20 xl:w-24 h-24",
+      className: "w-12 text-primary md:w-16 lg:w-20 xl:w-24 aspect-square",
       dangerouslySetInnerHTML: {
         __html: configSvg(item === null || item === void 0 ? void 0 : item.svgImage)
       }
     }) : /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
-      className: "w-12 md:w-16 lg:w-20 xl:w-24 text-primary",
+      className: "w-12 md:w-16 lg:w-20 object-contain xl:w-24 aspect-square text-primary",
       alt: "logo"
-    }), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.title));
+    }), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.title)));
   })));
 };
 
@@ -7933,11 +7939,6 @@ var ProductController = function ProductController(props) {
             var _res$data2, _res$data3;
             setProducts(res === null || res === void 0 ? void 0 : (_res$data2 = res.data) === null || _res$data2 === void 0 ? void 0 : _res$data2.data);
             setPage(res === null || res === void 0 ? void 0 : (_res$data3 = res.data) === null || _res$data3 === void 0 ? void 0 : _res$data3.page);
-            var url = new URL(window.location.href);
-            if (/^(\/(danh-muc))\/[^/]+-\d+$/.test(url.pathname)) {
-              url.pathname = url.pathname.replace(/\/[^/]+-\d+$/, "");
-              window.history.replaceState({}, '', url.pathname + url.search);
-            }
           }
           setLoading(false);
         });
@@ -8500,6 +8501,8 @@ var ModalNotification = function ModalNotification(props) {
     onCloseFormBooking = props.onCloseFormBooking,
     _props$isButtonClose = props.isButtonClose,
     isButtonClose = _props$isButtonClose === void 0 ? true : _props$isButtonClose,
+    _props$isMaskClose = props.isMaskClose,
+    isMaskClose = _props$isMaskClose === void 0 ? false : _props$isMaskClose,
     _props$className = props.className,
     className = _props$className === void 0 ? "" : _props$className,
     _props$style = props.style,
@@ -8514,6 +8517,9 @@ var ModalNotification = function ModalNotification(props) {
   }, []);
   var handleClickOutside = function handleClickOutside(event) {
     event.stopPropagation();
+    if (isMaskClose) {
+      return;
+    }
     if (onClose) {
       onClose === null || onClose === void 0 ? void 0 : onClose();
     }
@@ -9160,6 +9166,8 @@ var Select$2 = forwardRef(function (props, ref) {
     selectClassName = _props$selectClassNam === void 0 ? "" : _props$selectClassNam,
     _props$disabled = props.disabled,
     disabled = _props$disabled === void 0 ? false : _props$disabled,
+    _props$loading = props.loading,
+    loading = _props$loading === void 0 ? false : _props$loading,
     _props$rules = props.rules,
     rules = _props$rules === void 0 ? [] : _props$rules,
     options = props.options,
@@ -9203,6 +9211,7 @@ var Select$2 = forwardRef(function (props, ref) {
     nextTrigger = _useState7[0],
     setNextTrigger = _useState7[1];
   var optionRef = useRef(null);
+  var triggeredRef = useRef(false);
   useEffect(function () {
     if (isMulti) setValue(defaultValue);
   }, [defaultValue]);
@@ -9211,34 +9220,33 @@ var Select$2 = forwardRef(function (props, ref) {
     if (!isMulti) setValue(defaultValue);
   }, [options]);
   useEffect(function () {
+    var _optionRef$current;
     if (typeof setParams !== 'function') return;
-    var handleScroll = function handleScroll() {
-      if (!optionRef.current) return;
-      var children = optionRef.current.querySelectorAll('div.option');
-      var parentRect = optionRef.current.getBoundingClientRect();
-      children.forEach(function (child, index) {
-        var rect = child.getBoundingClientRect();
-        if (rect.top >= parentRect.top && rect.bottom <= parentRect.bottom) {
-          if (index === nextTrigger) {
-            setParams === null || setParams === void 0 ? void 0 : setParams(function (prev) {
-              return _extends({}, prev, {
-                size: (prev === null || prev === void 0 ? void 0 : prev.size) + 8
-              });
-            });
-            setNextTrigger(function (prev) {
-              return prev + 8;
-            });
-          }
-        }
-      });
-    };
-    if (optionRef.current) {
-      optionRef.current.addEventListener('scroll', handleScroll);
-    }
-    return function () {
-      if (optionRef.current) {
-        optionRef.current.removeEventListener('scroll', handleScroll);
+    triggeredRef.current = false;
+    var options = (_optionRef$current = optionRef.current) === null || _optionRef$current === void 0 ? void 0 : _optionRef$current.querySelectorAll('div.option');
+    if (!options || options.length === 0) return;
+    var targetElement = options[nextTrigger];
+    if (!targetElement) return;
+    var observer = new IntersectionObserver(function (_ref) {
+      var entry = _ref[0];
+      if (entry.isIntersecting && !triggeredRef.current) {
+        triggeredRef.current = true;
+        setParams(function (prev) {
+          return _extends({}, prev, {
+            size: prev.size + 8
+          });
+        });
+        setNextTrigger(function (prev) {
+          return prev + 8;
+        });
       }
+    }, {
+      root: optionRef.current,
+      threshold: 1.0
+    });
+    observer.observe(targetElement);
+    return function () {
+      observer.disconnect();
     };
   }, [listOptions, nextTrigger]);
   useEffect(function () {
@@ -9430,7 +9438,7 @@ var Select$2 = forwardRef(function (props, ref) {
   })) : null, /*#__PURE__*/React__default.createElement("div", {
     className: "overflow-y-auto max-h-72 scroll-container",
     ref: optionRef
-  }, (listOptions === null || listOptions === void 0 ? void 0 : listOptions.length) > 0 ? listOptions === null || listOptions === void 0 ? void 0 : listOptions.map(function (item, index) {
+  }, (listOptions === null || listOptions === void 0 ? void 0 : listOptions.length) > 0 ? /*#__PURE__*/React__default.createElement("div", null, listOptions === null || listOptions === void 0 ? void 0 : listOptions.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement("div", {
       key: "gjfd-" + index,
       className: "option px-2 cursor-default py-1.5 flex items-center hover:bg-gray-100 rounded-lg",
@@ -9442,7 +9450,9 @@ var Select$2 = forwardRef(function (props, ref) {
     }), renderItem ? renderItem(item) : /*#__PURE__*/React__default.createElement("div", {
       className: " whitespace-nowrap line-clamp-1"
     }, item === null || item === void 0 ? void 0 : item.label));
-  }) : /*#__PURE__*/React__default.createElement("div", {
+  }), loading ? /*#__PURE__*/React__default.createElement("div", {
+    className: "flex justify-center py-4"
+  }, /*#__PURE__*/React__default.createElement(Loading, null)) : null) : /*#__PURE__*/React__default.createElement("div", {
     className: "py-6 text-center"
   }, "Kh\xF4ng c\xF3 k\u1EBFt qu\u1EA3")))) : null), error ? /*#__PURE__*/React__default.createElement("div", {
     className: "text-danger"
@@ -9496,7 +9506,8 @@ var BookingForm = function BookingForm(props) {
   var _ProductController = ProductController(_extends({}, props, {
       params: productsParams
     })),
-    products = _ProductController.products;
+    products = _ProductController.products,
+    loading = _ProductController.loading;
   var _BookingController = BookingController(props),
     _BookingController$cr = _BookingController.createSchedule,
     createSchedule = _BookingController$cr === void 0 ? function () {} : _BookingController$cr;
@@ -9681,6 +9692,7 @@ var BookingForm = function BookingForm(props) {
     setParams: setProductsParams,
     ref: inputSelectedRef,
     isMulti: true,
+    loading: loading,
     defaultValue: listProductSelected,
     onClick: handleSelectedProduct,
     handleSearchOption: handleSearchProducts,
@@ -10057,13 +10069,13 @@ var ServiceDetail1 = function ServiceDetail1(props) {
     product: product,
     className: "w-full aspect-square !object-contain rounded-2xl"
   })), /*#__PURE__*/React__default.createElement("div", {
-    className: "flex gap-1 w-[80vw] overflow-x-auto md:w-full md:gap-2 md:flex-wrap"
+    className: "flex gap-2 pb-3 md:pb-0 overflow-x-auto md:w-full lg:gap-3 md:grid md:grid-cols-4 xl:grid-cols-5"
   }, product === null || product === void 0 ? void 0 : (_product$images = product.images) === null || _product$images === void 0 ? void 0 : _product$images.map(function (item) {
     return /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.imageUrl,
       key: item === null || item === void 0 ? void 0 : item.imageId,
       alt: "",
-      className: (displayImage ? "" : "first:border first:opacity-100 first:brightness-100") + " h-16 w-16 object-cover rounded-lg \n                                                " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border" : "opacity-50 brightness-75 bg-background"),
+      className: (displayImage ? "" : "first:border first:opacity-100 first:brightness-100") + " \n                                                h-20 w-20 md:max-h-32 md:max-w-32 md:h-full md:w-full rounded-md lg:rounded-lg aspect-square object-contain\n                                                " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border" : "opacity-50 brightness-75 bg-background"),
       onClick: function onClick() {
         handleDisplayImage(item);
       }
@@ -10184,7 +10196,7 @@ var TreatmentDetail1 = function TreatmentDetail1(props) {
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "flex flex-col gap-4 col-span-2"
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "rounded-2xl p-2 bg-background border"
+    className: "rounded-2xl bg-background border"
   }, displayImage ? /*#__PURE__*/React__default.createElement("img", {
     src: displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageUrl,
     className: "w-full aspect-square object-contain rounded-2xl"
@@ -10192,13 +10204,13 @@ var TreatmentDetail1 = function TreatmentDetail1(props) {
     product: product,
     className: "w-full aspect-square !object-contain rounded-2xl"
   })), /*#__PURE__*/React__default.createElement("div", {
-    className: "flex gap-1 w-[80vw] overflow-x-auto md:w-full md:gap-2 md:flex-wrap"
+    className: "flex gap-2 pb-3 md:pb-0 overflow-x-auto md:w-full lg:gap-3 md:grid md:grid-cols-4 xl:grid-cols-5"
   }, product === null || product === void 0 ? void 0 : (_product$images = product.images) === null || _product$images === void 0 ? void 0 : _product$images.map(function (item) {
     return /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.imageUrl,
       key: item === null || item === void 0 ? void 0 : item.imageId,
       alt: "",
-      className: (displayImage ? "" : "first:border first:opacity-100 first:brightness-100") + " h-16 w-16 object-cover rounded-lg \n                                                " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border" : "opacity-50 brightness-75 bg-background"),
+      className: (displayImage ? "" : "first:border first:opacity-100 first:brightness-100") + " \n                                                h-20 w-20 md:max-h-32 md:max-w-32 md:h-full md:w-full rounded-md lg:rounded-lg aspect-square object-contain\n                                                " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border" : "opacity-50 brightness-75 bg-background"),
       onClick: function onClick() {
         handleDisplayImage(item);
       }
@@ -10320,7 +10332,7 @@ var ProductItem3 = function ProductItem3(props) {
     className: "w-full border border-stroke rounded-2xl " + className
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "w-full h-48 md:h-60 xl:h-[304px] rounded-t-2xl"
+    className: "w-full rounded-t-2xl"
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "p-4 flex flex-col gap-2 md:gap-4 items-start"
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -10347,7 +10359,7 @@ var ProductItem4 = function ProductItem4(props) {
     className: "w-full border border-stroke flex flex-col gap-2 md:gap-4 rounded-2xl p-2 md:p-4 xl:p-6 " + className
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "w-full h-40 sm:h-56 lg:h-60 xl:h-64 bg-cover bg-no-repeat rounded-2xl"
+    className: "w-full rounded-2xl"
   }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "text-start line-clamp-1  w-full overflow-hidden text-ellipsis text-lg"
   }, product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
@@ -10382,7 +10394,7 @@ var ProductItem5 = function ProductItem5(props) {
     className: "w-full flex flex-col gap-4 rounded-2xl p-1 " + className
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "w-full w-full h-44 md:h-56 lg:h-64 xl:h-72 bg-cover bg-no-repeat rounded-2xl"
+    className: "w-full rounded-2xl"
   }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "text-start line-clamp-1  w-full overflow-hidden text-ellipsis mb-2"
   }, product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
@@ -10415,7 +10427,7 @@ var ProductItem6 = function ProductItem6(props) {
     className: "w-full border border-stroke flex flex-col gap-2 md:gap-4 rounded-2xl p-2 md:p-4 xl:p-6 " + className
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "w-full h-48 md:h-60 xl:h-72 rounded-2xl"
+    className: "w-full !aspect-[3/4] rounded-2xl"
   }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "text start line-clamp-1  w-full overflow-hidden text-ellipsis"
   }, product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
@@ -10450,7 +10462,7 @@ var ProductItem7 = function ProductItem7(props) {
     className: "px-2 md:px-4 xl:px-6"
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "w-full hover:scale-105 transition duration-300 ease-in-out rounded-2xl"
+    className: "w-full hover:scale-105 transition duration-300 ease-in-out rounded-2xl !object-contain"
   })), (product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.price) !== (product === null || product === void 0 ? void 0 : (_product$productInfo2 = product.productInfo) === null || _product$productInfo2 === void 0 ? void 0 : _product$productInfo2.priceBeforeDiscount) && product !== null && product !== void 0 && (_product$productInfo3 = product.productInfo) !== null && _product$productInfo3 !== void 0 && _product$productInfo3.priceBeforeDiscount ? /*#__PURE__*/React__default.createElement("div", {
     className: "absolute top-4 left-0 py-1 px-4 rounded-r-2xl bg-danger text-textButton font-semibold shadow-lg"
   }, "-", Math.round(100 - (product === null || product === void 0 ? void 0 : (_product$productInfo4 = product.productInfo) === null || _product$productInfo4 === void 0 ? void 0 : _product$productInfo4.price) / (product === null || product === void 0 ? void 0 : (_product$productInfo5 = product.productInfo) === null || _product$productInfo5 === void 0 ? void 0 : _product$productInfo5.priceBeforeDiscount) * 100)) : null), /*#__PURE__*/React__default.createElement("div", {
@@ -10483,7 +10495,7 @@ var ProductItem8 = function ProductItem8(props) {
     className: "relative "
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "h-[340px] md:h-[400px] xl:h-[460px] rounded"
+    className: "!aspect-[5/8] rounded"
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "absolute bottom-0 rounded-b pb-6 px-4 bg-gradient-to-t from-black/50 to-transparent flex flex-col items-center h-1/2 gap-2 w-full justify-end "
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -10516,7 +10528,7 @@ var ProductItem9 = function ProductItem9(props) {
     className: "w-full flex flex-col gap-4 rounded-2xl p-2 md:p-6 bg-bgSecondary " + className
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "hover:scale-105 transition duration-300 ease-in-out w-full h-44 md:h-56 xl:h-60"
+    className: "hover:scale-105 transition duration-300 ease-in-out !object-contain !aspect-[9/8]"
   }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "text-start line-clamp-2 font-medium  min-h-12 w-full overflow-hidden text-ellipsis mb-2"
   }, product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
@@ -10648,7 +10660,7 @@ var ProductItem11 = function ProductItem11(props) {
     className: "overflow-hidden"
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "hover:scale-105 transition duration-300 ease-in-out w-full h-56 sm:h-64 lg:h-72 xl:h-[302px]"
+    className: "hover:scale-105 transition duration-300 ease-in-out"
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "p-4 flex flex-col gap-4"
   }, /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
@@ -10669,7 +10681,7 @@ var ProductItem11 = function ProductItem11(props) {
 };
 
 var TreatmentItem1 = function TreatmentItem1(props) {
-  var _product$productInfo;
+  var _product$productInfo, _product$productInfo2;
   var product = props.product,
     _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link,
@@ -10682,7 +10694,7 @@ var TreatmentItem1 = function TreatmentItem1(props) {
     className: "w-full flex flex-col gap-4 rounded-2xl p-1"
   }, /*#__PURE__*/React__default.createElement(ProductImage, {
     product: product === null || product === void 0 ? void 0 : product.productInfo,
-    className: "w-full w-full h-[189px] md:h-[238px] xl:h-[304px] rounded-2xl"
+    className: " rounded-2xl"
   }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "line-clamp-1 mb-2 font-medium text-lg"
   }, product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
@@ -10692,7 +10704,7 @@ var TreatmentItem1 = function TreatmentItem1(props) {
     className: "flex flex-col md:flex-row gap-2 md:items-center md:gap-6 "
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "whitespace-nowrap"
-  }, "Th\u1EDDi gian: 120p"), /*#__PURE__*/React__default.createElement(Button, {
+  }, "Th\u1EDDi gian: ", getDurationValue(product === null || product === void 0 ? void 0 : (_product$productInfo2 = product.productInfo) === null || _product$productInfo2 === void 0 ? void 0 : _product$productInfo2.attributes)), /*#__PURE__*/React__default.createElement(Button, {
     shopConfigStyle: shopConfigStyle,
     label: "\u0110\u1EB7t l\u1ECBch",
     className: "w-full"
@@ -10771,7 +10783,14 @@ var Products2 = function Products2(props) {
   var _useState2 = useState(false),
     canGoNext = _useState2[0],
     setCanGoNext = _useState2[1];
-  var _ProductController = ProductController(props),
+  var _useState3 = useState({
+      size: 16,
+      isSale: true
+    }),
+    params = _useState3[0];
+  var _ProductController = ProductController(_extends({}, props, {
+      params: params
+    })),
     _ProductController$pr = _ProductController.products,
     products = _ProductController$pr === void 0 ? [] : _ProductController$pr,
     _ProductController$lo = _ProductController.loading,
@@ -11377,7 +11396,7 @@ var Products11 = function Products11(props) {
     _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link,
     _props$categoryId = props.categoryId,
-    categoryId = _props$categoryId === void 0 ? 0 : _props$categoryId,
+    categoryId = _props$categoryId === void 0 ? "" : _props$categoryId,
     _props$ProductItem = props.ProductItem,
     ProductItem = _props$ProductItem === void 0 ? null : _props$ProductItem;
   var _useState = useState({
@@ -11420,13 +11439,18 @@ var Products11 = function Products11(props) {
     });
   };
   var handleChooseCategory = function handleChooseCategory(category) {
+    if (categoryId) {
+      var newUrl = getLinkProductsByCategory(category);
+      window.history.replaceState(null, '', newUrl);
+    }
     setCategorySelected(category);
     setFilterItem(listFilter === null || listFilter === void 0 ? void 0 : listFilter[0]);
     setParams(function (prev) {
-      return _extends({}, prev, {
+      return {
+        page: 0,
         categoryId: category === null || category === void 0 ? void 0 : category.categoryId,
         size: 12
-      });
+      };
     });
     window.scrollTo({
       top: 0,
@@ -11449,48 +11473,38 @@ var Products11 = function Products11(props) {
         return (a === null || a === void 0 ? void 0 : (_a$productInfo = a.productInfo) === null || _a$productInfo === void 0 ? void 0 : _a$productInfo.price) - (b === null || b === void 0 ? void 0 : (_b$productInfo = b.productInfo) === null || _b$productInfo === void 0 ? void 0 : _b$productInfo.price);
       });
       setProductsFilter(productsCopy);
-    } else if ((filterItem === null || filterItem === void 0 ? void 0 : filterItem.value) === "discount") {
-      var _productsCopy2;
-      var _productsCopy = [].concat(products);
-      _productsCopy = (_productsCopy2 = _productsCopy) === null || _productsCopy2 === void 0 ? void 0 : _productsCopy2.filter(function (product) {
-        var _product$productInfo, _product$productInfo2, _product$productInfo3;
-        return (product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.priceBeforeDiscount) && (product === null || product === void 0 ? void 0 : (_product$productInfo2 = product.productInfo) === null || _product$productInfo2 === void 0 ? void 0 : _product$productInfo2.priceBeforeDiscount) !== (product === null || product === void 0 ? void 0 : (_product$productInfo3 = product.productInfo) === null || _product$productInfo3 === void 0 ? void 0 : _product$productInfo3.price);
-      });
-      setProductsFilter(_productsCopy);
     } else {
       setProductsFilter(products);
     }
   }, [products, categorySelected]);
   var handleFilter = function handleFilter(item) {
     setFilterItem(item);
-    if ((item === null || item === void 0 ? void 0 : item.value) === "sortPriceDESC" && !(params !== null && params !== void 0 && params.isHighlight)) {
+    if ((item === null || item === void 0 ? void 0 : item.value) === "sortPriceDESC" && !(params !== null && params !== void 0 && params.isHighlight) && !(params !== null && params !== void 0 && params.isSale)) {
       var productsCopy = [].concat(products);
       productsCopy === null || productsCopy === void 0 ? void 0 : productsCopy.sort(function (a, b) {
         var _a$productInfo2, _b$productInfo2;
         return (a === null || a === void 0 ? void 0 : (_a$productInfo2 = a.productInfo) === null || _a$productInfo2 === void 0 ? void 0 : _a$productInfo2.price) - (b === null || b === void 0 ? void 0 : (_b$productInfo2 = b.productInfo) === null || _b$productInfo2 === void 0 ? void 0 : _b$productInfo2.price);
       });
       setProductsFilter(productsCopy);
-    } else if ((item === null || item === void 0 ? void 0 : item.value) === "discount" && !(params !== null && params !== void 0 && params.isHighlight)) {
-      var _productsCopy4;
-      var _productsCopy3 = [].concat(products);
-      _productsCopy3 = (_productsCopy4 = _productsCopy3) === null || _productsCopy4 === void 0 ? void 0 : _productsCopy4.filter(function (product) {
-        var _product$productInfo4, _product$productInfo5, _product$productInfo6;
-        return (product === null || product === void 0 ? void 0 : (_product$productInfo4 = product.productInfo) === null || _product$productInfo4 === void 0 ? void 0 : _product$productInfo4.priceBeforeDiscount) && (product === null || product === void 0 ? void 0 : (_product$productInfo5 = product.productInfo) === null || _product$productInfo5 === void 0 ? void 0 : _product$productInfo5.priceBeforeDiscount) !== (product === null || product === void 0 ? void 0 : (_product$productInfo6 = product.productInfo) === null || _product$productInfo6 === void 0 ? void 0 : _product$productInfo6.price);
+    } else if ((item === null || item === void 0 ? void 0 : item.value) === "discount") {
+      setParams({
+        page: 0,
+        categoryId: categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.categoryId,
+        size: 12,
+        isSale: true
       });
-      setProductsFilter(_productsCopy3);
     } else if ((item === null || item === void 0 ? void 0 : item.value) === "isHighlight") {
-      setParams(function (prev) {
-        return _extends({}, prev, {
-          isHighlight: true
-        });
+      setParams({
+        page: 0,
+        categoryId: categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.categoryId,
+        size: 12,
+        isHighlight: true
       });
     } else {
-      setParams(function (prev) {
-        return {
-          page: 0,
-          categoryId: categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.categoryId,
-          size: 12
-        };
+      setParams({
+        page: 0,
+        categoryId: categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.categoryId,
+        size: 12
       });
     }
   };
@@ -11499,7 +11513,7 @@ var Products11 = function Products11(props) {
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "md:sticky top-16 self-start"
   }, (categories === null || categories === void 0 ? void 0 : categories.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
-    className: " flex flex-col gap-2 rounded-2xl bg-bgSecondary p-4 max-h-96 overflow-y-auto"
+    className: " flex flex-col gap-2 rounded-2xl bg-bgSecondary p-4 max-h-96 scroll-container overflow-y-auto"
   }, categories === null || categories === void 0 ? void 0 : categories.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement("div", {
       className: "px-6 py-2 hover:bg-gray-100 hover:text-primary cursor-pointer rounded-lg " + ((categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.categoryId) === (item === null || item === void 0 ? void 0 : item.categoryId) ? " bg-primary text-textButton" : ""),
@@ -11788,7 +11802,7 @@ var listFilter$1 = [{
   }
 }];
 var ProductSearch1 = function ProductSearch1(props) {
-  var _window, _window$location, _productsFilter$slice;
+  var _window, _window$location, _products$slice;
   var _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link,
     _props$SectionTitle = props.SectionTitle,
@@ -11798,21 +11812,18 @@ var ProductSearch1 = function ProductSearch1(props) {
     shopConfigStyle = props.shopConfigStyle;
   var queryParams = new URLSearchParams((_window = window) === null || _window === void 0 ? void 0 : (_window$location = _window.location) === null || _window$location === void 0 ? void 0 : _window$location.search);
   var keywordValue = queryParams === null || queryParams === void 0 ? void 0 : queryParams.get('tu-khoa');
-  var _useState = useState([]),
-    productsFilter = _useState[0],
-    setProductsFilter = _useState[1];
-  var _useState2 = useState({
+  var _useState = useState({
       productName: keywordValue,
       size: 12
     }),
-    params = _useState2[0],
-    setParams = _useState2[1];
-  var _useState3 = useState(true),
-    isGetMore = _useState3[0],
-    setIsGetMore = _useState3[1];
-  var _useState4 = useState(false),
-    isAutoGetList = _useState4[0],
-    setIsAutoGetList = _useState4[1];
+    params = _useState[0],
+    setParams = _useState[1];
+  var _useState2 = useState(true),
+    isGetMore = _useState2[0],
+    setIsGetMore = _useState2[1];
+  var _useState3 = useState(false),
+    isAutoGetList = _useState3[0],
+    setIsAutoGetList = _useState3[1];
   var _ProductController = ProductController(_extends({}, props, {
       params: params,
       isAutoGetList: isAutoGetList
@@ -11820,9 +11831,6 @@ var ProductSearch1 = function ProductSearch1(props) {
     products = _ProductController.products,
     loading = _ProductController.loading,
     page = _ProductController.page;
-  var _useState5 = useState({}),
-    filterValue = _useState5[0],
-    setFilterValue = _useState5[1];
   useEffect(function () {
     setIsAutoGetList(true);
     setParams(function (prev) {
@@ -11831,19 +11839,6 @@ var ProductSearch1 = function ProductSearch1(props) {
       });
     });
   }, [keywordValue]);
-  useEffect(function () {
-    if ((filterValue === null || filterValue === void 0 ? void 0 : filterValue.value) === "discount") {
-      var _productsCopy;
-      var productsCopy = [].concat(products);
-      productsCopy = (_productsCopy = productsCopy) === null || _productsCopy === void 0 ? void 0 : _productsCopy.filter(function (product) {
-        var _product$productInfo, _product$productInfo2, _product$productInfo3;
-        return (product === null || product === void 0 ? void 0 : (_product$productInfo = product.productInfo) === null || _product$productInfo === void 0 ? void 0 : _product$productInfo.priceBeforeDiscount) && (product === null || product === void 0 ? void 0 : (_product$productInfo2 = product.productInfo) === null || _product$productInfo2 === void 0 ? void 0 : _product$productInfo2.priceBeforeDiscount) !== (product === null || product === void 0 ? void 0 : (_product$productInfo3 = product.productInfo) === null || _product$productInfo3 === void 0 ? void 0 : _product$productInfo3.price);
-      });
-      setProductsFilter(productsCopy);
-    } else {
-      setProductsFilter(products);
-    }
-  }, [products]);
   var handleGetMoreProducts = function handleGetMoreProducts() {
     setIsGetMore(false);
     setParams(function (prev) {
@@ -11853,20 +11848,17 @@ var ProductSearch1 = function ProductSearch1(props) {
     });
   };
   var handleFilter = function handleFilter(item) {
-    setFilterValue(item);
-    if ((item === null || item === void 0 ? void 0 : item.value) === "discount" && !(params !== null && params !== void 0 && params.isHighlight)) {
-      var _productsCopy2;
-      var productsCopy = [].concat(products);
-      productsCopy = (_productsCopy2 = productsCopy) === null || _productsCopy2 === void 0 ? void 0 : _productsCopy2.filter(function (product) {
-        var _product$productInfo4, _product$productInfo5, _product$productInfo6;
-        return (product === null || product === void 0 ? void 0 : (_product$productInfo4 = product.productInfo) === null || _product$productInfo4 === void 0 ? void 0 : _product$productInfo4.priceBeforeDiscount) && (product === null || product === void 0 ? void 0 : (_product$productInfo5 = product.productInfo) === null || _product$productInfo5 === void 0 ? void 0 : _product$productInfo5.priceBeforeDiscount) !== (product === null || product === void 0 ? void 0 : (_product$productInfo6 = product.productInfo) === null || _product$productInfo6 === void 0 ? void 0 : _product$productInfo6.price);
+    if ((item === null || item === void 0 ? void 0 : item.value) === "discount") {
+      setParams({
+        size: 12,
+        productName: keywordValue,
+        isSale: true
       });
-      setProductsFilter(productsCopy);
     } else if ((item === null || item === void 0 ? void 0 : item.value) === "isHighlight") {
-      setParams(function (prev) {
-        return _extends({}, prev, {
-          isHighlight: true
-        });
+      setParams({
+        size: 12,
+        productName: keywordValue,
+        isHighlight: true
       });
     } else {
       setParams({
@@ -11890,15 +11882,15 @@ var ProductSearch1 = function ProductSearch1(props) {
     onClick: handleFilter
   }), loading && isGetMore ? /*#__PURE__*/React__default.createElement("div", {
     className: "m-auto mt-20 min-h-32"
-  }, /*#__PURE__*/React__default.createElement(Loading, null)) : (productsFilter === null || productsFilter === void 0 ? void 0 : productsFilter.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement(Loading, null)) : (products === null || products === void 0 ? void 0 : products.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
     className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 gap-x-2 gap-y-4 md:gap-4 xl:gap-6"
-  }, productsFilter === null || productsFilter === void 0 ? void 0 : (_productsFilter$slice = productsFilter.slice(0, (params === null || params === void 0 ? void 0 : params.size) - 4)) === null || _productsFilter$slice === void 0 ? void 0 : _productsFilter$slice.map(function (product, idx) {
+  }, products === null || products === void 0 ? void 0 : (_products$slice = products.slice(0, (params === null || params === void 0 ? void 0 : params.size) - 4)) === null || _products$slice === void 0 ? void 0 : _products$slice.map(function (product, idx) {
     return /*#__PURE__*/React__default.createElement(ProductItem, {
       Link: Link,
       product: product,
       key: "htrhr-" + idx
     });
-  })) : /*#__PURE__*/React__default.createElement(NotFoundProduct, null), !loading && (productsFilter === null || productsFilter === void 0 ? void 0 : productsFilter.length) > (params === null || params === void 0 ? void 0 : params.size) - 4 ? /*#__PURE__*/React__default.createElement(Button, {
+  })) : /*#__PURE__*/React__default.createElement(NotFoundProduct, null), !loading && (products === null || products === void 0 ? void 0 : products.length) > (params === null || params === void 0 ? void 0 : params.size) - 4 ? /*#__PURE__*/React__default.createElement(Button, {
     label: "Xem thêm",
     onClick: handleGetMoreProducts,
     className: "mx-auto " + (shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass),
@@ -12278,12 +12270,12 @@ var ProductDetail10 = function ProductDetail10(props) {
   return /*#__PURE__*/React__default.createElement("div", {
     className: SECTION_CLASS + " mt-0 md:mt-0 mb-0 " + ((shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.landingTemplateCode) === 'fashion_1' ? "bg-bgSecondary pb-8" : "bg-background")
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: ((shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.landingTemplateCode) === 'fashion_1' ? "" : "px-4 md:px-6") + " py-4 md:py-6 rounded-2xl grid grid-cols-1 md:grid-cols-5 md:gap-6 bg-bgSecondary"
+    className: ((shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.landingTemplateCode) === 'fashion_1' ? "" : "px-4 md:px-6") + " py-4 md:py-6 rounded-2xl grid grid-cols-1 md:grid-cols-5 gap-3 md:gap-6 bg-bgSecondary"
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "flex flex-col gap-4 col-span-2 "
+    className: "flex flex-col gap-4 md:col-span-2 "
   }, displayImage ? /*#__PURE__*/React__default.createElement("img", {
     src: displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageUrl,
-    className: "w-full border rounded-2xl p-2 bg-background aspect-square object-contain rounded-2xl "
+    className: "w-full border bg-background aspect-square object-contain rounded-2xl "
   }) : /*#__PURE__*/React__default.createElement("div", {
     className: "flex justify-center items-center w-full border rounded-2xl aspect-square",
     style: {
@@ -12294,19 +12286,19 @@ var ProductDetail10 = function ProductDetail10(props) {
     height: "25%",
     fill: "#D9D9D9"
   })), /*#__PURE__*/React__default.createElement("div", {
-    className: "flex gap-1 w-[80vw] overflow-x-auto md:w-full md:gap-2 md:flex-wrap"
+    className: "flex gap-2 pb-3 md:pb-0 overflow-x-auto md:w-full lg:gap-3 md:grid md:grid-cols-4 xl:grid-cols-5"
   }, product === null || product === void 0 ? void 0 : (_product$images2 = product.images) === null || _product$images2 === void 0 ? void 0 : _product$images2.map(function (item) {
     return /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.imageUrl,
       key: item === null || item === void 0 ? void 0 : item.imageId,
       alt: "",
-      className: "cursor-pointer h-16 w-16 rounded-lg bg-background\n                                                " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border" : "opacity-50 brightness-75 "),
+      className: "cursor-pointer h-20 w-20 md:max-h-32 md:max-w-32 md:h-full md:w-full aspect-square rounded-md lg:rounded-lg bg-background object-contain\n                                                " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border" : "opacity-50 brightness-75 "),
       onClick: function onClick() {
         handleDisplayImage(item);
       }
     });
   }))), /*#__PURE__*/React__default.createElement("div", {
-    className: "col-span-3"
+    className: "md:col-span-3 "
   }, /*#__PURE__*/React__default.createElement("p", {
     className: "font-semibold text-2xl"
   }, product === null || product === void 0 ? void 0 : product.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
@@ -12320,7 +12312,7 @@ var ProductDetail10 = function ProductDetail10(props) {
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "min-w-24"
     }, option === null || option === void 0 ? void 0 : option.name, ":"), /*#__PURE__*/React__default.createElement("div", {
-      className: "flex gap-2"
+      className: "flex flex-wrap gap-2"
     }, ((option === null || option === void 0 ? void 0 : option.value) || []).map(function (v, i) {
       return /*#__PURE__*/React__default.createElement("button", {
         key: i,
@@ -12372,7 +12364,7 @@ var ProductDetail10 = function ProductDetail10(props) {
       __html: product === null || product === void 0 ? void 0 : product.description
     }
   }), !isSeeMore && !hiddenButton ? /*#__PURE__*/React__default.createElement("div", {
-    className: "h-10 relative -mt-10 rounded-b-lg",
+    className: "h-28 relative -mt-28 rounded-b-lg",
     style: {
       background: "linear-gradient(to top, #81818169  0%, #00000003 50%)"
     }
@@ -12517,7 +12509,7 @@ var ProductDetail11 = function ProductDetail11(props) {
       src: item === null || item === void 0 ? void 0 : item.imageUrl,
       key: item === null || item === void 0 ? void 0 : item.imageId,
       alt: "",
-      className: "cursor-pointer px-3 py-2 !h-24 !w-24 object-cover rounded-lg \n                                            " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border border-primary" : ""),
+      className: "cursor-pointer px-3 py-2 !h-24 !w-24 object-contain aspect-square rounded-lg \n                                            " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border border-primary" : ""),
       onClick: function onClick() {
         handleDisplayImage(item);
       }
@@ -12549,7 +12541,7 @@ var ProductDetail11 = function ProductDetail11(props) {
       src: item === null || item === void 0 ? void 0 : item.imageUrl,
       key: item === null || item === void 0 ? void 0 : item.imageId,
       alt: "",
-      className: "cursor-pointer px-2 py-1 !h-24 !w-24 object-cover rounded-lg \n                                            " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border border-primary" : ""),
+      className: "cursor-pointer px-2 py-1 !h-24 !w-24 object-contain rounded-lg aspect-square\n                                            " + ((displayImage === null || displayImage === void 0 ? void 0 : displayImage.imageId) === (item === null || item === void 0 ? void 0 : item.imageId) ? "border border-primary" : ""),
       onClick: function onClick() {
         handleDisplayImage(item);
       }
@@ -12569,7 +12561,7 @@ var ProductDetail11 = function ProductDetail11(props) {
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "min-w-24 my-auto"
     }, option === null || option === void 0 ? void 0 : option.name, ":"), /*#__PURE__*/React__default.createElement("div", {
-      className: "flex gap-2"
+      className: "flex flex-wrap gap-2"
     }, ((option === null || option === void 0 ? void 0 : option.value) || []).map(function (v, i) {
       return /*#__PURE__*/React__default.createElement("button", {
         key: i,
@@ -13031,7 +13023,9 @@ var Banner1 = function Banner1(props) {
   var data = props.data,
     shopConfigStyle = props.shopConfigStyle,
     _props$SectionTitle = props.SectionTitle,
-    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle;
+    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle,
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var sectionData = data === null || data === void 0 ? void 0 : data.data;
   return /*#__PURE__*/React__default.createElement("div", {
     className: "" + SECTION_DEFAULT_CLASS
@@ -13041,12 +13035,15 @@ var Banner1 = function Banner1(props) {
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "grid grid-cols-1 sm:grid-cols-3 gap-4 lg:gap-6 mt-6"
   }, sectionData && sectionData.length > 0 && sectionData.map(function (item, index) {
-    return /*#__PURE__*/React__default.createElement("img", {
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
+      href: convertURL(item === null || item === void 0 ? void 0 : item.route) || (item === null || item === void 0 ? void 0 : item.link) || "#"
+    }, /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
       alt: "",
       className: "rounded-2xl",
       key: "hnfhn-" + index
-    });
+    }));
   })));
 };
 
@@ -13136,25 +13133,30 @@ var Banner3 = function Banner3(props) {
 };
 
 var Banner4 = function Banner4(props) {
-  var _data$data, _data$data$, _data$data2, _data$data2$slice;
+  var _data$data, _data$data$, _data$data2, _data$data2$, _data$data3, _data$data3$, _data$data4, _data$data4$slice;
   var data = props.data,
     _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link;
   return /*#__PURE__*/React__default.createElement("div", {
     className: SECTION_CLASS_PADDING + " grid grid-cols-1 bg-bgSecondary md:grid-cols-3 gap-6"
+  }, /*#__PURE__*/React__default.createElement(LinkToPage, {
+    className: "md:col-span-2",
+    Link: Link,
+    href: convertURL(data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : _data$data$.route) || (data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$ = _data$data2[0]) === null || _data$data2$ === void 0 ? void 0 : _data$data2$.link) || "#"
   }, /*#__PURE__*/React__default.createElement("img", {
-    src: data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$ = _data$data[0]) === null || _data$data$ === void 0 ? void 0 : _data$data$.srcImage,
-    className: "md:col-span-2 object-cover w-full h-full rounded-[10px]"
-  }), /*#__PURE__*/React__default.createElement("div", {
-    className: "flex flex-col gap-6"
-  }, data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$slice = _data$data2.slice(1, 3)) === null || _data$data2$slice === void 0 ? void 0 : _data$data2$slice.map(function (item, index) {
+    src: data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : (_data$data3$ = _data$data3[0]) === null || _data$data3$ === void 0 ? void 0 : _data$data3$.srcImage,
+    className: " object-cover w-full h-full rounded-[10px]"
+  })), /*#__PURE__*/React__default.createElement("div", {
+    className: "flex flex-col gap-6 h-full"
+  }, data === null || data === void 0 ? void 0 : (_data$data4 = data.data) === null || _data$data4 === void 0 ? void 0 : (_data$data4$slice = _data$data4.slice(1, 3)) === null || _data$data4$slice === void 0 ? void 0 : _data$data4$slice.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement(LinkToPage, {
       Link: Link,
       href: convertURL(item === null || item === void 0 ? void 0 : item.route) || (item === null || item === void 0 ? void 0 : item.link) || "#",
+      className: "flex-1 min-h-0",
       key: "djsd-" + index
     }, /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
-      className: "object-cover w-full h-full rounded-xl"
+      className: "object-cover w-full h-full rounded-[10px]"
     }));
   })));
 };
@@ -13561,7 +13563,7 @@ var Footer1 = function Footer1(props) {
     href: "/",
     className: "flex items-center"
   }, /*#__PURE__*/React__default.createElement("img", {
-    className: "object-cover w-14 max-h-14",
+    className: "object-contain w-14 h-14",
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl
   }), /*#__PURE__*/React__default.createElement("h3", {
     className: "text-2xl md:text-3xl ms-2 font-headingFont ",
@@ -13704,7 +13706,7 @@ var Footer7 = function Footer7(props) {
     href: "/",
     className: "flex items-center gap-2"
   }, /*#__PURE__*/React__default.createElement("img", {
-    className: "object-cover w-14  max-h-14",
+    className: "object-contain w-14 h-14",
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl
   }), /*#__PURE__*/React__default.createElement("h3", {
     className: " text-2xl md:text-3xl ms-2 font-headingFont ",
@@ -14001,13 +14003,13 @@ var CustomerRating8 = function CustomerRating8(props) {
     }, item === null || item === void 0 ? void 0 : item.description), /*#__PURE__*/React__default.createElement("div", {
       className: "flex gap-2 "
     }, /*#__PURE__*/React__default.createElement(RiDoubleQuotesL, {
-      className: "text-gray3",
-      size: 36
+      className: "flex-shrink-0 text-gray4",
+      size: 16
     }), /*#__PURE__*/React__default.createElement("div", {
       className: "pt-4"
-    }, item === null || item === void 0 ? void 0 : item.content), /*#__PURE__*/React__default.createElement(RiDoubleQuotesL, {
-      className: " mt-auto text-gray3",
-      size: 36
+    }, item === null || item === void 0 ? void 0 : item.content), /*#__PURE__*/React__default.createElement(RiDoubleQuotesR, {
+      className: "flex-shrink-0 mt-auto text-gray4",
+      size: 16
     })));
   }))));
 };
@@ -14258,21 +14260,21 @@ var Gallery2 = function Gallery2(props) {
   }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : (_data$data$slice = _data$data.slice(0, 2)) === null || _data$data$slice === void 0 ? void 0 : _data$data$slice.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
-      className: "w-full h-full object-cover rounded-xl md:rounded-2xl"
+      className: "w-full h-full object-cover rounded-lg md:rounded-2xl"
     });
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "flex flex-col gap-2 md:gap-4"
   }, data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : (_data$data2$slice = _data$data2.slice(2, 4)) === null || _data$data2$slice === void 0 ? void 0 : _data$data2$slice.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
-      className: "w-full h-full object-cover rounded-xl md:rounded-2xl odd:h-[130%]"
+      className: "w-full h-full object-cover rounded-lg md:rounded-2xl odd:h-[130%]"
     });
   })), /*#__PURE__*/React__default.createElement("div", {
     className: "flex flex-col gap-2 md:gap-4"
   }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : (_data$data3$slice = _data$data3.slice(4, 6)) === null || _data$data3$slice === void 0 ? void 0 : _data$data3$slice.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
-      className: "w-full h-full object-cover rounded-xl md:rounded-2xl even:h-[130%]"
+      className: "w-full h-full object-cover rounded-lg md:rounded-2xl even:h-[130%]"
     });
   })))));
 };
@@ -14367,12 +14369,12 @@ var Breadcrumb1 = function Breadcrumb1(props) {
       return e === null || e === void 0 ? void 0 : e.length;
     })) === null || _route$route$split$fi === void 0 ? void 0 : _route$route$split$fi.slice(0, 2);
     items = (_items = items) === null || _items === void 0 ? void 0 : _items.map(function (e) {
-      var _e, _e$replace, _e$replace$replace, _e$replace$replace$re;
+      var _e, _e$replace, _e$replace$replace, _e$replace$replace$re, _e$replace$replace$re2;
       if (e === "product") e = "products";else if (e === "service") e = "services";
       return (routes === null || routes === void 0 ? void 0 : routes.find(function (r) {
         return (r === null || r === void 0 ? void 0 : r.name) === e;
       })) || {
-        label: (_e = e) === null || _e === void 0 ? void 0 : (_e$replace = _e.replace(/-{3}/g, "###")) === null || _e$replace === void 0 ? void 0 : (_e$replace$replace = _e$replace.replace(/-/g, " ")) === null || _e$replace$replace === void 0 ? void 0 : (_e$replace$replace$re = _e$replace$replace.replace(/###/g, "-")) === null || _e$replace$replace$re === void 0 ? void 0 : _e$replace$replace$re.replace(/~/g, "/")
+        label: (_e = e) === null || _e === void 0 ? void 0 : (_e$replace = _e.replace(/pct/g, '%')) === null || _e$replace === void 0 ? void 0 : (_e$replace$replace = _e$replace.replace(/fs/g, '/')) === null || _e$replace$replace === void 0 ? void 0 : (_e$replace$replace$re = _e$replace$replace.replace(/amp/g, '&')) === null || _e$replace$replace$re === void 0 ? void 0 : (_e$replace$replace$re2 = _e$replace$replace$re.replace(/-/g, ' ')) === null || _e$replace$replace$re2 === void 0 ? void 0 : _e$replace$replace$re2.replace(/hyp/g, '-')
       };
     });
     (_items2 = items) === null || _items2 === void 0 ? void 0 : _items2.unshift({
@@ -14380,7 +14382,6 @@ var Breadcrumb1 = function Breadcrumb1(props) {
       label: "Trang chủ",
       route: "/"
     });
-    console.log(items);
     setItems(items);
   };
   return /*#__PURE__*/React__default.createElement("div", {
@@ -15625,7 +15626,7 @@ var ShopHighlights2 = function ShopHighlights2(props) {
     }) : /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
       alt: "logo",
-      className: "w-16 h-16 p-3 rounded-full bg-primary"
+      className: "w-16 h-16 p-3 rounded-full object-cover bg-primary"
     }), /*#__PURE__*/React__default.createElement("div", {
       className: "font-medium text-lg"
     }, item === null || item === void 0 ? void 0 : (_item$title = item.title) === null || _item$title === void 0 ? void 0 : _item$title.toUpperCase()), /*#__PURE__*/React__default.createElement("div", {
@@ -15657,7 +15658,7 @@ var ShopHighlights5 = function ShopHighlights5(props) {
     }) : /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
       alt: "logo",
-      className: "w-16 h-16 rounded-full bg-primary"
+      className: "w-16 h-16 rounded-full object-cover bg-primary"
     }), /*#__PURE__*/React__default.createElement("div", {
       className: "font-semibold text-xl text-textHeading pt-2 border-t border-textHeading"
     }, item === null || item === void 0 ? void 0 : (_item$title = item.title) === null || _item$title === void 0 ? void 0 : _item$title.toUpperCase()), /*#__PURE__*/React__default.createElement("div", {
@@ -15687,7 +15688,7 @@ var ShopHighlights6 = function ShopHighlights6(props) {
     }) : /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
       alt: "logo",
-      className: "w-16 h-16"
+      className: "w-16 h-16 object-cover"
     }), /*#__PURE__*/React__default.createElement("div", {
       className: " w-44 h-0.5 rounded-full bg-primary"
     }), /*#__PURE__*/React__default.createElement("div", {
@@ -15866,7 +15867,7 @@ var ShopHighlights10 = function ShopHighlights10(props) {
       className: "flex-grow text-lg leading-relaxed  text-center text-textSecondary"
     }, item === null || item === void 0 ? void 0 : item.description)), /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
-      className: "h-56 lg:h-72 object-cover mt-auto border-4 border-secondary"
+      className: "aspect-video object-cover mt-auto border-4 border-secondary"
     })));
   })));
 };
@@ -15958,11 +15959,6 @@ var NewsController = function NewsController(props) {
             var _response$data2, _response$data2$data, _response$data3, _response$data3$data;
             setNewsArticles(response === null || response === void 0 ? void 0 : (_response$data2 = response.data) === null || _response$data2 === void 0 ? void 0 : (_response$data2$data = _response$data2.data) === null || _response$data2$data === void 0 ? void 0 : _response$data2$data.content);
             setPage(response === null || response === void 0 ? void 0 : (_response$data3 = response.data) === null || _response$data3 === void 0 ? void 0 : (_response$data3$data = _response$data3.data) === null || _response$data3$data === void 0 ? void 0 : _response$data3$data.totalElements);
-            var url = new URL(window.location.href);
-            if (/^(\/(tin-tuc-theo-danh-muc))\/[^/]+-\d+$/.test(url.pathname)) {
-              url.pathname = url.pathname.replace(/\/[^/]+-\d+$/, "");
-              window.history.replaceState({}, '', url.pathname + url.search);
-            }
           }
           setLoading(false);
         });
@@ -16196,7 +16192,8 @@ var News1 = function News1(props) {
     shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
     _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link,
-    catId = props.catId;
+    _props$catId = props.catId,
+    catId = _props$catId === void 0 ? "" : _props$catId;
   var _useState = useState({
       page: 0,
       sort: "timeUpdate,DESC",
@@ -16236,6 +16233,18 @@ var News1 = function News1(props) {
       setCategorySelected(category);
     }
   }, [newsCategories]);
+  var handleSelectedCateogry = function handleSelectedCateogry(item) {
+    if (catId) {
+      var newUrl = getLinkNewsByCategory(item);
+      window.history.replaceState(null, '', newUrl);
+    }
+    setCategorySelected(item);
+    setParams(function (prev) {
+      return _extends({}, prev, {
+        catId: item === null || item === void 0 ? void 0 : item.catId
+      });
+    });
+  };
   return /*#__PURE__*/React__default.createElement("div", {
     className: SECTION_CLASS + " grid grid-cols-1 md:grid-cols-3 gap-6"
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -16256,12 +16265,7 @@ var News1 = function News1(props) {
       className: "px-6 hover:bg-gray-100 hover:text-primary cursor-pointer " + ((item === null || item === void 0 ? void 0 : item.catId) === (categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.catId) ? "bg-gray-100 text-primary" : "") + " ",
       key: "sdjfdh-" + index,
       onClick: function onClick() {
-        setCategorySelected(item);
-        setParams(function (prev) {
-          return _extends({}, prev, {
-            catId: item === null || item === void 0 ? void 0 : item.catId
-          });
-        });
+        handleSelectedCateogry(item);
       }
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "border-b border-dashed py-4 " + ((newsCategories === null || newsCategories === void 0 ? void 0 : newsCategories.length) - 1 === index ? "border-b-0" : "")
@@ -16315,12 +16319,7 @@ var News1 = function News1(props) {
       className: "px-4 hover:bg-gray-100 hover:text-primary cursor-pointer " + ((item === null || item === void 0 ? void 0 : item.catId) === (categorySelected === null || categorySelected === void 0 ? void 0 : categorySelected.catId) ? "bg-gray-100 text-primary" : "") + " ",
       key: "sdjfdh-" + index,
       onClick: function onClick() {
-        setCategorySelected(item);
-        setParams(function (prev) {
-          return _extends({}, prev, {
-            catId: item === null || item === void 0 ? void 0 : item.catId
-          });
-        });
+        handleSelectedCateogry(item);
       }
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "border-b border-dashed py-4 " + ((newsCategories === null || newsCategories === void 0 ? void 0 : newsCategories.length) - 1 === index ? "border-b-0" : "")
@@ -16416,7 +16415,7 @@ var NewsDetail1 = function NewsDetail1(props) {
   }), (newsCategories === null || newsCategories === void 0 ? void 0 : newsCategories.length) > 0 ? /*#__PURE__*/React__default.createElement("div", {
     className: "top-6 block md:hidden"
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "px-6 bg-primary rounded-t-lg text-lg text-textButton text-center"
+    className: "px-6 py-3 bg-primary rounded-t-lg text-lg text-textButton text-center"
   }, "Chuy\xEAn m\u1EE5c"), /*#__PURE__*/React__default.createElement("div", {
     className: "rounded-b-lg bg-bgSecondary"
   }, newsCategories === null || newsCategories === void 0 ? void 0 : newsCategories.map(function (item, index) {
@@ -16472,5 +16471,192 @@ var NewsDetail1 = function NewsDetail1(props) {
   }))) : null);
 };
 
-export { About1, About5, About6, Address1, Banner1, Banner2, Banner3, Banner4, Banner7, BannerFull1, BannerFull2, Booking1, BookingForm6, BookingTable1, Breadcrumb1, Button, Carts1, Contact1, CustomerRating1, CustomerRating10, CustomerRating5, CustomerRating6, CustomerRating8, CustomerRating9, DateTimePicker, Employees1, Features2, Features3, Footer1, Footer7, Gallery1, Gallery2, Gallery3, Hero1, Hero10, Hero11, Hero12, Hero13, Hero14, Hero15, Hero16, Hero2, Hero5, Hero6, Input, InputPhoneNumber, Links1, ModalNotification, NavBar1, NavBar7, News1, NewsDetail1, NewsHighlight1, PageTitle1, PageTitle2, PageTitle3, Partner1, ProductCategory2, ProductDetail10, ProductDetail11, ProductHighlight1, ProductHot1, ProductHot3, ProductImage, ProductItem10, ProductItem11, ProductItem2, ProductItem3, ProductItem4, ProductItem5, ProductItem6, ProductItem7, ProductItem8, ProductItem9, ProductList5, ProductList7, ProductSale2, ProductSearch1, Products10, Products11, Products12, Products14, Products2, Products3, Products9, ProductsTop1, SearchBar2, SearchBar5, SearchBar6, SearchProduct1, SectionTitle1, SectionTitle2, SectionTitle3, SectionTitle4, SectionTitle5, Select$1 as Select, ServiceDetail1, ShopHighlights10, ShopHighlights2, ShopHighlights5, ShopHighlights6, ShopHighlights7, ShopHighlights8, ShopHighlights9, TextArea, TreatmentDetail1, TreatmentItem1, TreatmentsCategory7, TreatmentsList6, TreatmentsList7, VideoFull1 };
+var submitFormApi = function submitFormApi(landingShopConfigId, data) {
+  return api({
+    method: "post",
+    url: endpointLandingShop + "/" + landingShopConfigId + "/form",
+    data: data
+  });
+};
+
+var Form = function Form(props) {
+  var _data$data, _data$data2, _data$data3;
+  var _props$shopConfigStyl = props.shopConfigStyle,
+    shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
+    _props$shopConfig = props.shopConfig,
+    shopConfig = _props$shopConfig === void 0 ? {} : _props$shopConfig,
+    _props$data = props.data,
+    data = _props$data === void 0 ? {} : _props$data,
+    _props$SectionTitle = props.SectionTitle,
+    SectionTitle = _props$SectionTitle === void 0 ? null : _props$SectionTitle,
+    _props$router = props.router,
+    router = _props$router === void 0 ? function () {} : _props$router;
+  var _shopConfigStyle$colo = shopConfigStyle.color,
+    _shopConfigStyle$colo2 = _shopConfigStyle$colo === void 0 ? {} : _shopConfigStyle$colo,
+    _shopConfigStyle$colo3 = _shopConfigStyle$colo2.background,
+    background = _shopConfigStyle$colo3 === void 0 ? "#fff" : _shopConfigStyle$colo3;
+  var fields = (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.fields) || [];
+  var redirectUrl = (data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : _data$data2.redirect_url) || "";
+  var srcImage = data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : _data$data3.srcImage;
+  var _useState = useState(false),
+    isLoading = _useState[0],
+    setIsLoading = _useState[1];
+  var fieldRefs = useRef({});
+  var getFieldRef = function getFieldRef(key) {
+    if (!fieldRefs.current[key]) {
+      fieldRefs.current[key] = React__default.createRef();
+    }
+    return fieldRefs.current[key];
+  };
+  var formatFieldsWithValue = function formatFieldsWithValue() {
+    return fields.map(function (field, index) {
+      var _ref$current;
+      var key = (field === null || field === void 0 ? void 0 : field.title) || "field-" + index;
+      var ref = getFieldRef(key);
+      var getValue = ref === null || ref === void 0 ? void 0 : (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.getValue;
+      var value = getValue ? getValue() : undefined;
+      return _extends({}, field, {
+        value: value
+      });
+    });
+  };
+  var handleSubmit = function handleSubmit() {
+    try {
+      setIsLoading(true);
+      return Promise.resolve(_finallyRethrows(function () {
+        return _catch(function () {
+          var isValid = true;
+          var payload = {};
+          fields.forEach(function (field, index) {
+            var _ref$current2, _ref$current3;
+            var key = (field === null || field === void 0 ? void 0 : field.title) || "field-" + index;
+            var ref = getFieldRef(key);
+            var validate = ref === null || ref === void 0 ? void 0 : (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.validateData;
+            var getValue = ref === null || ref === void 0 ? void 0 : (_ref$current3 = ref.current) === null || _ref$current3 === void 0 ? void 0 : _ref$current3.getValue;
+            var ok = validate ? validate() : true;
+            if (ok === false) {
+              isValid = false;
+            }
+            payload[key] = getValue ? getValue() : undefined;
+          });
+          if (!isValid) return;
+          var fieldsWithValue = formatFieldsWithValue();
+          var body = {
+            title: data === null || data === void 0 ? void 0 : data.sectionTitle,
+            data: JSON.stringify(fieldsWithValue)
+          };
+          var _temp = function () {
+            if (shopConfig !== null && shopConfig !== void 0 && shopConfig.landingShopConfigId) {
+              return Promise.resolve(submitFormApi(shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.landingShopConfigId, body)).then(function (res) {
+                var _res$data, _res$data$status;
+                if ((res === null || res === void 0 ? void 0 : (_res$data = res.data) === null || _res$data === void 0 ? void 0 : (_res$data$status = _res$data.status) === null || _res$data$status === void 0 ? void 0 : _res$data$status.code) == '200') {
+                  router === null || router === void 0 ? void 0 : router.push(redirectUrl || "/");
+                }
+              });
+            }
+          }();
+          if (_temp && _temp.then) return _temp.then(function () {});
+        }, function (error) {
+          console.log(error);
+        });
+      }, function (_wasThrown, _result) {
+        setIsLoading(false);
+        if (_wasThrown) throw _result;
+        return _result;
+      }));
+    } catch (e) {
+      return Promise.reject(e);
+    }
+  };
+  var renderField = function renderField(field, index) {
+    var _field$title;
+    var key = (field === null || field === void 0 ? void 0 : field.title) || "field-" + index;
+    var commonProps = {
+      label: field === null || field === void 0 ? void 0 : field.title,
+      placeholder: "Nh\u1EADp " + ((field === null || field === void 0 ? void 0 : (_field$title = field.title) === null || _field$title === void 0 ? void 0 : _field$title.toLowerCase()) || ""),
+      className: "!bg-bgSecondary",
+      rules: field !== null && field !== void 0 && field.required ? [{
+        type: "required",
+        message: "Bắt buộc nhập"
+      }] : [],
+      labelClassName: "font-medium"
+    };
+    if ((field === null || field === void 0 ? void 0 : field.type) === "phone") {
+      return /*#__PURE__*/React__default.createElement(InputPhoneNumber, _extends({
+        key: key
+      }, commonProps, {
+        rules: [].concat(commonProps.rules, [{
+          type: "pattern",
+          pattern: pattern === null || pattern === void 0 ? void 0 : pattern.phoneNumberPattern,
+          message: "Số điện thoại không hợp lệ!"
+        }]),
+        className: "bg-white",
+        wrapClassName: "w-full",
+        ref: getFieldRef(key)
+      }));
+    }
+    if ((field === null || field === void 0 ? void 0 : field.type) === "area") {
+      return /*#__PURE__*/React__default.createElement(TextArea, _extends({
+        key: key
+      }, commonProps, {
+        className: "w-full",
+        textareaClassName: "w-full p-3 bg-white",
+        ref: getFieldRef(key)
+      }));
+    }
+    var extraRules = [];
+    if ((field === null || field === void 0 ? void 0 : field.type) === "email") {
+      extraRules.push({
+        type: "pattern",
+        pattern: /\S+@\S+\.\S+/,
+        message: "Email không hợp lệ"
+      });
+    }
+    return /*#__PURE__*/React__default.createElement(Input, _extends({
+      key: key
+    }, commonProps, {
+      type: (field === null || field === void 0 ? void 0 : field.type) === "email" ? "email" : "text",
+      ref: getFieldRef(key),
+      rules: [].concat(commonProps.rules, extraRules)
+    }));
+  };
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: "relative w-full px-4 xl:px-20 py-12",
+    style: {
+      backgroundColor: background
+    }
+  }, SectionTitle ? /*#__PURE__*/React__default.createElement(SectionTitle, {
+    data: data,
+    shopConfigStyle: shopConfigStyle
+  }) : null, /*#__PURE__*/React__default.createElement("div", {
+    className: "mt-12 grid grid-cols-1 gap-6 md:grid-cols-2 md:gap-12 items-start"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "space-y-4"
+  }, srcImage ? /*#__PURE__*/React__default.createElement("div", {
+    className: "w-full"
+  }, /*#__PURE__*/React__default.createElement("img", {
+    src: srcImage,
+    alt: "form-banner",
+    className: "w-full h-auto rounded-xl object-cover"
+  })) : null), /*#__PURE__*/React__default.createElement("div", {
+    className: "grid gap-4 rounded-2xl p-6 border bg-white"
+  }, fields !== null && fields !== void 0 && fields.length ? /*#__PURE__*/React__default.createElement("div", {
+    className: "grid grid-cols-1 gap-4"
+  }, fields === null || fields === void 0 ? void 0 : fields.map(renderField)) : /*#__PURE__*/React__default.createElement("div", null, "Ch\u01B0a c\xF3 c\u1EA5u h\xECnh tr\u01B0\u1EDDng"), /*#__PURE__*/React__default.createElement("div", {
+    className: "text-center"
+  }, isLoading ? /*#__PURE__*/React__default.createElement("div", {
+    className: "flex gap-2 justify-center items-center"
+  }, /*#__PURE__*/React__default.createElement(Loading, {
+    size: 24
+  }), /*#__PURE__*/React__default.createElement("span", {
+    className: "ml-2"
+  }, "\u0110ang g\u1EEDi th\xF4ng tin...")) : /*#__PURE__*/React__default.createElement(Button, {
+    label: "Gửi thông tin",
+    shopConfigStyle: shopConfigStyle,
+    onClick: handleSubmit,
+    disabled: isLoading
+  })))));
+};
+
+export { About1, About5, About6, Address1, Banner1, Banner2, Banner3, Banner4, Banner7, BannerFull1, BannerFull2, Booking1, BookingForm6, BookingTable1, Breadcrumb1, Button, Carts1, Contact1, CustomerRating1, CustomerRating10, CustomerRating5, CustomerRating6, CustomerRating8, CustomerRating9, DateTimePicker, Employees1, Features2, Features3, Footer1, Footer7, Form, Gallery1, Gallery2, Gallery3, Hero1, Hero10, Hero11, Hero12, Hero13, Hero14, Hero15, Hero16, Hero2, Hero5, Hero6, Input, InputPhoneNumber, Links1, ModalNotification, NavBar1, NavBar7, News1, NewsDetail1, NewsHighlight1, PageTitle1, PageTitle2, PageTitle3, Partner1, ProductCategory2, ProductDetail10, ProductDetail11, ProductHighlight1, ProductHot1, ProductHot3, ProductImage, ProductItem10, ProductItem11, ProductItem2, ProductItem3, ProductItem4, ProductItem5, ProductItem6, ProductItem7, ProductItem8, ProductItem9, ProductList5, ProductList7, ProductSale2, ProductSearch1, Products10, Products11, Products12, Products14, Products2, Products3, Products9, ProductsTop1, SearchBar2, SearchBar5, SearchBar6, SearchProduct1, SectionTitle1, SectionTitle2, SectionTitle3, SectionTitle4, SectionTitle5, Select$1 as Select, ServiceDetail1, ShopHighlights10, ShopHighlights2, ShopHighlights5, ShopHighlights6, ShopHighlights7, ShopHighlights8, ShopHighlights9, TextArea, TreatmentDetail1, TreatmentItem1, TreatmentsCategory7, TreatmentsList6, TreatmentsList7, VideoFull1 };
 //# sourceMappingURL=index.modern.js.map