user onboarding

1 files changed, 14 insertions, 2 deletions

diff --git a/src/routes/(app)/settings/profile/+page.svelte b/src/routes/(app)/settings/profile/+page.svelte
index bee50d39..ec9855d0 100644
--- a/src/routes/(app)/settings/profile/+page.svelte
+++ b/src/routes/(app)/settings/profile/+page.svelte
@@ -3,16 +3,18 @@
   import { avatar, banner as bannerStore } from "$lib/store";
   import { t } from "$lib/translations";
   import { page } from "$app/stores";
+  import PasswordInput from "$comp/PasswordInput.svelte";
 
   let { data } = $props();
   let { user } = $derived(data);
   let { id } = user;
-  let { about, banner, picture, display, username } =
-    $state(user);
+  let { about, banner, picture, display, username } = $state(user);
 
   let avatarFile,
     avatarInput = $state(),
     bannerFile,
+    password = $state(),
+    revealPassword = $state(),
     bannerInput = $state();
 
   let selectAvatar = () => avatarInput.click();
@@ -64,6 +66,16 @@
   </div>
 </div>
 
+<input type="hidden" name="confirm" bind:value={password} />
+
+<div>
+  <label for="password" class="block font-bold block mb-1"
+    >{$t("user.settings.newPassword")}</label
+  >
+
+  <PasswordInput bind:value={password} placeholder="(Leave blank to keep unchanged)" />
+</div>
+
 <div>
   <label for="display" class="font-bold mb-1 block"
     >{$t("user.settings.displayName")}</label