s-platform-landing-section 0.1.17 → 0.1.18

package/dist/index.modern.js

@@ -33,7 +33,7 @@ var Button = function Button(props) {
     _props$type = props.type,
     type = _props$type === void 0 ? "primary" : _props$type;
   var _className = type === "primary" ? "text-textButton bg-primary" : "text-primary border border-primary";
-  _className = "font-medium rounded-lg text-sm px-3 py-2 md:px-4 md:py-2.5 hover:text-textButton hover:bg-primary hover:opacity-80 " + _className + " " + ((shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass) || "") + " " + className;
+  _className = "font-medium rounded-lg text-sm px-3 py-2 md:px-4 md:py-2.5 hover:text-textButton hover:bg-primary hover:opacity-80 " + _className + " " + className + " " + ((shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass) || "");
   return /*#__PURE__*/React__default.createElement("button", {
     type: "button",
     className: _className,
@@ -373,20 +373,38 @@ var NavBar7 = function NavBar7(props) {
     onClick: function onClick(event) {
       return event.stopPropagation();
     }
-  }, /*#__PURE__*/React__default.createElement("button", {
-    className: "flex w-full justify-end text-gray4",
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "flex justify-between"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "flex gap-2 items-center"
+  }, /*#__PURE__*/React__default.createElement(LinkToPage, {
+    Link: Link,
+    href: "/",
+    onClick: function onClick() {
+      return setIsOpen(false);
+    }
+  }, /*#__PURE__*/React__default.createElement("img", {
+    src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
+    className: "h-14 w-14 bg-cover bg-no-repeat"
+  })), /*#__PURE__*/React__default.createElement("div", {
+    className: "text-xl font-semibold line-clamp-1"
+  }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName)), /*#__PURE__*/React__default.createElement("button", {
+    className: "text-gray4",
     onClick: function onClick() {
       setIsOpen(false);
     }
   }, /*#__PURE__*/React__default.createElement(RxCross2, {
     size: 24
-  })), /*#__PURE__*/React__default.createElement("div", null, shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$navB3 = shopConfigStyle.navBarMenus) === null || _shopConfigStyle$navB3 === void 0 ? void 0 : (_shopConfigStyle$navB4 = _shopConfigStyle$navB3.filter(function (e) {
+  }))), /*#__PURE__*/React__default.createElement("div", null, shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$navB3 = shopConfigStyle.navBarMenus) === null || _shopConfigStyle$navB3 === void 0 ? void 0 : (_shopConfigStyle$navB4 = _shopConfigStyle$navB3.filter(function (e) {
     return e === null || e === void 0 ? void 0 : e.isShow;
   })) === null || _shopConfigStyle$navB4 === void 0 ? void 0 : _shopConfigStyle$navB4.map(function (item, index) {
     return /*#__PURE__*/React__default.createElement(LinkToPage, {
       Link: Link,
       href: item === null || item === void 0 ? void 0 : item.route,
-      key: index
+      key: index,
+      onClick: function onClick() {
+        return setIsOpen(false);
+      }
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "py-2 " + ((item === null || item === void 0 ? void 0 : item.name) === (route === null || route === void 0 ? void 0 : route.name) ? "text-textHeading" : "")
     }, item === null || item === void 0 ? void 0 : item.label));
@@ -577,10 +595,16 @@ var NavBar1 = function NavBar1(props) {
     className: "flex justify-between"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "flex gap-2 items-center"
+  }, /*#__PURE__*/React__default.createElement(LinkToPage, {
+    Link: Link,
+    href: "/",
+    onClick: function onClick() {
+      return setIsOpen(false);
+    }
   }, /*#__PURE__*/React__default.createElement("img", {
     src: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.logoUrl,
     className: "h-14 w-14 bg-cover bg-no-repeat"
-  }), /*#__PURE__*/React__default.createElement("div", {
+  })), /*#__PURE__*/React__default.createElement("div", {
     className: "text-xl font-semibold line-clamp-1"
   }, shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopName)), /*#__PURE__*/React__default.createElement("button", {
     className: "text-gray4",
@@ -595,7 +619,10 @@ var NavBar1 = function NavBar1(props) {
     return /*#__PURE__*/React__default.createElement(LinkToPage, {
       Link: Link,
       href: item === null || item === void 0 ? void 0 : item.route,
-      key: index
+      key: index,
+      onClick: function onClick() {
+        return setIsOpen(false);
+      }
     }, /*#__PURE__*/React__default.createElement("div", {
       className: "py-2 " + ((item === null || item === void 0 ? void 0 : item.name) === (route === null || route === void 0 ? void 0 : route.name) ? "text-textHeading" : "")
     }, item === null || item === void 0 ? void 0 : item.label));
@@ -784,7 +811,7 @@ var Input = forwardRef(function (props, ref) {
       setTypeInput("text");
     }
   };
-  var _className = "h-9 md:h-10 py-1 px-2 border border-stroke rounded-lg   " + className;
+  var _className = "h-10 py-1 px-2 border border-stroke rounded-lg   " + className;
   var _inputClassName = (isQuantity ? "text-center w-12" : "") + " focus:outline-none focus:ring-0 bg-transparent\t " + inputClassName;
   var required = !!(rules !== null && rules !== void 0 && rules.find(function (e) {
     return (e === null || e === void 0 ? void 0 : e.type) === "required";
@@ -828,7 +855,7 @@ var Input = forwardRef(function (props, ref) {
 });
 
 var Hero1 = function Hero1(props) {
-  var _sectionData$, _sectionData$$srcImag, _sectionData$2, _sectionData$3, _sectionData$4, _sectionData$4$button, _sectionData$4$button2, _sectionData$5, _sectionData$5$button, _sectionData$5$button2;
+  var _sectionData$, _sectionData$$srcImag, _sectionData$2, _sectionData$3, _sectionData$4, _sectionData$4$button, _sectionData$4$button2, _sectionData$5, _sectionData$5$button, _sectionData$5$button2, _sectionData$6, _sectionData$6$button, _sectionData$6$button2;
   var shopConfigStyle = props.shopConfigStyle,
     data = props.data,
     _props$Link = props.Link,
@@ -850,9 +877,9 @@ var Hero1 = function Hero1(props) {
     className: "text-center md:text-2xl lg:text-3xl font-medium"
   }, sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$3 = sectionData[0]) === null || _sectionData$3 === void 0 ? void 0 : _sectionData$3.description), /*#__PURE__*/React__default.createElement(LinkToPage, {
     Link: Link,
-    href: sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$4 = sectionData[0]) === null || _sectionData$4 === void 0 ? void 0 : (_sectionData$4$button = _sectionData$4.buttons) === null || _sectionData$4$button === void 0 ? void 0 : (_sectionData$4$button2 = _sectionData$4$button[0]) === null || _sectionData$4$button2 === void 0 ? void 0 : _sectionData$4$button2.link
+    href: (sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$4 = sectionData[0]) === null || _sectionData$4 === void 0 ? void 0 : (_sectionData$4$button = _sectionData$4.buttons) === null || _sectionData$4$button === void 0 ? void 0 : (_sectionData$4$button2 = _sectionData$4$button[0]) === null || _sectionData$4$button2 === void 0 ? void 0 : _sectionData$4$button2.route) || (sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$5 = sectionData[0]) === null || _sectionData$5 === void 0 ? void 0 : (_sectionData$5$button = _sectionData$5.buttons) === null || _sectionData$5$button === void 0 ? void 0 : (_sectionData$5$button2 = _sectionData$5$button[0]) === null || _sectionData$5$button2 === void 0 ? void 0 : _sectionData$5$button2.link)
   }, /*#__PURE__*/React__default.createElement(Button, {
-    label: sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$5 = sectionData[0]) === null || _sectionData$5 === void 0 ? void 0 : (_sectionData$5$button = _sectionData$5.buttons) === null || _sectionData$5$button === void 0 ? void 0 : (_sectionData$5$button2 = _sectionData$5$button[0]) === null || _sectionData$5$button2 === void 0 ? void 0 : _sectionData$5$button2.label,
+    label: sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$6 = sectionData[0]) === null || _sectionData$6 === void 0 ? void 0 : (_sectionData$6$button = _sectionData$6.buttons) === null || _sectionData$6$button === void 0 ? void 0 : (_sectionData$6$button2 = _sectionData$6$button[0]) === null || _sectionData$6$button2 === void 0 ? void 0 : _sectionData$6$button2.label,
     shopConfigStyle: shopConfigStyle
   })), "            "), /*#__PURE__*/React__default.createElement("div", {
     className: "w-[90%] md:w-2/3 xl:w-1/2 bg-background flex gap-2 md:gap-4 lg:gap-6 p-2 md:p-4 lg:p-6 rounded-xl absolute bottom-[-40px] shadow-lg"
@@ -917,7 +944,9 @@ var Hero5 = function Hero5(props) {
 var Hero6 = function Hero6(props) {
   var _data$data, _data$data$, _data$data$$srcImages, _data$data2, _data$data2$, _data$data3, _data$data3$, _sectionData$, _sectionData$$buttons;
   var shopConfigStyle = props.shopConfigStyle,
-    data = props.data;
+    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: "relative"
@@ -931,7 +960,8 @@ var Hero6 = function Hero6(props) {
   }, 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: "md:text-xl"
   }, 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), sectionData === null || sectionData === void 0 ? void 0 : (_sectionData$ = sectionData[0]) === null || _sectionData$ === void 0 ? void 0 : (_sectionData$$buttons = _sectionData$.buttons) === null || _sectionData$$buttons === void 0 ? void 0 : _sectionData$$buttons.map(function (button) {
-    return /*#__PURE__*/React__default.createElement("a", {
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
       href: (button === null || button === void 0 ? void 0 : button.route) || (button === null || button === void 0 ? void 0 : button.link) || "#"
     }, /*#__PURE__*/React__default.createElement(Button, {
       label: button === null || button === void 0 ? void 0 : button.label,
@@ -1057,13 +1087,13 @@ var CarouselItem = function CarouselItem(props) {
   })))), isNavigateButton ? /*#__PURE__*/React__default.createElement("div", {
     className: "hidden my-auto col-span-5 md:col-span-3 lg:col-span-2 gap-4 md:flex justify-end "
   }, /*#__PURE__*/React__default.createElement("button", {
-    className: "p-2 h-full w-10 md:w-12 rounded-full " + (isScrolledToRight ? "bg-gray5" : "bg-primary"),
+    className: "p-2 h-full w-10 h-10 md:h-12 md:w-12 rounded-full " + (isScrolledToRight ? "bg-gray5" : "bg-primary"),
     onClick: handleClickPrevImg
   }, /*#__PURE__*/React__default.createElement(IoIosArrowBack, {
     size: 32,
     className: "inline-block text-lg text-textButton"
   })), /*#__PURE__*/React__default.createElement("button", {
-    className: " p-2 h-full w-10 md:w-12 rounded-full  " + (isScrolledToRight ? "bg-primary" : "bg-gray5"),
+    className: " p-2 h-full w-10 h-10 md:h-12 md:w-12 rounded-full  " + (isScrolledToRight ? "bg-primary" : "bg-gray5"),
     onClick: handleClickNextImg
   }, /*#__PURE__*/React__default.createElement(IoIosArrowForward, {
     size: 32,
@@ -9355,7 +9385,6 @@ var ProductItem2 = function ProductItem2(props) {
     Link = _props$Link === void 0 ? null : _props$Link,
     _props$className = props.className,
     className = _props$className === void 0 ? "" : _props$className;
-  console.log("checkkkkkkkk:::::::", className);
   return /*#__PURE__*/React__default.createElement(LinkToPage, {
     Link: Link,
     href: getLinkProductDetail(product)
@@ -9387,9 +9416,9 @@ var ProductItem3 = function ProductItem3(props) {
     product: product,
     className: "w-full h-44 md:h-56 lg:h-64 xl:h-72 bg-cover bg-no-repeat rounded-t-2xl"
   }), /*#__PURE__*/React__default.createElement("div", {
-    className: "p-4 flex flex-col gap-4 items-start"
+    className: "p-4 flex flex-col gap-2 md:gap-4 items-start"
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: "line-clamp-1"
+    className: "line-clamp-1 text-lg"
   }, product === null || product === void 0 ? void 0 : product.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
     product: product,
     className: "text-lg text-start"
@@ -9411,14 +9440,14 @@ 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,
-    className: "w-full h-44 sm:h-56 xl:h-72 bg-cover bg-no-repeat rounded-2xl"
+    className: "w-full h-40 sm:h-56 lg:h-60 xl:h-64 bg-cover bg-no-repeat rounded-2xl"
   }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
-    className: "text-start line-clamp-1"
+    className: "text-start line-clamp-1 text-lg"
   }, product === null || product === void 0 ? void 0 : product.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
     product: product,
     className: "text-lg text-start mt-2"
   })), /*#__PURE__*/React__default.createElement("div", {
-    className: "flex pt-4 gap-2 md:gap-4 border-t items-center"
+    className: "flex pt-2 md:pt-4 gap-2 md:gap-4 border-t items-center"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "p-2 md:p-[10px] rounded-full hover:opacity-80 border border-primary h-full w-auto flex items-center justify-center " + (shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.buttonClass)
   }, /*#__PURE__*/React__default.createElement(FiShoppingCart, {
@@ -9477,7 +9506,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,
-    className: "w-full h-44 sm:h-56 xl:h-72 bg-cover bg-no-repeat rounded-2xl"
+    className: "w-full h-40 sm:h-56 lg:h-60 xl:h-64 bg-cover bg-no-repeat rounded-2xl"
   }), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "text start line-clamp-1"
   }, product === null || product === void 0 ? void 0 : product.productName), /*#__PURE__*/React__default.createElement(ProductPrice, {
@@ -10352,12 +10381,14 @@ var ProductHighlight1 = function ProductHighlight1(props) {
     return /*#__PURE__*/React__default.createElement(ProductItem, {
       Link: Link,
       product: product === null || product === void 0 ? void 0 : product.productInfo,
+      shopConfigStyle: shopConfigStyle,
       key: "zjk-" + idx
     });
   })) : /*#__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),
+    shopConfigStyle: shopConfigStyle,
+    className: "mx-auto",
     type: "outline"
   }) : null);
 };
@@ -10619,7 +10650,7 @@ var Booking1 = function Booking1(props) {
 };
 
 var BookingForm6 = function BookingForm6(props) {
-  var _data$data, _data$data$, _data$data2, _data$data2$;
+  var _data$data, _data$data$, _data$data2, _data$data2$, _data$data3, _data$data3$, _data$data4, _data$data4$, _data$data5, _data$data5$, _data$data6, _data$data6$;
   var _props$shopConfigStyl = props.shopConfigStyle,
     shopConfigStyle = _props$shopConfigStyl === void 0 ? {} : _props$shopConfigStyl,
     _props$shopConfig = props.shopConfig,
@@ -10636,14 +10667,20 @@ var BookingForm6 = function BookingForm6(props) {
     shopConfigStyle: shopConfigStyle
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "mt-12 grid grid-cols-1 gap-6 md:grid-cols-3 md:gap-12"
+  }, /*#__PURE__*/React__default.createElement(LinkToPage, {
+    href: (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)
+  }, 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$.svgImage ? /*#__PURE__*/React__default.createElement("div", {
+    className: "text-primary w-full h-auto"
   }, /*#__PURE__*/React__default.createElement("div", {
-    className: ""
-  }, /*#__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,
+    dangerouslySetInnerHTML: {
+      __html: configSvg(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$.svgImage)
+    }
+  })) : /*#__PURE__*/React__default.createElement("img", {
+    src: 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$.srcImage,
     className: "w-full h-auto"
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "mt-4 whitespace-pre-line"
-  }, 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$.description)), /*#__PURE__*/React__default.createElement(BookingForm, {
+  }, 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$.description)), /*#__PURE__*/React__default.createElement(BookingForm, {
     shopConfigStyle: shopConfigStyle,
     shopConfig: shopConfig,
     className: "col-span-2"
@@ -10740,15 +10777,21 @@ var Banner2 = function Banner2(props) {
 };
 
 var Banner3 = function Banner3(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_CLASS + " grid grid-cols-1 md:grid-cols-3 gap-5"
   }, sectionData === null || sectionData === void 0 ? void 0 : sectionData.map(function (item, index) {
-    return /*#__PURE__*/React__default.createElement("img", {
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
+      href: (item === null || item === void 0 ? void 0 : item.route) || (item === null || item === void 0 ? void 0 : item.link),
+      key: "djsd-" + index
+    }, /*#__PURE__*/React__default.createElement("img", {
       src: item === null || item === void 0 ? void 0 : item.srcImage,
       className: "bg-cover bg-no-repeat h-full rounded-xl"
-    });
+    }));
   }));
 };
 
@@ -10941,13 +10984,11 @@ var Links1 = function Links1(props) {
 };
 
 var Footer1 = function Footer1(props) {
-  var _routes$filter;
+  var _shopConfigStyle$navB, _shopConfigStyle$navB2;
   var shopConfig = props.shopConfig,
     shopConfigStyle = props.shopConfigStyle,
     _props$Link = props.Link,
-    Link = _props$Link === void 0 ? null : _props$Link,
-    _props$routes = props.routes,
-    routes = _props$routes === void 0 ? [] : _props$routes;
+    Link = _props$Link === void 0 ? null : _props$Link;
   var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo2 = _shopConfigStyle$colo.primary,
     primary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2,
@@ -10979,7 +11020,9 @@ var Footer1 = function Footer1(props) {
   };
   return /*#__PURE__*/React__default.createElement("div", {
     className: SECTION_CLASS + " !md:my-0 !my-0 pt-12 bg-bgSecondary"
-  }, /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement(LinkToPage, {
+    Link: Link,
+    href: "/",
     className: "flex items-center"
   }, /*#__PURE__*/React__default.createElement("img", {
     className: "object-cover w-16 h-16",
@@ -11018,12 +11061,13 @@ var Footer1 = function Footer1(props) {
     className: "mb-3 font-semibold text-lg"
   }, "Li\xEAn k\u1EBFt"), /*#__PURE__*/React__default.createElement("div", {
     className: "leading-10 flex flex-col "
-  }, routes === null || routes === void 0 ? void 0 : (_routes$filter = routes.filter(function (e) {
+  }, shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$navB = shopConfigStyle.navBarMenus) === null || _shopConfigStyle$navB === void 0 ? void 0 : (_shopConfigStyle$navB2 = _shopConfigStyle$navB.filter(function (e) {
     return e === null || e === void 0 ? void 0 : e.isShow;
-  })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (route, index) {
+  })) === null || _shopConfigStyle$navB2 === void 0 ? void 0 : _shopConfigStyle$navB2.map(function (route, index) {
     return /*#__PURE__*/React__default.createElement(LinkToPage, {
       Link: Link,
-      href: route === null || route === void 0 ? void 0 : route.route
+      href: route === null || route === void 0 ? void 0 : route.route,
+      key: "dfjg-" + index
     }, /*#__PURE__*/React__default.createElement("div", null, route === null || route === void 0 ? void 0 : route.label));
   }))), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "font-semibold mb-4 text-lg"
@@ -11071,11 +11115,11 @@ var Footer1 = function Footer1(props) {
 };
 
 var Footer7 = function Footer7(props) {
-  var _routes$filter;
+  var _shopConfigStyle$navB, _shopConfigStyle$navB2;
   var shopConfig = props.shopConfig,
     shopConfigStyle = props.shopConfigStyle,
-    _props$routes = props.routes,
-    routes = _props$routes === void 0 ? [] : _props$routes;
+    _props$Link = props.Link,
+    Link = _props$Link === void 0 ? null : _props$Link;
   var _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo2 = _shopConfigStyle$colo.primary,
     primary = _shopConfigStyle$colo2 === void 0 ? "#000" : _shopConfigStyle$colo2,
@@ -11116,7 +11160,9 @@ var Footer7 = function Footer7(props) {
       background: bgSecondary,
       color: textBody
     }
-  }, /*#__PURE__*/React__default.createElement("div", {
+  }, /*#__PURE__*/React__default.createElement(LinkToPage, {
+    Link: Link,
+    href: "/",
     className: "flex items-center gap-2"
   }, /*#__PURE__*/React__default.createElement("img", {
     className: "object-cover w-14",
@@ -11155,11 +11201,13 @@ var Footer7 = function Footer7(props) {
     className: "mb-4 font-semibold text-md md:text-lg"
   }, "Li\xEAn k\u1EBFt"), /*#__PURE__*/React__default.createElement("div", {
     className: "leading-10 flex flex-col "
-  }, routes === null || routes === void 0 ? void 0 : (_routes$filter = routes.filter(function (e) {
+  }, shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : (_shopConfigStyle$navB = shopConfigStyle.navBarMenus) === null || _shopConfigStyle$navB === void 0 ? void 0 : (_shopConfigStyle$navB2 = _shopConfigStyle$navB.filter(function (e) {
     return e === null || e === void 0 ? void 0 : e.isShow;
-  })) === null || _routes$filter === void 0 ? void 0 : _routes$filter.map(function (route, index) {
-    return /*#__PURE__*/React__default.createElement("a", {
-      href: route === null || route === void 0 ? void 0 : route.route
+  })) === null || _shopConfigStyle$navB2 === void 0 ? void 0 : _shopConfigStyle$navB2.map(function (route, index) {
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      href: route === null || route === void 0 ? void 0 : route.route,
+      Link: Link,
+      key: "fiddf-" + index
     }, /*#__PURE__*/React__default.createElement("div", null, route === null || route === void 0 ? void 0 : route.label));
   }))), /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement("div", {
     className: "font-semibold mb-4 text-md md:text-lg"
@@ -11309,7 +11357,7 @@ var CustomerRating5 = function CustomerRating5(props) {
     }
   };
   return /*#__PURE__*/React__default.createElement("div", {
-    className: SECTION_CLASS + " mx-0 md:mx-4 xl:mx-20 rounded-xl relative"
+    className: SECTION_CLASS + " mx-0 md:mx-4 xl:mx-20 rounded-xl pb-6 relative"
   }, /*#__PURE__*/React__default.createElement("div", {
     className: "absolute mt-16 inset-0 bg-bgSecondary [clip-path:polygon(0%_0%,_100%_30%,_100%_100%,_0%_100%)] z-0 rounded-3xl"
   }), /*#__PURE__*/React__default.createElement("div", {
@@ -11513,21 +11561,19 @@ var PageTitle1 = function PageTitle1(props) {
 };
 
 var About1 = function About1(props) {
+  var shopConfig = props.shopConfig,
+    data = props.data;
   return /*#__PURE__*/React__default.createElement("div", {
     className: SECTION_CLASS + " flex flex-col gap-4"
-  }, /*#__PURE__*/React__default.createElement("div", null, "Tr\xE1i c\xE2y s\u1EA1ch - an to\xE0n cho s\u1EE9c kho\u1EBB ng\u01B0\u1EDDi ti\xEAu d\xF9ng. C\u1EEDa h\xE0ng ORGANIC FOOD c\u1EE7a ch\xFAng t\xF4i t\u1EEBng b\u01B0\u1EDBc \u0111i v\xE0o th\u1ECB tr\u01B0\u1EDDng v\xE0 ni\u1EC1m tin c\u1EE7a kh\xE1ch h\xE0ng. Ho\u1EA1t \u0111\u1ED9ng v\xE0o th\xE1ng 5/2020, ORGANIC FOOD \u0111\xE3 tr\u1EDF th\xE0nh c\xE1i t\xEAn quen thu\u1ED9c trong l\u0129nh v\u1EF1c cung c\u1EA5p tr\xE1i c\xE2y s\u1EA1ch, an to\xE0n, cam k\u1EBFt ch\xEDn t\u1EF1 nhi\xEAn 100% v\xE0 h\u01B0\u1EDBng \u0111\u1EBFn s\u1EE9c kho\u1EBB ng\u01B0\u1EDDi ti\xEAu d\xF9ng qua 3 ti\xEAu ch\xED:"), /*#__PURE__*/React__default.createElement("div", {
-    className: "font-semibold"
-  }, "T\u1EA7m Nh\xECn"), /*#__PURE__*/React__default.createElement("div", null, "S\u1EA3n ph\u1EA9m t\u01B0\u0300 ORGANIC FOOD se\u0303 tr\u1EDF tha\u0300nh thu\u031Bo\u031Bng hi\u1EB9\u0302u quen thu\u1ECD\u0302c va\u0300 h\u01B0\u1EDBng \u0111\u1EBFn ch\u1EA5t l\u01B0\u1EE3ng t\u1ED1t nh\u1EA5t."), /*#__PURE__*/React__default.createElement("div", {
-    className: "font-semibold"
-  }, "S\u1EE9 m\u1EC7nh"), /*#__PURE__*/React__default.createElement("li", {
-    className: "ps-4"
-  }, " \u0110\u1ECD\u0302i ngu\u0303 ba\u0301n ha\u0300ng s\u0103\u0303n sa\u0300ng l\u0103\u0301ng nghe va\u0300 t\u1EA1\u0302n ta\u0302m nhi\u1EB9\u0302t huy\xEA\u0301t trong co\u0302ng vi\u1EB9\u0302c."), /*#__PURE__*/React__default.createElement("li", {
-    className: "ps-4"
-  }, " Sa\u0309n ph\xE2\u0309m th\u01B0\u0301c u\xF4\u0301ng \u0111a da\u0323ng, \u0111a\u0309m ba\u0309o t\xF4\u0301t s\u01B0\u0301c kho\u0309e va\u0300 \u0111a\u0301p \u01B0\u0301ng \u0111u\u031B\u01A1\u0323c mong \u0111\u01A1\u0323i cu\u0309a kha\u0301ch ha\u0300ng."), /*#__PURE__*/React__default.createElement("li", {
-    className: "ps-4"
-  }, " Tr\xE1i c\xE2y \u0111a d\u1EA1ng, cam k\u1EBFt h\xE0ng s\u1EA1ch \u0111\u1EA3m b\u1EA3o ch\u1EA5t l\u01B0\u1EE3ng t\u1ED1t nh\u1EA5t v\xE0 an to\xE0n tuy\u1EC7t \u0111\u1ED1i cho ng\u01B0\u1EDDi ti\xEAu d\xF9ng"), /*#__PURE__*/React__default.createElement("div", {
-    className: "font-semibold"
-  }, "Gi\xE1 Tr\u1ECB C\u1ED1t L\xF5i"), /*#__PURE__*/React__default.createElement("div", null, "ORGANIC FOOD s\u1EBD lu\xF4n l\xE0 ng\u01B0\u1EDDi b\u1EA1n tin c\u1EADy nh\u1EA5t c\xF9ng kh\xE1ch h\xE0ng, tr\xE1i c\xE2y s\u1EA1ch lu\xF4n \u0111\u1EA3m b\u1EA3o ch\u1EA5t l\u01B0\u1EE3ng v\xE0 mang l\u1EA1i ngu\u1ED3n dinh d\u01B0\u1EE1ng c\u0169ng nh\u01B0 s\u1EF1 an to\xE0n cho kh\xE1ch h\xE0ng, g\xF3p ph\u1EA7n mang \u0111\u1EBFn cu\u1ED9c s\u1ED1ng xanh kho\u1EBB m\u1EA1nh cho m\u1ECDi nh\xE0."));
+  }, data !== null && data !== void 0 && data.sectionTitle ? /*#__PURE__*/React__default.createElement("h1", {
+    className: "text-4xl font-semibold"
+  }, data === null || data === void 0 ? void 0 : data.sectionTitle) : null, data !== null && data !== void 0 && data.sectionDescription ? /*#__PURE__*/React__default.createElement("div", {
+    className: "text-xl"
+  }, data === null || data === void 0 ? void 0 : data.sectionDescription) : null, /*#__PURE__*/React__default.createElement("div", {
+    dangerouslySetInnerHTML: {
+      __html: shopConfig === null || shopConfig === void 0 ? void 0 : shopConfig.shopAbout
+    }
+  }));
 };
 
 var About5 = function About5(props) {
@@ -12498,7 +12544,7 @@ var SearchProduct1 = function SearchProduct1(props) {
     setSearchValue = _useState2[1];
   useEffect(function () {
     if (valueSearch === "") {
-      setProducts([]);
+      setListProducts([]);
     } else {
       var delayDebounceFn = setTimeout(function () {
         handleSearch(valueSearch);
@@ -12570,6 +12616,7 @@ var SearchProduct1 = function SearchProduct1(props) {
 };
 
 var SearchBar2 = function SearchBar2(props) {
+  var _data$data;
   var _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link,
     data = props.data;
@@ -12615,12 +12662,21 @@ var SearchBar2 = function SearchBar2(props) {
     }
   };
   return /*#__PURE__*/React__default.createElement("div", {
-    className: "w-[100vw] md:w-[50vw] py-6 mx-auto px-6 flex flex-col gap-4"
+    className: SECTION_CLASS + " md:mt-6"
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: " w-full flex flex-col justify-center px-6 gap-2 md:gap-4 items-center rounded-xl md:rounded-3xl ",
+    style: {
+      background: "url(" + (data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.srcImage) + ")",
+      backgroundPosition: "center",
+      backgroundSize: "cover"
+    }
+  }, /*#__PURE__*/React__default.createElement("div", {
+    className: "w-[100vw] md:w-[50vw] py-6 mx-auto px-6 flex flex-col h-full gap-4"
   }, /*#__PURE__*/React__default.createElement(Input, {
     icons: /*#__PURE__*/React__default.createElement(IoSearchOutline, {
       className: "text-gray3"
     }),
-    className: "w-full",
+    className: "w-full h-12",
     inputClassName: "w-full",
     placeholder: data !== null && data !== void 0 && data.sectionTitle ? data === null || data === void 0 ? void 0 : data.sectionTitle : "Tìm kiếm sản phẩm",
     onChange: setSearchValue
@@ -12645,14 +12701,13 @@ var SearchBar2 = function SearchBar2(props) {
     })));
   })) : /*#__PURE__*/React__default.createElement("div", {
     className: "mx-auto"
-  }, data === null || data === void 0 ? void 0 : data.sectionDescription));
+  }, data === null || data === void 0 ? void 0 : data.sectionDescription))));
 };
 
 var SearchBar5 = function SearchBar5(props) {
-  var _data$data, _data$data2, _data$data3;
+  var _data$data, _data$data2, _data$data3, _data$data4, _data$data5;
   var _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link,
-    shopConfigStyle = props.shopConfigStyle,
     data = props.data;
   var _useState = useState(""),
     value = _useState[0],
@@ -12666,12 +12721,14 @@ var SearchBar5 = function SearchBar5(props) {
       backgroundPosition: "center",
       backgroundSize: "cover"
     }
-  }, /*#__PURE__*/React__default.createElement("div", {
+  }, data !== null && data !== void 0 && (_data$data2 = data.data) !== null && _data$data2 !== void 0 && _data$data2.title ? /*#__PURE__*/React__default.createElement("div", {
     className: "text-xl font-semibold md:text-3xl lg:text-4xl text-textButton text-center"
-  }, data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : _data$data2.title), /*#__PURE__*/React__default.createElement("div", null, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : _data$data3.description), /*#__PURE__*/React__default.createElement(Input, {
+  }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : _data$data3.title) : null, data !== null && data !== void 0 && (_data$data4 = data.data) !== null && _data$data4 !== void 0 && _data$data4.description ? /*#__PURE__*/React__default.createElement("div", {
+    className: "text-center"
+  }, data === null || data === void 0 ? void 0 : (_data$data5 = data.data) === null || _data$data5 === void 0 ? void 0 : _data$data5.description) : null, /*#__PURE__*/React__default.createElement(Input, {
     onChange: setValue,
     icons: /*#__PURE__*/React__default.createElement(IoSearchOutline, {
-      className: "text-gray3 text-xl md:text-2xl"
+      className: "text-gray3 ps-1 text-xl md:text-2xl"
     }),
     className: "w-full bg-bgSecondary w-full md:w-[50vw] lg:w-[35vw] mb-2 md:h-12",
     style: {
@@ -12684,18 +12741,16 @@ var SearchBar5 = function SearchBar5(props) {
       href: genLinkSearch(value)
     }, /*#__PURE__*/React__default.createElement(Button, {
       label: "T\xECm ki\u1EBFm",
-      className: "whitespace-nowrap h-full ",
-      shopConfigStyle: shopConfigStyle
+      className: "whitespace-nowrap h-full !rounded-3xl "
     })) : /*#__PURE__*/React__default.createElement(Button, {
       label: "T\xECm ki\u1EBFm",
-      className: "whitespace-nowrap ",
-      shopConfigStyle: shopConfigStyle
+      className: "whitespace-nowrap !rounded-3xl py-1.5 md:py-2.5"
     }))
   })));
 };
 
 var SearchBar6 = function SearchBar6(props) {
-  var _data$data, _data$data2, _data$data3;
+  var _data$data, _data$data2, _data$data3, _data$data4, _data$data5;
   var shopConfigStyle = props.shopConfigStyle,
     _props$Link = props.Link,
     Link = _props$Link === void 0 ? null : _props$Link,
@@ -12710,9 +12765,11 @@ var SearchBar6 = function SearchBar6(props) {
       backgroundPosition: "center",
       backgroundSize: "cover"
     }
-  }, /*#__PURE__*/React__default.createElement("div", {
+  }, data !== null && data !== void 0 && (_data$data2 = data.data) !== null && _data$data2 !== void 0 && _data$data2.title ? /*#__PURE__*/React__default.createElement("div", {
     className: "text-lg font-semibold text-textBody md:text-2xl lg:text-3xl text-center"
-  }, data === null || data === void 0 ? void 0 : (_data$data2 = data.data) === null || _data$data2 === void 0 ? void 0 : _data$data2.title), /*#__PURE__*/React__default.createElement("div", null, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : _data$data3.description), /*#__PURE__*/React__default.createElement("div", {
+  }, data === null || data === void 0 ? void 0 : (_data$data3 = data.data) === null || _data$data3 === void 0 ? void 0 : _data$data3.title) : null, data !== null && data !== void 0 && (_data$data4 = data.data) !== null && _data$data4 !== void 0 && _data$data4.description ? /*#__PURE__*/React__default.createElement("div", {
+    className: "text-center"
+  }, data === null || data === void 0 ? void 0 : (_data$data5 = data.data) === null || _data$data5 === void 0 ? void 0 : _data$data5.description) : null, /*#__PURE__*/React__default.createElement("div", {
     className: "flex gap-2 md:gap-4 lg:gap-6 mb-2 md:mb-0"
   }, /*#__PURE__*/React__default.createElement(Input, {
     icons: /*#__PURE__*/React__default.createElement(IoSearchOutline, {
@@ -12737,12 +12794,17 @@ var SearchBar6 = function SearchBar6(props) {
 };
 
 var ShopHighlights2 = function ShopHighlights2(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_CLASS + " my-0 md:my-0 py-6 grid grid-cols-2 md:grid-cols-4 gap-4 lg:gap-6"
   }, sectionData === null || sectionData === void 0 ? void 0 : sectionData.map(function (item, index) {
-    return /*#__PURE__*/React__default.createElement("div", {
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
+      href: (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 items-center text-center lg:px-3 gap-3",
       key: "kdf-" + index
     }, item !== null && item !== void 0 && item.svgImage ? /*#__PURE__*/React__default.createElement("div", {
@@ -12756,17 +12818,22 @@ var ShopHighlights2 = function ShopHighlights2(props) {
       className: "w-16 h-16 p-3 rounded-full bg-primary"
     }), /*#__PURE__*/React__default.createElement("div", {
       className: "font-medium text-lg"
-    }, item === null || item === void 0 ? void 0 : item.title), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.description));
+    }, item === null || item === void 0 ? void 0 : item.title), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.description)));
   }));
 };
 
 var ShopHighlights5 = function ShopHighlights5(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_CLASS + " grid md:grid-cols-3 py-6 gap-4 lg:gap-6 bg-bgSecondary"
   }, sectionData === null || sectionData === void 0 ? void 0 : sectionData.map(function (item, index) {
-    return /*#__PURE__*/React__default.createElement("div", {
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      href: (item === null || item === void 0 ? void 0 : item.route) || (item === null || item === void 0 ? void 0 : item.link),
+      Link: Link
+    }, /*#__PURE__*/React__default.createElement("div", {
       className: "flex flex-col items-center text-center md:px-3 lg:px-6 gap-3",
       key: "kdf-" + index
     }, item !== null && item !== void 0 && item.svgImage ? /*#__PURE__*/React__default.createElement("div", {
@@ -12780,7 +12847,7 @@ var ShopHighlights5 = function ShopHighlights5(props) {
       className: "w-16 h-16 rounded-full bg-primary"
     }), /*#__PURE__*/React__default.createElement("div", {
       className: "font-medium text-xl text-textHeading pt-2 border-t border-textHeading"
-    }, item === null || item === void 0 ? void 0 : item.title), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.description));
+    }, item === null || item === void 0 ? void 0 : item.title), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.description)));
   }));
 };
 
@@ -12810,7 +12877,7 @@ var ShopHighlights6 = function ShopHighlights6(props) {
       className: " w-44 h-0.5 rounded-full bg-primary"
     }), /*#__PURE__*/React__default.createElement("div", null, item === null || item === void 0 ? void 0 : item.description), /*#__PURE__*/React__default.createElement(LinkToPage, {
       Link: Link,
-      href: (item === null || item === void 0 ? void 0 : item.link) || (item === null || item === void 0 ? void 0 : item.route)
+      href: (item === null || item === void 0 ? void 0 : item.route) || (item === null || item === void 0 ? void 0 : item.link)
     }, /*#__PURE__*/React__default.createElement(Button, {
       shopConfigStyle: shopConfigStyle,
       label: item === null || item === void 0 ? void 0 : item.title
@@ -12825,7 +12892,9 @@ var ShopHighlights7 = function ShopHighlights7(props) {
     _props$data = props.data,
     data = _props$data === void 0 ? {} : _props$data,
     _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 _shopConfigStyle$colo = shopConfigStyle === null || shopConfigStyle === void 0 ? void 0 : shopConfigStyle.color,
     _shopConfigStyle$colo3 = _shopConfigStyle$colo.secondary,
     secondary = _shopConfigStyle$colo3 === void 0 ? "#000" : _shopConfigStyle$colo3;
@@ -12836,7 +12905,10 @@ var ShopHighlights7 = function ShopHighlights7(props) {
   }), /*#__PURE__*/React__default.createElement("div", {
     className: "mt-6 grid grid-cols-3 gap-4 md:gap-8"
   }, data === null || data === void 0 ? void 0 : (_data$data = data.data) === null || _data$data === void 0 ? void 0 : _data$data.map(function (it, index) {
-    return /*#__PURE__*/React__default.createElement("div", {
+    var _item, _item2;
+    return /*#__PURE__*/React__default.createElement(LinkToPage, {
+      Link: Link,
+      href: ((_item = item) === null || _item === void 0 ? void 0 : _item.route) || ((_item2 = item) === null || _item2 === void 0 ? void 0 : _item2.link),
       key: index,
       className: "pt-6 col-span-3 md:col-span-1"
     }, /*#__PURE__*/React__default.createElement("div", {