From 33d486b16080edfb745349a23e0712e8ef223b60 Mon Sep 17 00:00:00 2001
From: sean-brydon <55134778+sean-brydon@users.noreply.github.com>
Date: Fri, 29 Apr 2022 18:28:34 +0100
Subject: [PATCH] Enable Autocomplete (#2645)
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
---
apps/web/components/auth/TwoFactor.tsx | 11 +++++++++--
apps/web/components/security/EnableTwoFactorModal.tsx | 1 +
2 files changed, 10 insertions(+), 2 deletions(-)
diff --git a/apps/web/components/auth/TwoFactor.tsx b/apps/web/components/auth/TwoFactor.tsx
index dab53579..28a5627f 100644
--- a/apps/web/components/auth/TwoFactor.tsx
+++ b/apps/web/components/auth/TwoFactor.tsx
@@ -29,8 +29,15 @@ export default function TwoFactor() {
<div className="mx-auto !mt-0 max-w-sm">
<p className="mb-4 text-sm text-gray-500">{t("2fa_enabled_instructions")}</p>
<input hidden type="hidden" value={value} {...methods.register("totpCode")} />
- <div className="flex flex-row space-x-1">
- <Input className={className} name="2fa1" inputMode="decimal" {...digits[0]} autoFocus />
+ <div className="flex flex-row justify-between">
+ <Input
+ className={className}
+ name="2fa1"
+ inputMode="decimal"
+ {...digits[0]}
+ autoFocus
+ autoComplete="one-time-code"
+ />
<Input className={className} name="2fa2" inputMode="decimal" {...digits[1]} />
<Input className={className} name="2fa3" inputMode="decimal" {...digits[2]} />
<Input className={className} name="2fa4" inputMode="decimal" {...digits[3]} />
diff --git a/apps/web/components/security/EnableTwoFactorModal.tsx b/apps/web/components/security/EnableTwoFactorModal.tsx
index 4c613123..e0cf227e 100644
--- a/apps/web/components/security/EnableTwoFactorModal.tsx
+++ b/apps/web/components/security/EnableTwoFactorModal.tsx
@@ -173,6 +173,7 @@ const EnableTwoFactorModal = ({ onEnable, onCancel }: EnableTwoFactorModalProps)
inputMode="numeric"
onInput={(e) => setTotpCode(e.currentTarget.value)}
className="block w-full rounded-sm border-gray-300 shadow-sm sm:text-sm"
+ autoComplete="one-time-code"
/>
</div>