diff options
Diffstat (limited to 'ui/lib/components/MessageInput.svelte')
| -rw-r--r-- | ui/lib/components/MessageInput.svelte | 30 |
1 files changed, 14 insertions, 16 deletions
diff --git a/ui/lib/components/MessageInput.svelte b/ui/lib/components/MessageInput.svelte index b33574b..0da78d4 100644 --- a/ui/lib/components/MessageInput.svelte +++ b/ui/lib/components/MessageInput.svelte @@ -1,30 +1,28 @@ <script> import { tick } from 'svelte'; import { postToChannel } from '$lib/apiServer'; - import { activeChannel } from '$lib/store'; + export let channel = null; let input; let value; - let disabled; - activeChannel.subscribe((value) => { - disabled = !value.isSet(); - if (input && !disabled) { + let sending = false; + + $: disabled = (channel === null); + + async function handleSubmit() { + if (channel !== null) { + sending = true; + // TODO try/catch: + await postToChannel(channel, value); + sending = false; + value = ''; + await tick(); input.focus(); } - }); - - async function handleSubmit(event) { - disabled = true; - // TODO try/catch: - await postToChannel($activeChannel.get(), value); - value = ''; - disabled = false; - await tick(); - input.focus(); } </script> <form on:submit|preventDefault={handleSubmit} class="flex flex-row flex-nowrap"> - <input bind:this={input} bind:value={value} disabled={disabled} type="search" class="flex-auto h-6 input rounded-r-none" /> + <input bind:this={input} bind:value={value} disabled={sending || disabled} type="search" class="flex-auto h-6 input rounded-r-none" /> <button color="primary variant-filled-secondary" type="submit" class="flex-none w-6 h-6 btn-icon variant-filled rounded-l-none">»</button> </form> |
