<script>
    import useSettings from '$lib/useSettings.svelte.js';
    import {loading} from "$lib/stores.js";

    const settings = useSettings();
    let searchString = $state('');
    const {onsubmit = null} = $props();
    $effect(() => {
        searchString = settings.lastSearch
    });
</script>

<form class="flex flex-row gap-2"
      onsubmit={(e) => {
          e.preventDefault();
          settings.lastSearch = searchString;
          loading.set(true);
          onsubmit?.(searchString, true);
      }}>
    <input class="h-10 p-2" type="text" placeholder="tags" bind:value={searchString} />
    <button class="h-10 p-2 text-white bg-gray-600" type="submit">Search</button>
</form>