From f243166cace28340ab9ad6b6133d8ae3b6645797 Mon Sep 17 00:00:00 2001
From: John Barratt <johnnybarratt@gmail.com>
Date: Wed, 15 Feb 2023 12:36:26 -0800
Subject: add send confirmation buttons for email and phone fields

---
 .../(app)/[username]/settings/[...tab]/_account.svelte | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

(limited to 'src')

diff --git a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
index 146ca93c..661ec7d8 100644
--- a/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
+++ b/src/routes/(app)/[username]/settings/[...tab]/_account.svelte
@@ -23,6 +23,14 @@
 		$colorTheme = colors.color1 + ' ' + colors.color2;
 	};
 
+	let handleConfirmEmailClick = (email) => {
+		console.log("CLICKED", email)
+	}
+
+	let handleConfirmPhoneClick = (phone) => {
+		console.log("CLICKED", phone)
+	}
+
 	let selectAvatar = () => avatarInput.click();
 	let selectBanner = () => bannerInput.click();
 
@@ -80,12 +88,18 @@
 
 <div>
 	<label for="email" class="font-bold mb-1 block">{$t('user.settings.email')}</label>
-	<input type="text" name="email" bind:value={user.email} />
+	<div class="flex flex-row">
+		<input type="text" name="email" bind:value={user.email} />
+		<button type="button" class="border-2 border-black rounded-xl font-semibold ml-3.5 mx-auto p-1 hover:opacity-80" on:click={() => handleConfirmEmailClick(user.email)}>confirm your email</button>
+	</div>
 </div>
 
 <div>
 	<label for="phone" class="font-bold mb-1 block">{$t('user.settings.phone')}</label>
-	<input type="tel" name="phone" bind:value={user.phone} />
+	<div class="flex flex-row">
+		<input type="tel" name="phone" bind:value={user.phone} />
+		<button type="button" class="border-2 border-black rounded-xl font-semibold ml-3.5 mx-auto p-1 hover:opacity-80" on:click={() => handleConfirmPhoneClick(user.phone)}>confirm your number</button>
+	</div>
 </div>
 
 <div>
-- 
cgit v1.2.3