Merge branch 'main' into wip/mobile

2 files changed, 45 insertions, 3 deletions

diff --git a/ui/routes/(app)/me/+page.svelte b/ui/routes/(app)/me/+page.svelte
new file mode 100644
index 0000000..7559dbe
--- /dev/null
+++ b/ui/routes/(app)/me/+page.svelte
@@ -0,0 +1,41 @@
+<script>
+	import { changePassword } from '$lib/apiServer.js';
+
+	import Invites from '$lib/components/Invites.svelte';
+
+	let currentPassword, newPassword, confirmPassword, passwordForm;
+	let pending = false;
+	$: valid = (newPassword === confirmPassword) && (newPassword !== currentPassword);
+	$: disabled = pending || !valid;
+
+	async function onPasswordChange() {
+		pending = true;
+		let response = await changePassword(currentPassword, newPassword);
+		switch (response.status) {
+			case 200:
+				passwordForm.reset();
+				break;
+		}
+		pending = false;
+	}
+</script>
+
+<form on:submit|preventDefault={onPasswordChange} bind:this={passwordForm} >
+	<label>current password
+		<input class="input" name="currentPassword" type="password" placeholder="password" bind:value={currentPassword}>
+	</label>
+
+	<label>new password
+		<input class="input" name="newPassword" type="password" placeholder="password" bind:value={newPassword}>
+	</label>
+
+	<label>confirm new password
+		<input class="input" name="confirmPassword" type="password" placeholder="password" bind:value={confirmPassword}>
+	</label>
+
+	<button class="btn variant-filled" type="submit" disabled={disabled}>
+		change password
+	</button>
+</form>
+
+<Invites />
diff --git a/ui/routes/+layout.svelte b/ui/routes/+layout.svelte
index b7ed746..4133ff3 100644
--- a/ui/routes/+layout.svelte
+++ b/ui/routes/+layout.svelte
@@ -1,12 +1,13 @@
 <script>
-    import { AppBar } from '@skeletonlabs/skeleton';
     import "../app.css";
-
     import logo from '$lib/assets/logo.png';
 
+    import { AppBar } from '@skeletonlabs/skeleton';
     import { showMenu, currentUser } from '$lib/store';
-    import LogOut from '$lib/components/LogOut.svelte';
+
+    import CurrentUser from '$lib/components/CurrentUser.svelte';
     import Invite from '$lib/components/Invite.svelte';
+    import LogOut from '$lib/components/LogOut.svelte';
 
     function toggleMenu() {
         showMenu.update((value) => !value);