PrestaShop · matthieu-rolland · Mar 6, 2023 · Jan 31, 2023
diff --git a/src/js/modules/facetedsearch/filter-handler.ts b/src/js/modules/facetedsearch/filter-handler.ts
@@ -3,31 +3,62 @@
  * file that was distributed with this source code.
  */
 import {API} from 'nouislider';
+import getQueryParameters from './urlparser';
 
 export default function (values: Array<string | number>, slider: API) {
   const {prestashop, Theme: {events}} = window;
 
-  const label = slider.target.dataset.sliderLabel;
-  const unit = slider.target.dataset.sliderUnit;
-  const encodedUrl = window.location.href;
-  const splittedUrl = encodedUrl.split('?');
-  let newUrl: string;
+  // Prepare query parameters
+  // eslint-disable-next-line
+  let queryParams = <any> [];
 
-  const searchParams = new URLSearchParams(splittedUrl[1]);
-  const params = searchParams.get('q');
+  // Get next encoded URL
+  const nextEncodedFacetsURL = <string> slider.target.dataset.sliderEncodedUrl;
 
-  if (params) {
-    let groups = params.split('/');
+  // Split it to URL and parameters part
+  const urlsSplitted = nextEncodedFacetsURL.split('?');
 
-    if (label) {
-      groups = groups.filter((e) => e.replace(label, '') === e);
-      groups.push(`${label}-${unit}-${values[0]}-${values[1]}`);
+  // Retrieve parameters if exists
+  if (urlsSplitted !== undefined && urlsSplitted.length > 1) {
+    queryParams = getQueryParameters(urlsSplitted[1]);
+  }
+
+  // Check if q param is present, add it if missing
+  let found = false;
+  // eslint-disable-next-line
+  queryParams.forEach((query: any) => {
+    if (query.name === 'q') {
+      found = true;
     }
+  });
 
-    newUrl = `${splittedUrl[0]}?q=${groups.join('/')}`;
-  } else {
-    newUrl = `${splittedUrl[0]}?q=${label}-${unit}-${values[0]}-${values[1]}`;
+  if (!found) {
+    queryParams.push({name: 'q', value: ''});
   }
 
+  // Update query parameter
+  // eslint-disable-next-line
+  queryParams.forEach((query: any) => {
+    if (query.name === 'q') {
+      // eslint-disable-next-line
+      query.value += [
+        query.value.length > 0 ? '/' : '',
+        slider.target.dataset.sliderLabel,
+        '-',
+        slider.target.dataset.sliderUnit,
+        '-',
+        values[0],
+        '-',
+        values[1],
+      ].join('');
+    }
+  });
+
+  const newUrl = [
+    urlsSplitted[0],
+    '?',
+    $.param(queryParams),
+  ].join('');
+
   prestashop.emit(events.updateFacets, newUrl);
 }
diff --git a/src/js/modules/facetedsearch/urlparser.ts b/src/js/modules/facetedsearch/urlparser.ts
@@ -0,0 +1,29 @@
+/**
+ * Copyright since 2007 PrestaShop SA and Contributors
+ * PrestaShop is an International Registered Trademark & Property of PrestaShop SA
+ *
+ * NOTICE OF LICENSE
+ *
+ * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
+ * that is bundled with this package in the file LICENSE.md.
+ * It is also available through the world-wide-web at this URL:
+ * https://opensource.org/licenses/AFL-3.0
+ * If you did not receive a copy of the license and are unable to
+ * obtain it through the world-wide-web, please send an email
+ * to license@prestashop.com so we can send you a copy immediately.
+ *
+ * @author    PrestaShop SA <contact@prestashop.com>
+ * @copyright Since 2007 PrestaShop SA and Contributors
+ * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
+ */
+
+const getQueryParameters = (params: string) => params.split('&').map((str) => {
+  const [key, val] = str.split('=');
+
+  return {
+    name: key,
+    value: decodeURIComponent(val).replace(/\+/g, ' '),
+  };
+});
+
+export default getQueryParameters;
diff --git a/templates/catalog/listing/search.tpl b/templates/catalog/listing/search.tpl
@@ -14,6 +14,14 @@
 
 {block name='product_list_header'}
   <h1 id="js-product-list-header" class="h4">
-    {if $listing.products|count}{l s='Search results for' d='Shop.Theme.Catalog'}{else}{l s='No search results for' d='Shop.Theme.Catalog'}{/if} "{$smarty.get.s}"
+    {if empty($smarty.get.s)}
+      {l s='Nothing to search for' d='Shop.Theme.Catalog'}
+    {else}
+      {if $listing.products|count}
+        {l s='Search results for' d='Shop.Theme.Catalog'}
+      {else}
+        {l s='No search results for' d='Shop.Theme.Catalog'}
+      {/if} "{$smarty.get.s}"
+    {/if}
   </h1>
 {/block}