@bonlineza/luxity-lib 2.35.8 → 2.36.0

package/build/bundle.js

@@ -15562,13 +15562,13 @@
         setError = _useForm.setError;
 
     var renderLinks = function renderLinks(links, title) {
-      return /*#__PURE__*/React__default.createElement("div", {
+      return !!links.length && /*#__PURE__*/React__default.createElement("div", {
         className: "footer__link-container"
       }, /*#__PURE__*/React__default.createElement("div", {
         className: "footer__link-title"
       }, title), /*#__PURE__*/React__default.createElement("div", {
         className: "footer__links"
-      }, !!links.length && links.map(function (link) {
+      }, links.map(function (link) {
         return /*#__PURE__*/React__default.createElement("div", {
           className: "footer__link-wrapper",
           key: link.label
@@ -15751,13 +15751,13 @@
     }), /*#__PURE__*/React__default.createElement(AccordionSection, {
       title: "POPULAR",
       links: popularLinks
-    }), /*#__PURE__*/React__default.createElement(AccordionSection, {
+    }), !!sellLinks.length && /*#__PURE__*/React__default.createElement(AccordionSection, {
       title: "SELL",
       links: sellLinks
     }), /*#__PURE__*/React__default.createElement(AccordionSection, {
       title: "COMPANY",
       links: companyLinks
-    }), /*#__PURE__*/React__default.createElement(AccordionSection, {
+    }), !!storeLinks.length && /*#__PURE__*/React__default.createElement(AccordionSection, {
       title: "CONNECT",
       links: storeLinks
     }), /*#__PURE__*/React__default.createElement("div", {
@@ -15821,11 +15821,11 @@
       onClick: onMenuItemClick
     }, "All ", categoryTitle)), !!brandElements.length && brandElements.map(function (brand) {
       return /*#__PURE__*/React__default.createElement("div", {
-        className: "dropdown__brand-element"
+        className: "dropdown__brand-element",
+        key: brand.name
       }, /*#__PURE__*/React__default.createElement(LinkComponent, {
         href: "".concat(productsUrl, "/").concat(categorySlug, "/").concat(brand === null || brand === void 0 ? void 0 : brand.slug),
         className: "dropdown__element",
-        key: brand.name,
         onClick: onMenuItemClick
       }, brand === null || brand === void 0 ? void 0 : brand.name));
     }))), /*#__PURE__*/React__default.createElement("div", {
@@ -15929,37 +15929,6 @@
     }, contactNumber)));
   };
 
-  var categories$1 = {
-    shoes: {
-      name: 'Shoes',
-      slug: 'shoes'
-    },
-    bags: {
-      name: 'Bags',
-      slug: 'bags'
-    },
-    clothing: {
-      name: 'Clothing',
-      slug: 'apparel'
-    },
-    watches: {
-      name: 'Watches',
-      slug: 'watches'
-    },
-    accessories: {
-      name: 'Accessories',
-      slug: 'accessories'
-    }
-  };
-
-  var removeCategoryByName = function removeCategoryByName(categories, name) {
-    var _categories$filter;
-
-    return (_categories$filter = categories === null || categories === void 0 ? void 0 : categories.filter(function (category) {
-      return category.name !== name;
-    })) !== null && _categories$filter !== void 0 ? _categories$filter : [];
-  };
-
   var SearchResults = function SearchResults(_ref) {
     var _searchResults$brands, _searchResults$produc, _searchResults$brands2, _searchResults$produc2, _initialSearchData$tr, _initialSearchData$la, _limitBrands, _limitBrands2, _initialSearchData$la2, _searchResults$produc3;
 
@@ -16126,6 +16095,7 @@
     var endpoint = _ref.endpoint,
         onProductIdsReceived = _ref.onProductIdsReceived,
         currency = _ref.currency;
+    var currentSearchRequestToken = React.useRef(null);
     var debounce = React.useCallback(function (func, wait) {
       var timeout;
       return function executedFunction() {
@@ -16156,49 +16126,75 @@
         });
       });
     }, []);
