From 05d0872f639ca7f77c28d39f3d7298f3538aa366 Mon Sep 17 00:00:00 2001
From: secondl1ght <85003930+secondl1ght@users.noreply.github.com>
Date: Wed, 31 Aug 2022 19:55:02 -0400
Subject: 2FA setting bug fix and refactor

---
 src/locales/en.json                             |  4 +-
 src/routes/[username]/settings/_pos.svelte      |  2 +-
 src/routes/[username]/settings/_security.svelte | 66 +++++++++++--------------
 3 files changed, 31 insertions(+), 41 deletions(-)

(limited to 'src')

diff --git a/src/locales/en.json b/src/locales/en.json
index 76b93303..a1688524 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -146,8 +146,8 @@
 			"showQR": "Show QR"
 		},
 		"settings": {
-      "oneTimeCode": "Enter one-time code",
-      "accountId": "Account Secret",
+			"oneTimeCode": "Enter one-time code",
+			"accountId": "Account Secret",
 			"header": "Settings",
 			"ACCOUNT": "ACCOUNT",
 			"POINT_OF_SALE": "POINT OF SALE",
diff --git a/src/routes/[username]/settings/_pos.svelte b/src/routes/[username]/settings/_pos.svelte
index 03f45771..1df2307b 100644
--- a/src/routes/[username]/settings/_pos.svelte
+++ b/src/routes/[username]/settings/_pos.svelte
@@ -28,7 +28,7 @@
 
 <div>
 	<label for="unit" class="font-bold block mb-1">{$t('user.settings.btcUnit')}</label>
-  <select name="unit" class="block py-3 w-full" bind:value={$user.unit}>
+	<select name="unit" class="block py-3 w-full" bind:value={$user.unit}>
 		<option value="SAT">{$t('user.settings.satoshis')} (SAT)</option>
 		<option value="BTC">{$t('user.settings.bitcoin')} (BTC)</option>
 	</select>
diff --git a/src/routes/[username]/settings/_security.svelte b/src/routes/[username]/settings/_security.svelte
index 0c5c7aa3..481f8b2c 100644
--- a/src/routes/[username]/settings/_security.svelte
+++ b/src/routes/[username]/settings/_security.svelte
@@ -31,7 +31,7 @@
 		try {
 			if (setting2fa && token.length === 6) {
 				await put('/enable2fa', { token });
-				success('2fa enabled');
+				success('2FA enabled');
 				$user.twofa = 1;
 				toggleEnabling();
 			}
@@ -45,7 +45,7 @@
 		try {
 			if (disabling2fa && token.length === 6) {
 				await put('/disable2fa', { token });
-				success('2fa disabled');
+				success('2FA disabled');
 				$user.twofa = 0;
 				toggleDisabling();
 			}
@@ -97,6 +97,10 @@
 </div>
 
 <div>
+	<span class="font-bold mb-1">{$t('user.settings.twofa')}</span>
+	<p class="text-secondary mb-4">
+		{$t('user.settings.twofaDescription')}
+	</p>
 	{#if setting2fa}
 		<a href={otpUri}>
 			<Qr text={otpUri} />
@@ -119,41 +123,27 @@
 			</Pincode>
 		</div>
 	{:else if disabling2fa}
-		{$t('user.settings.oneTimeCode')}<br />
-		<Pincode bind:code bind:value={token} bind:this={tokenInput}>
-			<PincodeInput />
-			<PincodeInput />
-			<PincodeInput />
-			<PincodeInput />
-			<PincodeInput />
-			<PincodeInput />
-		</Pincode>
-	{:else}
-		<span class="font-bold mb-1">{$t('user.settings.twofa')}</span>
-		<p class="text-secondary mb-1">
-			{$t('user.settings.twofaDescription')}
-		</p>
-		{#if $user.twofa}
-			<button type="button" class="primary" on:click={toggleDisabling}>
-				<Icon icon="mobile" style="mr-1" />
-				{$t('user.settings.twofaDisable')}
-			</button>
-		{:else}
-			<span class="font-bold mb-1">{$t('user.settings.twofa')}</span>
-			<p class="text-secondary mb-1">
-				{$t('user.settings.twofaDescription')}
-			</p>
-			{#if $user.twofa}
-				<button type="button" class="primary" on:click={toggleDisabling}>
-					<Icon icon="mobile" style="mr-1" />
-					{$t('user.settings.twofaDisable')}
-				</button>
-			{:else}
-				<button type="button" class="primary" on:click={toggleEnabling}>
-					<Icon icon="mobile" style="mr-1" />
-					{$t('user.settings.twofaSetup')}
-				</button>
-			{/if}
-		{/if}
+		<div class="text-center my-4">
+			{$t('user.settings.oneTimeCode')}<br />
+			<Pincode bind:code bind:value={token} bind:this={tokenInput}>
+				<PincodeInput />
+				<PincodeInput />
+				<PincodeInput />
+				<PincodeInput />
+				<PincodeInput />
+				<PincodeInput />
+			</Pincode>
+		</div>
+	{/if}
+	{#if $user.twofa && !disabling2fa && !setting2fa}
+		<button type="button" class="primary" on:click={toggleDisabling}>
+			<Icon icon="mobile" style="mr-1" />
+			{$t('user.settings.twofaDisable')}
+		</button>
+	{:else if !$user.twofa && !disabling2fa && !setting2fa}
+		<button type="button" class="primary" on:click={toggleEnabling}>
+			<Icon icon="mobile" style="mr-1" />
+			{$t('user.settings.twofaSetup')}
+		</button>
 	{/if}
 </div>
-- 
cgit v1.2.3