<script lang="ts">
    let { roomId } = $props()

    let input = $state("")

    async function sendSong() {
        let resp = await fetch(`/api/addsong?room=${roomId}&query=${input}`, { method: "POST" })
        input = ""
    }
</script>

<div class="flex h-full w-full flex-row items-center gap-2 rounded border-2 border-black p-4">
    <input type="text" placeholder="Song & Artist" class="h-full w-3/4 rounded" bind:value={input} />
    <button class="w-1/4 rounded" onclick={sendSong}>Send</button>
</div>
