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

1 files changed, 11 insertions, 13 deletions

diff --git a/ui/lib/components/ChangePassword.svelte b/ui/lib/components/ChangePassword.svelte
index bf94ea7..742d4f1 100644
--- a/ui/lib/components/ChangePassword.svelte
+++ b/ui/lib/components/ChangePassword.svelte
@@ -1,28 +1,26 @@
 <script>
-  import { changePassword } from '$lib/apiServer.js';
+  let { changePassword = async (currentPassword, newPassword) => {} } = $props();
 
-  let currentPassword = $state(''),
-    newPassword = $state(''),
-    confirmPassword = $state(''),
-    pending = $state(false),
-    form;
+  let currentPassword = $state('');
+  let newPassword = $state('');
+  let confirmPassword = $state('');
+  let pending = $state(false);
   let valid = $derived(newPassword === confirmPassword && newPassword !== currentPassword);
   let disabled = $derived(pending || !valid);
 
   async function onsubmit(event) {
     event.preventDefault();
     pending = true;
-    let response = await changePassword(currentPassword, newPassword);
-    switch (response.status) {
-      case 200:
-        form.reset();
-        break;
+    try {
+      await changePassword(currentPassword, newPassword);
+      event.target.reset();
+    } finally {
+      pending = false;
     }
-    pending = false;
   }
 </script>
 
-<form class="form" {onsubmit} bind:this={form}>
+<form class="form" {onsubmit}>
   <label
     >current password
     <input