Merge branch 'prop/global-state-at-top-level'

1 files changed, 8 insertions, 7 deletions

diff --git a/ui/lib/components/CreateChannelForm.svelte b/ui/lib/components/CreateChannelForm.svelte
index 85c85bb..471c2b7 100644
--- a/ui/lib/components/CreateChannelForm.svelte
+++ b/ui/lib/components/CreateChannelForm.svelte
@@ -1,21 +1,22 @@
 <script>
-  import { createChannel } from '$lib/apiServer';
+  let { createChannel = async (name) => {} } = $props();
 
   let name = $state('');
   let disabled = $state(false);
 
-  async function handleSubmit(event) {
+  async function onsubmit(event) {
     event.preventDefault();
     disabled = true;
-    const response = await createChannel(name);
-    if (200 <= response.status && response.status < 300) {
-      name = '';
+    try {
+      await createChannel(name);
+      event.target.reset();
+    } finally {
+      disabled = false;
     }
-    disabled = false;
   }
 </script>
 
-<form onsubmit={handleSubmit}>
+<form {onsubmit}>
   <input type="text" placeholder="create channel" bind:value={name} {disabled} />
   <button type="submit">&#x2795;</button>
 </form>