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

3 files changed, 12 insertions, 42 deletions

diff --git a/ui/routes/(login)/invite/[invite]/+page.svelte b/ui/routes/(login)/invite/[invite]/+page.svelte
index 0c01286..04341e5 100644
--- a/ui/routes/(login)/invite/[invite]/+page.svelte
+++ b/ui/routes/(login)/invite/[invite]/+page.svelte
@@ -1,26 +1,16 @@
 <script>
   import { goto } from '$app/navigation';
-  import { acceptInvite } from '$lib/apiServer';
+  import * as api from '$lib/apiServer';
 
   import LogIn from '$lib/components/LogIn.svelte';
 
   let { data } = $props();
 
-  let username = $state(''),
-    password = $state('');
-  let pending = false;
-  let disabled = $derived(pending);
-
-  async function onSubmit(event, inviteId) {
-    event.preventDefault();
-    pending = true;
-    const response = await acceptInvite(inviteId, username, password);
+  async function acceptInvite(inviteId, username, password) {
+    const response = await api.acceptInvite(inviteId, username, password);
     if (200 <= response.status && response.status < 300) {
-      username = '';
-      password = '';
       await goto('/');
     }
-    pending = false;
   }
 </script>
 
@@ -32,5 +22,5 @@
   <div class="invite-text">
     <p>Hi there! {invite.issuer} invites you to the conversation.</p>
   </div>
-  <LogIn {disabled} bind:username bind:password onsubmit={(event) => onSubmit(event, invite.id)} />
+  <LogIn logIn={async (username, password) => acceptInvite(invite.id, username, password)} />
 {/await}
diff --git a/ui/routes/(login)/login/+page.svelte b/ui/routes/(login)/login/+page.svelte
index 9157cef..b1f7cf2 100644
--- a/ui/routes/(login)/login/+page.svelte
+++ b/ui/routes/(login)/login/+page.svelte
@@ -1,25 +1,15 @@
 <script>
   import { goto } from '$app/navigation';
-  import { logIn } from '$lib/apiServer';
+  import * as api from '$lib/apiServer';
 
   import LogIn from '$lib/components/LogIn.svelte';
 
-  let username = '',
-    password = '';
-  let pending = false;
-  $: disabled = pending;
-
-  async function onSubmit(event) {
-    event.preventDefault();
-    pending = true;
-    const response = await logIn(username, password);
+  async function logIn(username, password) {
+    const response = await api.logIn(username, password);
     if (200 <= response.status && response.status < 300) {
-      username = '';
-      password = '';
       await goto('/');
     }
-    pending = false;
   }
 </script>
 
-<LogIn {disabled} bind:username bind:password onsubmit={onSubmit} />
+<LogIn {logIn} />
diff --git a/ui/routes/(login)/setup/+page.svelte b/ui/routes/(login)/setup/+page.svelte
index c63f198..0b5a824 100644
--- a/ui/routes/(login)/setup/+page.svelte
+++ b/ui/routes/(login)/setup/+page.svelte
@@ -1,25 +1,15 @@
 <script>
   import { goto } from '$app/navigation';
-  import { setup } from '$lib/apiServer';
+  import * as api from '$lib/apiServer';
 
   import LogIn from '$lib/components/LogIn.svelte';
 
-  let username = $state(''),
-    password = $state('');
-  let pending = false;
-  let disabled = $derived(pending);
-
-  async function onSubmit(event) {
-    event.preventDefault();
-    pending = true;
-    const response = await setup(username, password);
+  async function logIn(username, password) {
+    const response = await api.setup(username, password);
     if (200 <= response.status && response.status < 300) {
-      username = '';
-      password = '';
       await goto('/');
     }
-    pending = false;
   }
 </script>
 
-<LogIn {disabled} bind:username bind:password legend="set up" onsubmit={onSubmit} />
+<LogIn legend="set up" {logIn} />