App.svelte

<script lang="ts">
    import { onMount } from "svelte"

    import Tailwind from "./Tailwind.svelte"
    import FileList from "./components/file-search/FileList.svelte"
    import FileSearch from "./components/file-search/FileSearch.svelte"

    import files from "./store/files"

    let searching = false

    const handleKeyUp = (e: KeyboardEvent) => {
        if (e.key === "t" || e.key === "T") {
            searching = true
        }

        if (e.key === "Escape") {
            searching = false
        }
    }

    onMount(() => {
        document.addEventListener("keyup", handleKeyUp)

        return () => {
            document.removeEventListener("keyup", handleKeyUp)
        }
    })
</script>

<Tailwind />
<main>
    {#if searching}
        <FileSearch />
    {/if}
    <FileList files={$files} />
</main>