-    var performSearch = React.useCallback(function (nextValue, setSearchResults) {
-      if (!nextValue || nextValue.trim() === '') {
+    var performSearch = React.useCallback(function (searchQuery, setSearchResults) {
+      if (!searchQuery || searchQuery.trim() === '') {
         setSearchResults({
           brands: [],
           products: [],
           luxity_product_ids: []
         });
         return;
-      }
+      } // Cancel any ongoing search request to prevent race conditions
 
-      axios.post(endpoint, searchProducts(nextValue, 3, currency)).then(function (response) {
-        var searchResults = response.data.data.luxity_products_serach_results;
-        setSearchResults(searchResults);
 
-        if (searchResults && searchResults.luxity_product_ids) {
-          onProductIdsReceived(searchResults.luxity_product_ids);
+      if (currentSearchRequestToken.current) {
+        currentSearchRequestToken.current.cancel();
+      } // Create a new token for this specific search request
+
+
+      var newSearchToken = axios.CancelToken.source();
+      currentSearchRequestToken.current = newSearchToken;
+      axios.post(endpoint, searchProducts(searchQuery, 3, currency), {
+        cancelToken: newSearchToken.token
+      }).then(function (response) {
+        if (currentSearchRequestToken.current === newSearchToken) {
+          var searchResults = response.data.data.luxity_products_serach_results;
+          setSearchResults(searchResults);
+
+          if (searchResults && searchResults.luxity_product_ids) {
+            onProductIdsReceived(searchResults.luxity_product_ids);
+          }
+
+          currentSearchRequestToken.current = null;
+        }
+      }).catch(function (error) {
+        if (!axios.isCancel(error)) {
+          setSearchResults({
+            brands: [],
+            products: [],
+            luxity_product_ids: []
+          });
+          currentSearchRequestToken.current = null;
         }
-      }).catch(function () {
-        setSearchResults({
-          brands: [],
-          products: [],
-          luxity_product_ids: []
-        });
       });
     }, [endpoint, currency, onProductIdsReceived]);
     var debouncedSearch = React.useMemo(function () {
-      return debounce(function (nextValue, setSearchResults) {
-        return performSearch(nextValue, setSearchResults);
+      return debounce(function (searchQuery, setSearchResults) {
+        return performSearch(searchQuery, setSearchResults);
       }, 500);
     }, [debounce, performSearch]);
     var createDebouncedSearch = React.useCallback(function (setSearchResults) {
-      return function (nextValue) {
-        return debouncedSearch(nextValue, setSearchResults);
+      return function (searchQuery) {
+        return debouncedSearch(searchQuery, setSearchResults);
       };
     }, [debouncedSearch]);
     var createImmediateSearch = React.useCallback(function (setSearchValue, setSearchResults, onSearchSubmit) {
-      return function (value) {
+      return function (searchQuery) {
+        /*
+         * Cancel any pending search request when immediate search is performed
+         * Immediate search is when the user types a search query and presses enter
+         */
+        if (currentSearchRequestToken.current) {
+          currentSearchRequestToken.current.cancel();
+          currentSearchRequestToken.current = null;
+        }
+
         setSearchValue('');
         setSearchResults({
           brands: [],
           products: []
         });
-        onSearchSubmit(value);
+        onSearchSubmit(searchQuery);
       };
     }, []);
     return {
@@ -16248,13 +16244,16 @@
     }, [setSearchValue, setIsSearchFocused, debouncedSearch, setSearchResults, setCachedResults]);
   };
   var useSearchInputFocus = function useSearchInputFocus(searchValue, setIsSearchFocused, cachedResults, setSearchResults) {
+    var handleSearchClick = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : undefined;
     return React.useCallback(function () {
       setIsSearchFocused(true);
 
-      if (searchValue.trim().length >= 3) {
+      if (typeof handleSearchClick === 'function') {
+        handleSearchClick();
+      } else if (searchValue.trim().length >= 3) {
         setSearchResults(cachedResults);
       }
-    }, [searchValue, setIsSearchFocused, cachedResults, setSearchResults]);
+    }, [searchValue, setIsSearchFocused, cachedResults, setSearchResults, handleSearchClick]);
   };
   var useSearchInputKeyDown = function useSearchInputKeyDown(searchValue, immediateSearch, setIsSearchFocused) {
     var setSearchValue = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : null;
@@ -16274,6 +16273,14 @@
     }, [searchValue, immediateSearch, setIsSearchFocused, setSearchValue]);
   };
 
+  var removeCategoryByName = function removeCategoryByName(categories, name) {
+    var _categories$filter;
+
+    return (_categories$filter = categories === null || categories === void 0 ? void 0 : categories.filter(function (category) {
+      return category.name.toLowerCase() !== name.toLowerCase();
+    })) !== null && _categories$filter !== void 0 ? _categories$filter : [];
+  };
+
   var LuxityDesktopHeader = function LuxityDesktopHeader(_ref) {
     var accountIcon = _ref.accountIcon,
         cartIcon = _ref.cartIcon,
@@ -16281,12 +16288,6 @@
         cartCount = _ref.cartCount,
         logoSrc = _ref.logoSrc,
         categoryElements = _ref.categoryElements,
-        newBrandsImage = _ref.newBrandsImage,
-        bagsImage = _ref.bagsImage,
-        shoesImage = _ref.shoesImage,
-        clothingImage = _ref.clothingImage,
-        accessoriesImage = _ref.accessoriesImage,
-        watchesImage = _ref.watchesImage,
         stores = _ref.stores,
         contactNumber = _ref.contactNumber,
         productsUrl = _ref.productsUrl,
@@ -16300,9 +16301,9 @@
         ourStoryLink = _ref.ourStoryLink,
         onLogoClick = _ref.onLogoClick,
         endpoint = _ref.endpoint,
-        menuData = _ref.menuData,
         initialSearchData = _ref.initialSearchData,
         onSearchSubmit = _ref.onSearchSubmit,
+        onSearchClick = _ref.onSearchClick,
         onProductIdsReceived = _ref.onProductIdsReceived,
         currency = _ref.currency,
         currencySymbol = _ref.currencySymbol,
@@ -16314,7 +16315,8 @@
         name = _ref.name,
         isVip = _ref.isVip,
         shop = _ref.shop,
-        app = _ref.app;
+        app = _ref.app,
+        categoryConfig = _ref.categoryConfig;
 
     var _useSearch = useSearch({
       endpoint: endpoint,
@@ -16341,26 +16343,17 @@
         setIsSearchFocused = _useState6[1];
 
     var _useState7 = React.useState({
-      latestArrivals: [],
-      bags: [],
-      shoes: [],
-      clothing: [],
-      accessories: [],
-      watches: [],
-      accessoriesCategories: [],
-      apparelStyles: []
-    }),
-        _useState8 = _slicedToArray(_useState7, 2),
-        dropdownData = _useState8[0],
-        setDropdownData = _useState8[1];
-
-    var _useState9 = React.useState({
       trending_brands: [],
       latest_products: []
     }),
+        _useState8 = _slicedToArray(_useState7, 2),
+        initialSearchView = _useState8[0],
+        setInitialSearchView = _useState8[1];
+
+    var _useState9 = React.useState({}),
         _useState10 = _slicedToArray(_useState9, 2),
-        initialSearchView = _useState10[0],
-        setInitialSearchView = _useState10[1];
+        dropdownData = _useState10[0],
+        setDropdownData = _useState10[1];
 
     var _useState11 = React.useState(false),
         _useState12 = _slicedToArray(_useState11, 2),
@@ -16391,7 +16384,17 @@
     var immediateSearch = createImmediateSearch(setSearchValue, setSearchResults, onSearchSubmit);
     var handleChange = useSearchInputChange(setSearchValue, setIsSearchFocused, debouncedSearch, setSearchResults, setCachedResults);
     useSearchClickOutside(searchResultsRef, searchResults, setCachedResults, setIsSearchFocused, setSearchResults);
-    var handleSearchFocus = useSearchInputFocus(searchValue, setIsSearchFocused, cachedResults, setSearchResults);
+
+    var handleSearchClick = function handleSearchClick() {
+      if (typeof onSearchClick === 'function') {
+        onSearchClick();
+        return;
+      }
+
+      handleSearchFocus();
+    };
+
+    var handleSearchFocus = useSearchInputFocus(searchValue, setIsSearchFocused, cachedResults, setSearchResults, onSearchClick);
     var handleKeyDown = useSearchInputKeyDown(searchValue, immediateSearch, setIsSearchFocused);
 
     function addCategoryToElements(elements, categoryName) {
@@ -16404,29 +16407,58 @@
 
     React.useMemo(function () {
       setLoading(true);
-      axios.get("".concat(menuData)).then(function (_ref2) {
+      axios.get("".concat(categoryConfig.menuData)).then(function (_ref2) {
         var data = _ref2.data;
         setLoading(false);
-        setDropdownData(function (prev) {
-          return _objectSpread2(_objectSpread2({}, prev), {}, {
-            latestArrivals: data.latest_arrivals,
-            bags: data.bags,
-            shoes: data.shoes,
-            apparel: data.apparel,
-            accessories: data.accessories,
-            watches: data.watches,
-            accessoriesCategories: data.accessories_categories,
-            apparelStyles: data.apparel_styles
-          });
-        });
+        setDropdownData(data);
       }).catch(function () {
         return setHasError(true);
       });
-    }, [menuData]);
+    }, [categoryConfig.menuData]);
     React.useMemo(function () {
+      if (!initialSearchData) {
+        return;
+      }
+
       fetchInitialSearchData(initialSearchData, setInitialSearchView);
     }, [initialSearchData, fetchInitialSearchData]);
 
+    var renderDropdownLinks = function renderDropdownLinks() {
+      return categoryConfig.categories.map(function (category) {
+        var title = category.title,
+            imageSrc = category.imageSrc,
+            categorySlug = category.categorySlug,
+            categoryName = category.categoryName,
+            elementsKey = category.elementsKey,
+            subCategoryElementsKey = category.subCategoryElementsKey,
+            styleElementsKey = category.styleElementsKey;
+        var categoryElementsProcessed = categoryElements;
+
+        if (subCategoryElementsKey && dropdownData[subCategoryElementsKey]) {
+          // show subcategory elements
+          categoryElementsProcessed = removeCategoryByName(dropdownData[subCategoryElementsKey], categoryName);
+        } else if (styleElementsKey && dropdownData[styleElementsKey]) {
+          categoryElementsProcessed = addCategoryToElements(dropdownData[styleElementsKey], categorySlug);
+        } else {
+          categoryElementsProcessed = addCategoryToElements(categoryElementsProcessed, categorySlug);
+        }
+
+        return /*#__PURE__*/React__default.createElement(DropdownLink$1, {
+          key: categorySlug,
+          title: title,
+          imageSrc: imageSrc,
+          categoryElements: categoryElementsProcessed,
+          brandElements: dropdownData[elementsKey] || [],
+          productsUrl: productsUrl,
+          categorySlug: categorySlug,
+          categoryTitle: categoryName,
+          isLoading: loading,
+          hasError: hasError,
+          LinkComponent: LinkComponent
+        });
+      });
+    };
+
     var getMarginRight = function getMarginRight(userIsVip, userName) {
       if (userIsVip) return '15px';
       if (userName) return '5px';
@@ -16464,7 +16496,7 @@
       value: searchValue,
       onChange: handleChange,
       onKeyDown: handleKeyDown,
-      onClick: handleSearchFocus,
+      onClick: handleSearchClick,
       onFocus: handleSearchFocus
     })), /*#__PURE__*/React__default.createElement(SearchResults, {
       searchValue: searchValue,
@@ -16488,74 +16520,9 @@
       currencySymbol: currencySymbol
     }), /*#__PURE__*/React__default.createElement("nav", {
       className: "navbar__nav-links navbar__nav-links--wrap"
-    }, /*#__PURE__*/React__default.createElement(DropdownLink$1, {
-      title: "New",
-      imageSrc: newBrandsImage,
-      categoryElements: categoryElements,
-      brandElements: dropdownData.latestArrivals,
-      productsUrl: productsUrl,
-      categorySlug: "brands",
-      categoryTitle: "Brands",
-      isLoading: loading,
-      hasError: hasError,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
-      title: "Bags",
-      imageSrc: bagsImage,
-      categoryElements: addCategoryToElements(categoryElements, categories$1.bags.slug),
-      brandElements: dropdownData.bags,
-      productsUrl: productsUrl,
-      categorySlug: categories$1.bags.slug,
-      categoryTitle: categories$1.bags.name,
-      isLoading: loading,
-      hasError: hasError,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
-      title: "Shoes",
-      imageSrc: shoesImage,
-      categoryElements: addCategoryToElements(categoryElements, categories$1.shoes.slug),
-      brandElements: dropdownData.shoes,
-      productsUrl: productsUrl,
-      categorySlug: categories$1.shoes.slug,
-      categoryTitle: categories$1.shoes.name,
-      isLoading: loading,
-      hasError: hasError,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
-      title: "Clothing",
-      imageSrc: clothingImage,
-      categoryElements: addCategoryToElements(dropdownData.apparelStyles, categories$1.clothing.slug),
-      brandElements: dropdownData.apparel,
-      productsUrl: productsUrl,
-      categorySlug: categories$1.clothing.slug,
-      categoryTitle: categories$1.clothing.name,
-      isLoading: loading,
-      hasError: hasError,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
-      title: "Accessories",
-      imageSrc: accessoriesImage,
-      categoryElements: removeCategoryByName(dropdownData.accessoriesCategories, 'ACCESSORIES'),
-      brandElements: dropdownData.accessories,
-      productsUrl: productsUrl,
-      categorySlug: categories$1.accessories.slug,
-      categoryTitle: categories$1.accessories.name,
-      isLoading: loading,
-      hasError: hasError,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(DropdownLink$1, {
-      title: "Watches",
-      imageSrc: watchesImage,
-      categoryElements: addCategoryToElements(categoryElements, categories$1.watches.slug),
-      brandElements: dropdownData.watches,
-      productsUrl: productsUrl,
-      categorySlug: categories$1.watches.slug,
-      categoryTitle: categories$1.watches.name,
-      isLoading: loading,
-      hasError: hasError,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement("li", {
-      className: "navbar__link"
+    }, renderDropdownLinks(), !!stores.length && /*#__PURE__*/React__default.createElement("li", {
+      className: "navbar__link",
+      key: "Stores"
     }, /*#__PURE__*/React__default.createElement(LinkComponent, {
       href: contactUsLink,
       className: "navbar__link-item navbar__link-item--desktop"
@@ -16598,7 +16565,7 @@
       onClick: onAccountClick
     }, /*#__PURE__*/React__default.createElement("span", {
       className: "text-sm"
-    }, name))), /*#__PURE__*/React__default.createElement("button", {
+    }, name))), onInterestClick && /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "".concat(app ? 'navbar__icon--app' : 'navbar__icon'),
       onClick: onInterestClick
@@ -16751,6 +16718,7 @@
       className: "side-nav__element"
     }, "All Brands"), !!brandsList.length && brandsList.map(function (brand) {
       return /*#__PURE__*/React__default.createElement(LinkComponent, {
+        key: brand.slug,
         href: "".concat(productUrl, "/").concat(categorySlug === 'new' ? 'brands' : categorySlug, "/").concat(brand.slug),
         onClick: handleLinkClick,
         className: "side-nav__element"
@@ -16773,13 +16741,13 @@
         categoryElements = _ref.categoryElements,
         showSideNav = _ref.showSideNav,
         onMenuClick = _ref.onMenuClick,
-        menuData = _ref.menuData,
         currency = _ref.currency,
         currencyOptions = _ref.currencyOptions,
         onCurrencyChange = _ref.onCurrencyChange,
         isCurrencySelectionDisabled = _ref.isCurrencySelectionDisabled,
         tooltipContent = _ref.tooltipContent,
-        LinkComponent = _ref.LinkComponent;
+        LinkComponent = _ref.LinkComponent,
+        categoryConfig = _ref.categoryConfig;
 
     var _useState = React.useState(false),
         _useState2 = _slicedToArray(_useState, 2),
@@ -16796,16 +16764,7 @@
         loading = _useState6[0],
         setLoading = _useState6[1];
 
-    var _useState7 = React.useState({
-      latestArrivals: [],
-      bags: [],
-      shoes: [],
-      apparel: [],
-      accessories: [],
-      watches: [],
-      accessoriesCategories: [],
-      apparelStyles: []
-    }),
+    var _useState7 = React.useState({}),
         _useState8 = _slicedToArray(_useState7, 2),
         dropdownData = _useState8[0],
         setDropdownData = _useState8[1];
@@ -16852,25 +16811,93 @@
 
     React.useMemo(function () {
       setLoading(true);
-      axios.get("".concat(menuData)).then(function (_ref2) {
+      axios.get("".concat(categoryConfig.menuData)).then(function (_ref2) {
         var data = _ref2.data;
         setLoading(false);
-        setDropdownData(function (prev) {
-          return _objectSpread2(_objectSpread2({}, prev), {}, {
-            latestArrivals: data.latest_arrivals,
-            bags: data.bags,
-            shoes: data.shoes,
-            apparel: data.apparel,
-            accessories: data.accessories,
-            watches: data.watches,
-            accessoriesCategories: data.accessories_categories,
-            apparelStyles: data.apparel_styles
-          });
-        });
+        setDropdownData(data);
       }).catch(function () {
         return setHasError(true);
       });
-    }, [menuData]);
+    }, [categoryConfig.menuData]);
+
+    var renderMenuItems = function renderMenuItems() {
+      return categoryConfig.categories.map(function (category) {
+        var title = category.title,
+            categorySlug = category.categorySlug;
+        var slug = categorySlug;
+
+        if (categorySlug === 'brands') {
+          slug = 'new';
+        }
+
+        return /*#__PURE__*/React__default.createElement("div", {
+          className: "side-nav__menu-item",
+          key: slug
+        }, /*#__PURE__*/React__default.createElement("button", {
+          type: "button",
+          className: "side-nav__menu-title-wrapper",
+          onClick: function onClick() {
+            return onSubMenuClick(slug);
+          }
+        }, /*#__PURE__*/React__default.createElement("span", {
+          className: "side-nav__menu-title"
+        }, title), /*#__PURE__*/React__default.createElement("img", {
+          src: accordionIcon,
+          alt: "accordion-icon",
+          className: "side-nav__accordion-icon"
+        })));
+      });
+    };
+
+    var renderDropdownLinks = function renderDropdownLinks() {
+      return categoryConfig.categories.map(function (category) {
+        var categorySlug = category.categorySlug,
+            categoryName = category.categoryName,
+            elementsKey = category.elementsKey,
+            subCategoryElementsKey = category.subCategoryElementsKey,
+            styleElementsKey = category.styleElementsKey;
+        var categoryElementsProcessed = categoryElements;
+
+        if (subCategoryElementsKey && dropdownData[subCategoryElementsKey]) {
+          // show subcategory elements
+          categoryElementsProcessed = removeCategoryByName(dropdownData[subCategoryElementsKey], categoryName);
+        } else if (styleElementsKey && dropdownData[styleElementsKey]) {
+          categoryElementsProcessed = addCategoryToElements(dropdownData[styleElementsKey], categorySlug);
+        } else {
+          categoryElementsProcessed = addCategoryToElements(categoryElementsProcessed, categorySlug);
+        }
+
+        var subMenuTitle = 'Brands';
+
+        if (categorySlug !== 'brands') {
+          subMenuTitle = "".concat(categoryName, " Brands");
+        }
+
+        var subMenu = categorySlug;
+
+        if (subMenu === 'brands') {
+          subMenu = 'new';
+        }
+
+        return /*#__PURE__*/React__default.createElement(BrandsDropDown, {
+          key: categorySlug,
+          subMenuOpen: subMenuOpen && displayedSubMenu === subMenu,
+          onBackClick: onBackClick,
+          backIcon: backIcon,
+          subMenuCategoryTitle: "Department",
+          productUrl: productUrl,
+          categoryElements: categoryElementsProcessed,
+          subMenuBrandsTitle: subMenuTitle,
+          brandsList: dropdownData[elementsKey],
+          categorySlug: displayedSubMenu,
+          isLoading: loading,
+          hasError: hasError,
+          onCloseSideNav: onCloseSideNav,
+          LinkComponent: LinkComponent
+        });
+      });
+    };
+
     return /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav"
     }, /*#__PURE__*/React__default.createElement("div", {
@@ -16891,92 +16918,9 @@
       className: "side-nav__close-icon"
     })), /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__menu-items-wrapper"
-    }, /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
-      className: "side-nav__menu-title-wrapper",
-      onClick: function onClick() {
-        return onSubMenuClick('new');
-      }
-    }, /*#__PURE__*/React__default.createElement("span", {
-      className: "side-nav__menu-title"
-    }, "New"), /*#__PURE__*/React__default.createElement("img", {
-      src: accordionIcon,
-      alt: "accordion-icon",
-      className: "side-nav__accordion-icon"
-    }))), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
-      className: "side-nav__menu-title-wrapper",
-      onClick: function onClick() {
-        return onSubMenuClick('bags');
-      }
-    }, /*#__PURE__*/React__default.createElement("span", {
-      className: "side-nav__menu-title"
-    }, "Bags"), /*#__PURE__*/React__default.createElement("img", {
-      src: accordionIcon,
-      alt: "accordion-icon",
-      className: "side-nav__accordion-icon"
-    }))), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
-      className: "side-nav__menu-title-wrapper",
-      onClick: function onClick() {
-        return onSubMenuClick('shoes');
-      }
-    }, /*#__PURE__*/React__default.createElement("span", {
-      className: "side-nav__menu-title"
-    }, "Shoes"), /*#__PURE__*/React__default.createElement("img", {
-      src: accordionIcon,
-      alt: "accordion-icon",
-      className: "side-nav__accordion-icon"
-    }))), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
-      className: "side-nav__menu-title-wrapper",
-      onClick: function onClick() {
-        return onSubMenuClick('apparel');
-      }
-    }, /*#__PURE__*/React__default.createElement("span", {
-      className: "side-nav__menu-title"
-    }, "Clothing"), /*#__PURE__*/React__default.createElement("img", {
-      src: accordionIcon,
-      alt: "accordion-icon",
-      className: "side-nav__accordion-icon"
-    }))), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
-      className: "side-nav__menu-title-wrapper",
-      onClick: function onClick() {
-        return onSubMenuClick('accessories');
-      }
-    }, /*#__PURE__*/React__default.createElement("span", {
-      className: "side-nav__menu-title"
-    }, "Accessories"), /*#__PURE__*/React__default.createElement("img", {
-      src: accordionIcon,
-      alt: "accordion-icon",
-      className: "side-nav__accordion-icon"
-    }))), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
-    }, /*#__PURE__*/React__default.createElement("button", {
-      type: "button",
-      className: "side-nav__menu-title-wrapper",
-      onClick: function onClick() {
-        return onSubMenuClick('watches');
-      }
-    }, /*#__PURE__*/React__default.createElement("span", {
-      className: "side-nav__menu-title"
-    }, "Watches"), /*#__PURE__*/React__default.createElement("img", {
-      src: accordionIcon,
-      alt: "accordion-icon",
-      className: "side-nav__accordion-icon"
-    }))), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
+    }, renderMenuItems(), !!stores.length && /*#__PURE__*/React__default.createElement("div", {
+      className: "side-nav__menu-item",
+      key: "stores"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "side-nav__menu-title-wrapper",
@@ -16988,134 +16932,58 @@
       alt: "accordion-icon",
       className: "side-nav__accordion-icon"
     }))), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
