Remove active category in the cache key

- Update js logic;

Author: adifucan

lib/web/mage/menu.js

@@ -122,7 +122,7 @@ define([
             var currentUrl = window.location.href.split('?')[0];
 
             if (!this._setActiveMenuForCategory(currentUrl)) {
-                this._setActiveMenuForProduct(currentUrl);
+                this._setActiveMenuForProduct();
             }
         },
 
@@ -135,6 +135,9 @@ define([
          * @private
          */
         _setActiveMenuForCategory: function (url) {
+            // Clear active state from all categories
+            this._clearActiveState();
+
             var activeCategoryLink = this.element.find('a[href="' + url + '"]'),
                 classes,
                 classNav;
@@ -156,6 +159,19 @@ define([
             return true;
         },
 
+        /**
+         * Clears the active state from all menu items within the navigation element.
+         * It removes 'active' and 'has-active' classes from all list items (li elements),
+         * which are used to indicate the currently selected or parent of a selected item.
+         * This method is typically used to reset the menu's state before applying new active states.
+         *
+         * @return void
+         * @private
+         */
+        _clearActiveState: function () {
+            this.element.find('li').removeClass('active has-active');
+        },
+
         /**
          * Sets 'has-active' CSS class to all parent categories which have part of provided class in childClassName
          *
@@ -182,33 +198,46 @@ define([
         },
 
         /**
-         * Tries to retrieve category URL from current URL and mark this category as active
-         * @see _setActiveMenuForCategory(url)
-         *
-         * @example
-         *  currentUrl - http://magento.com/category1/category12/product.html,
-         *  category URLs has extensions .phtml - http://magento.com/category1.phtml
-         *  method sets active category which has URL http://magento.com/category1/category12.phtml
+         * Activates the category in the menu corresponding to the current product page.
+         * It resolves the category URL based on the referrer (if it's from the same domain),
+         * and then sets this category as active in the menu.
+         * If no suitable referrer URL is found, no category is set as active.
          *
-         * @param {String} currentUrl - current page URL without parameters
          * @return void
          * @private
          */
-        _setActiveMenuForProduct: function (currentUrl) {
-            var categoryUrlExtension,
-                lastUrlSection,
-                possibleCategoryUrl,
-                //retrieve first category URL to know what extension is used for category URLs
-                firstCategoryUrl = this.element.find('> li a').attr('href');
-
-            if (firstCategoryUrl) {
-                lastUrlSection = firstCategoryUrl.substr(firstCategoryUrl.lastIndexOf('/'));
-                categoryUrlExtension = lastUrlSection.lastIndexOf('.') !== -1 ?
-                    lastUrlSection.substr(lastUrlSection.lastIndexOf('.')) : '';
-
-                possibleCategoryUrl = currentUrl.substr(0, currentUrl.lastIndexOf('/')) + categoryUrlExtension;
-                this._setActiveMenuForCategory(possibleCategoryUrl);
+        _setActiveMenuForProduct: function () {
+            var categoryUrl = this._resolveCategoryUrl();
+
+            if (categoryUrl) {
+                this._setActiveMenuForCategory(categoryUrl);
+            }
+        },
+
+        /**
+         * Resolves the category URL based on the referrer URL.
+         * Checks if the referrer URL belongs to the same domain and is a likely category page.
+         * If so, returns the referrer URL after stripping any query parameters.
+         * Returns null if no suitable referrer is found or if it cannot be determined to be a category page.
+         *
+         * @return {String|null} The URL of the category, or null if it cannot be determined.
+         * @private
+         */
+        _resolveCategoryUrl: function () {
+            var categoryUrl = document.referrer;
+
+            // Ensure the referrer is from the same domain
+            if (categoryUrl && new URL(categoryUrl).hostname === window.location.hostname) {
+                // Remove any query parameters from the referrer URL
+                var queryParamIndex = categoryUrl.indexOf('?');
+                if (queryParamIndex > 0) {
+                    categoryUrl = categoryUrl.substring(0, queryParamIndex);
+                }
+                return categoryUrl;
             }
+
+            // Fallback or default behavior if no suitable referrer is found
+            return null;
         },
 
         /**