From 79f7d04a3b814fb6872a99d8734c672c5d86062c Mon Sep 17 00:00:00 2001
From: ItzNotABug <itznotabug@gmail.com>
Date: Tue, 20 Aug 2024 17:56:14 +0530
Subject: [PATCH 1/3] update: invalidate factors on email change.

---
 src/routes/console/account/updateEmail.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/routes/console/account/updateEmail.svelte b/src/routes/console/account/updateEmail.svelte
index d929e4e35..51904d3f2 100644
--- a/src/routes/console/account/updateEmail.svelte
+++ b/src/routes/console/account/updateEmail.svelte
@@ -19,7 +19,7 @@
     async function updateEmail() {
         try {
             await sdk.forConsole.account.updateEmail(email, emailPassword);
-            await invalidate(Dependencies.ACCOUNT);
+            await Promise.all([invalidate(Dependencies.ACCOUNT), invalidate(Dependencies.FACTORS)]);
             addNotification({
                 message: 'Email has been updated',
                 type: 'success'

From 9c9c5ee5561dc99211298a177942e50d49b4ba7e Mon Sep 17 00:00:00 2001
From: ItzNotABug <itznotabug@gmail.com>
Date: Tue, 20 Aug 2024 17:57:00 +0530
Subject: [PATCH 2/3] add: email update flow for MFA.

---
 src/routes/console/account/updateMfa.svelte | 79 ++++++++++++++++++++-
 1 file changed, 77 insertions(+), 2 deletions(-)

diff --git a/src/routes/console/account/updateMfa.svelte b/src/routes/console/account/updateMfa.svelte
index 86e8eccca..ab73f2469 100644
--- a/src/routes/console/account/updateMfa.svelte
+++ b/src/routes/console/account/updateMfa.svelte
@@ -14,6 +14,8 @@
     import type { Models } from '@appwrite.io/console';
     import MfaRegenerateCodes from './mfaRegenerateCodes.svelte';
     import { Pill } from '$lib/elements';
+    import { page } from '$app/stores';
+    import { onMount } from 'svelte';
 
     let showSetup: boolean = false;
     let showDelete: boolean = false;
@@ -26,6 +28,53 @@
         .map(([factor, _]) => factor);
     $: enabledMethods = enabledFactors.filter((factor) => factor !== 'recoveryCode');
 
+    $: cleanUrl = $page.url.origin + $page.url.pathname;
+
+    let creatingVerification = false;
+
+    async function createVerification() {
+        creatingVerification = true;
+
+        try {
+            await sdk.forConsole.account.createVerification(cleanUrl);
+            addNotification({
+                message: 'Verification email has been sent',
+                type: 'success'
+            });
+        } catch (error) {
+            addNotification({
+                message: error.message,
+                type: 'error'
+            });
+        } finally {
+            creatingVerification = false;
+        }
+    }
+
+    async function updateEmailVerification() {
+        const searchParams = $page.url.searchParams;
+        const userId = searchParams.get('userId');
+        const secret = searchParams.get('secret');
+
+        history.replaceState(null, '', cleanUrl);
+
+        if (userId && secret) {
+            try {
+                await sdk.forConsole.account.updateVerification(userId, secret);
+                addNotification({
+                    message: 'Email verified successfully',
+                    type: 'success'
+                });
+                await Promise.all([invalidate(Dependencies.ACCOUNT), invalidate(Dependencies.FACTORS)]);
+            } catch (error) {
+                addNotification({
+                    message: error.message,
+                    type: 'error'
+                });
+            }
+        }
+    }
+
     async function updateMfa() {
         try {
             await sdk.forConsole.account.updateMFA(!$user.mfa);
@@ -77,6 +126,10 @@
     $: if (!showRecoveryCodes) {
         codes = null;
     }
+
+    onMount(() => {
+        updateEmailVerification();
+    });
 </script>
 
 <CardGrid>
@@ -109,7 +162,7 @@
                     <div
                         class="method u-flex u-flex-vertical-mobile u-gap-16 u-main-space-between u-sep-block-end"
                         style="padding-block-end: 16px">
-                        <div class="u-flex u-gap-8">
+                        <div class="u-flex u-gap-8 u-cross-baseline">
                             <div class="avatar is-size-x-small">
                                 <span class="icon-device-mobile" aria-hidden="true" />
                             </div>
@@ -154,13 +207,35 @@
                                 </div>
                             </div>
                         </div>
+
+                    {:else if !$user.emailVerification}
+                        <div
+                            class="u-flex u-main-space-between u-sep-block-end"
+                            style="padding-block-end: 16px">
+                            <div class="u-flex u-gap-8 u-cross-baseline">
+                                <div class="avatar is-size-x-small">
+                                    <span class="icon-mail" aria-hidden="true" />
+                                </div>
+                                <div class="u-flex-vertical u-gap-4">
+                                    <div class="u-flex u-gap-4 u-cross-center">
+                                        <span class="body-text-2 u-bold">Email</span>
+                                        <Pill>unverified</Pill>
+                                    </div>
+                                    <span>Verify your email to receive login MFA codes.</span>
+                                </div>
+                            </div>
+                            <Button
+                                secondary
+                                disabled={creatingVerification}
+                                on:click={() => createVerification()}>Verify</Button>
+                        </div>
                     {/if}
 
                     {#if $factors.phone}
                         <div
                             class="u-flex u-main-space-between u-sep-block-end"
                             style="padding-block-end: 16px">
-                            <div class="u-flex u-gap-8">
+                            <div class="u-flex u-gap-8 u-cross-baseline">
                                 <div class="avatar is-size-x-small">
                                     <span class="icon-send" aria-hidden="true" />
                                 </div>

From 452923d977c40bdd8c77561c40c372fe1b93f764 Mon Sep 17 00:00:00 2001
From: ItzNotABug <itznotabug@gmail.com>
Date: Tue, 20 Aug 2024 17:58:20 +0530
Subject: [PATCH 3/3] ran: `npm run format`.

---
 src/routes/console/account/updateMfa.svelte | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/routes/console/account/updateMfa.svelte b/src/routes/console/account/updateMfa.svelte
index ab73f2469..b2b6763ea 100644
--- a/src/routes/console/account/updateMfa.svelte
+++ b/src/routes/console/account/updateMfa.svelte
@@ -65,7 +65,10 @@
                     message: 'Email verified successfully',
                     type: 'success'
                 });
-                await Promise.all([invalidate(Dependencies.ACCOUNT), invalidate(Dependencies.FACTORS)]);
+                await Promise.all([
+                    invalidate(Dependencies.ACCOUNT),
+                    invalidate(Dependencies.FACTORS)
+                ]);
             } catch (error) {
                 addNotification({
                     message: error.message,
@@ -207,7 +210,6 @@
                                 </div>
                             </div>
                         </div>
-
                     {:else if !$user.emailVerification}
                         <div
                             class="u-flex u-main-space-between u-sep-block-end"