diff --git a/src/lib/stores/icao.ts b/src/lib/stores/icao.ts new file mode 100644 index 0000000..8da2fcf --- /dev/null +++ b/src/lib/stores/icao.ts @@ -0,0 +1,3 @@ +import { writable } from 'svelte/store'; + +export const icao = writable(''); \ No newline at end of file diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte index d40dba1..71ec0da 100644 --- a/src/routes/+layout.svelte +++ b/src/routes/+layout.svelte @@ -5,33 +5,21 @@ import Section from '$lib/components/Section.svelte'; import Card from '$lib/components/Cards/Card.svelte'; - import { goto } from '$app/navigation'; + import { icao } from '$lib/stores/icao'; + + let icaoInput = $state(''); - // ICAO input state handler - let icao = $state(''); $effect(() => { - const params = new URLSearchParams(); - - if (icao.length === 4) { - // If the ICAO code is exactly 4 characters long, add it to the URL parameters - if (icao) params.set('icao', icao); - - // This will trigger a navigation and reload the page data from the server - goto(`?${params.toString()}`, { - keepFocus: true, - replaceState: true, - noScroll: true - }); + // Watch for changes to icaoInput and update the store if exactly 4 chars + if (icaoInput.length === 4) { + icao.set(icaoInput); } else { - // Otherwise, clear the parameter - goto(`?${params.toString()}`, { - keepFocus: true, - replaceState: true, - noScroll: true - }); + icao.set(''); } }); + + let { children } = $props(); @@ -71,7 +59,7 @@ maxlength="4" required placeholder="EGKK" - bind:value={icao} + bind:value={icaoInput} /> diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 1b1216a..9941a42 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -4,14 +4,9 @@ import { toasts } from 'svelte-toasts'; import Loading from '$lib/components/Loading.svelte'; - import { page } from '$app/stores'; - import { derived } from 'svelte/store'; - - // Get the ICAO parameter from the URL - const icao = derived(page, ($page) => $page.url.searchParams.get('icao')); + import { icao } from '$lib/stores/icao'; -
{toasts.add({ title: 'Welcome',