+      className: "side-nav__menu-item",
+      key: "sell-to-us"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "side-nav__block-button",
       onClick: onSellToUsClick
     }, "Sell To Us")), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
+      className: "side-nav__menu-item",
+      key: "our-story"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "side-nav__sub-link",
       onClick: onOurStoryClick
-    }, "Our Story")), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
+    }, "Our Story")), typeof onBlogClick === 'function' && /*#__PURE__*/React__default.createElement("div", {
+      className: "side-nav__menu-item",
+      key: "blog"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "side-nav__sub-link",
       onClick: onBlogClick
     }, "Blog")), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
+      className: "side-nav__menu-item",
+      key: "contact-us"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "side-nav__sub-link",
       onClick: onContactUsClick
     }, "Contact Us")), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
+      className: "side-nav__menu-item",
+      key: "my-account"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "side-nav__sub-link",
       onClick: onAccountClick
     }, "My Account")), /*#__PURE__*/React__default.createElement("div", {
-      className: "side-nav__menu-item"
+      className: "side-nav__menu-item",
+      key: "my-cart"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
       className: "side-nav__sub-link",
       onClick: onCartClick
     }, "My Cart")), /*#__PURE__*/React__default.createElement(CurrencySelect, {
+      key: "currency",
       currency: currency,
       currencyOptions: currencyOptions,
       onCurrencyChange: onCurrencyChange,
       isCurrencySelectionDisabled: isCurrencySelectionDisabled,
       tooltipContent: tooltipContent
-    }))), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
-      subMenuOpen: subMenuOpen && displayedSubMenu === 'new',
-      onBackClick: onBackClick,
-      backIcon: backIcon,
-      subMenuCategoryTitle: "Department",
-      productUrl: productUrl,
-      categoryElements: categoryElements,
-      subMenuBrandsTitle: "Brands",
-      brandsList: dropdownData.latestArrivals,
-      categorySlug: displayedSubMenu,
-      isLoading: loading,
-      hasError: hasError,
-      onCloseSideNav: onCloseSideNav,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
-      subMenuOpen: subMenuOpen && displayedSubMenu === 'bags',
-      onBackClick: onBackClick,
-      backIcon: backIcon,
-      subMenuCategoryTitle: "Department",
-      productUrl: productUrl,
-      categoryElements: addCategoryToElements(categoryElements, categories$1.bags.slug),
-      subMenuBrandsTitle: "Bag Brands",
-      brandsList: dropdownData.bags,
-      categorySlug: displayedSubMenu,
-      isLoading: loading,
-      hasError: hasError,
-      onCloseSideNav: onCloseSideNav,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
-      subMenuOpen: subMenuOpen && displayedSubMenu === 'shoes',
-      onBackClick: onBackClick,
-      backIcon: backIcon,
-      subMenuCategoryTitle: "Department",
-      productUrl: productUrl,
-      categoryElements: addCategoryToElements(categoryElements, categories$1.shoes.slug),
-      subMenuBrandsTitle: "Shoe Brands",
-      brandsList: dropdownData.shoes,
-      categorySlug: displayedSubMenu,
-      isLoading: loading,
-      hasError: hasError,
-      onCloseSideNav: onCloseSideNav,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
-      subMenuOpen: subMenuOpen && displayedSubMenu === 'apparel',
-      onBackClick: onBackClick,
-      backIcon: backIcon,
-      subMenuCategoryTitle: "Department",
-      productUrl: productUrl,
-      categoryElements: addCategoryToElements(dropdownData.apparelStyles, categories$1.clothing.slug),
-      subMenuBrandsTitle: "Clothing Brands",
-      brandsList: dropdownData.apparel,
-      categorySlug: displayedSubMenu,
-      isLoading: loading,
-      hasError: hasError,
-      onCloseSideNav: onCloseSideNav,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
-      subMenuOpen: subMenuOpen && displayedSubMenu === 'accessories',
-      onBackClick: onBackClick,
-      backIcon: backIcon,
-      subMenuCategoryTitle: "Categories",
-      productUrl: productUrl,
-      categoryElements: removeCategoryByName(dropdownData.accessoriesCategories, 'ACCESSORIES'),
-      subMenuBrandsTitle: "Accessory Brands",
-      brandsList: dropdownData.accessories,
-      categorySlug: displayedSubMenu,
-      isLoading: loading,
-      hasError: hasError,
-      onCloseSideNav: onCloseSideNav,
-      LinkComponent: LinkComponent
-    }), /*#__PURE__*/React__default.createElement(BrandsDropDown, {
-      subMenuOpen: subMenuOpen && displayedSubMenu === 'watches',
-      onBackClick: onBackClick,
-      backIcon: backIcon,
-      subMenuCategoryTitle: "Department",
-      productUrl: productUrl,
-      categoryElements: addCategoryToElements(categoryElements, categories$1.watches.slug),
-      subMenuBrandsTitle: "Watches Brands",
-      brandsList: dropdownData.watches,
-      categorySlug: displayedSubMenu,
-      isLoading: loading,
-      hasError: hasError,
-      onCloseSideNav: onCloseSideNav,
-      LinkComponent: LinkComponent
-    }), displayedSubMenu === 'stores' && /*#__PURE__*/React__default.createElement("div", {
+    }))), renderDropdownLinks(), displayedSubMenu === 'stores' && /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__content"
     }, /*#__PURE__*/React__default.createElement(StoresDropdown$1, {
+      key: "stores",
       backIcon: backIcon,
       onBackClick: onBackClick,
       stores: stores,
@@ -17183,7 +17051,7 @@
       src: accountIcon,
       alt: "close-icon",
       className: "side-nav__menu-icon"
-    }), "Account"))), /*#__PURE__*/React__default.createElement("div", {
+    }), "Account"))), onInterestClick && /*#__PURE__*/React__default.createElement("div", {
       className: "side-nav__menu-item"
     }, /*#__PURE__*/React__default.createElement("button", {
       type: "button",
@@ -17327,13 +17195,13 @@
         onDashboardClick = _ref.onDashboardClick,
         onContactUsClick = _ref.onContactUsClick,
         onOurStoryClick = _ref.onOurStoryClick,
-        onBlogClick = _ref.onBlogClick,
+        _ref$onBlogClick = _ref.onBlogClick,
+        onBlogClick = _ref$onBlogClick === void 0 ? undefined : _ref$onBlogClick,
         bugReportLink = _ref.bugReportLink,
         onSellToUsClick = _ref.onSellToUsClick,
         onLogoClick = _ref.onLogoClick,
         onLuxityShopClick = _ref.onLuxityShopClick,
         endpoint = _ref.endpoint,
-        menuData = _ref.menuData,
         initialSearchData = _ref.initialSearchData,
         onSearchSubmit = _ref.onSearchSubmit,
         onProductIdsReceived = _ref.onProductIdsReceived,
@@ -17355,7 +17223,8 @@
         tooltipContent = _ref.tooltipContent,
         LinkComponent = _ref.LinkComponent,
         shop = _ref.shop,
-        app = _ref.app;
+        app = _ref.app,
+        categoryConfig = _ref.categoryConfig;
 
     var _useSearch = useSearch({
       endpoint: endpoint,
@@ -17420,6 +17289,10 @@
     var handleChange = useSearchInputChange(setSearchValue, setIsSearchFocused, debouncedSearch, setSearchResults, setCachedResults);
     var handleKeyDown = useSearchInputKeyDown(searchValue, immediateSearch, setIsSearchFocused, setSearchValue);
     React.useMemo(function () {
+      if (!initialSearchData) {
+        return;
+      }
+
       fetchInitialSearchData(initialSearchData, setInitialSearchView);
     }, [initialSearchData, fetchInitialSearchData]);
     useSearchClickOutside(searchResultsRef, searchResults, setCachedResults, setIsSearchFocused, setSearchResults);
@@ -17524,10 +17397,9 @@
       return handleClick(onOurStoryClick);
     };
 
-    var handleBlogClick = function handleBlogClick() {
+    var handleBlogClick = onBlogClick ? function () {
       return handleClick(onBlogClick);
-    };
-
+    } : undefined;
     return /*#__PURE__*/React__default.createElement(React.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
       className: "navbar navbar__mobile-wrapper"
     }, /*#__PURE__*/React__default.createElement("div", {
@@ -17632,13 +17504,13 @@
       showSideNav: showSideNav,
       onMenuClick: onMenuClick,
       endpoint: endpoint,
-      menuData: menuData,
       currency: currency,
       currencyOptions: currencyOptions,
       onCurrencyChange: onCurrencyChange,
       isCurrencySelectionDisabled: isCurrencySelectionDisabled,
       tooltipContent: tooltipContent,
-      LinkComponent: LinkComponent
+      LinkComponent: LinkComponent,
+      categoryConfig: categoryConfig
     }), app && /*#__PURE__*/React__default.createElement(LuxityAppSideNav, {
       accordionIcon: accordionIcon,
       closeIcon: closeIcon,