diff --git a/packages/lib/sdk/src/utils/svelte/useUrlParams.js b/packages/lib/sdk/src/utils/svelte/useUrlParams.js index 88af091790..2c97d1d39c 100644 --- a/packages/lib/sdk/src/utils/svelte/useUrlParams.js +++ b/packages/lib/sdk/src/utils/svelte/useUrlParams.js @@ -36,11 +36,6 @@ // } // } // } - -import { onMount } from 'svelte'; -import { get } from 'svelte/store'; -// @ts-expect-error -import { page } from '$app/stores'; // @ts-expect-error import { browser } from '$app/environment'; @@ -58,30 +53,33 @@ export function hydrateFromUrlParam(key, hydrate) { } } +/** @type {ReturnType} */ +let timeout; /** * Updates the URL search parameter. * @param {string} key * @param {string | null} value */ -export function updateUrlParam(key, value) { +export function updateUrlParam(key, value, debounceDelay = null) { if (browser) { const url = new URL(window.location.href); - // if (!url.searchParams.has(key) && value) { - // url.searchParams.append(key, value); - // } else if (value) { - // url.searchParams.set(key, value); - // } else { - // url.searchParams.delete(key); - // } + const updateUrl = () => { + if (value !== null) { + url.searchParams.set(key, encodeUrlValue(value)); + } else { + url.searchParams.delete(key); + } - if (value !== null) { - url.searchParams.set(key, encodeUrlValue(value)); + history.replaceState(null, '', `?${url.searchParams.toString()}`); + }; + + if (debounceDelay !== null) { + clearTimeout(timeout); + timeout = setTimeout(updateUrl, debounceDelay); } else { - url.searchParams.delete(key); + updateUrl(); } - - history.replaceState(null, '', `?${url.searchParams.toString()}`); } } diff --git a/packages/ui/core-components/src/lib/atoms/inputs/slider/_Slider.svelte b/packages/ui/core-components/src/lib/atoms/inputs/slider/_Slider.svelte index d84fab4996..f5b1ea6e3b 100644 --- a/packages/ui/core-components/src/lib/atoms/inputs/slider/_Slider.svelte +++ b/packages/ui/core-components/src/lib/atoms/inputs/slider/_Slider.svelte @@ -4,8 +4,6 @@