Added secret key to help users activate two-factor authentication

Author: FlorianLeChat

app/[locale]/settings/components/otp-validation.tsx

@@ -137,7 +137,13 @@ export default function OTPValidationModal( {
 								>
 									{chunks}
 								</a>
-							)
+							),
+							code: ( chunks ) => (
+								<code className="bg-destructive px-1 font-black text-white">
+									{chunks}
+								</code>
+							),
+							secret
 						} )}
 					</DialogDescription>
 				</DialogHeader>

locales/en.json

@@ -151,7 +151,7 @@
 		"otp_validation": {
 			"trigger": "Two-Factor Authentication Activation",
 			"title": "Two-Factor Authentication",
-			"description": "To further secure your account, you can enable two-factor authentication. <br></br>1. First, you need to scan the QR code above with a compatible application like <a1>Google Authenticator</a1> or <a2>Authy</a2>. <br></br>2. Once activated, please enter below the security code generated by your application to validate the two-factor authentication. <br></br>3. When two-factor authentication is validated, you will be prompted to save a backup code to disable two-factor authentication if you lose your phone.",
+			"description": "To further secure your account, you can enable two-factor authentication.<br></br><br></br>1. First, you need to scan the QR code above with a compatible application like <a1>Google Authenticator</a1> or <a2>Authy</a2>. <br></br>2. Once activated, please enter below the security code generated by your application to validate the two-factor authentication. <br></br>3. When two-factor authentication is validated, you will be prompted to save a backup code to disable two-factor authentication if you lose your phone. <br></br><br></br>If you have trouble scanning this QR code, you can manually enter the following secret key in your authentication application: <code>{secret}</code>.",
 			"close": "Enable Two-Factor Authentication"
 		},
 		"reset_password": {

locales/fr.json

@@ -151,7 +151,7 @@
 		"otp_validation": {
 			"trigger": "Activation de l'authentification à deux facteurs",
 			"title": "Authentification à deux facteurs",
-			"description": "Afin de sécuriser davantage votre compte, vous pouvez activer l'authentification à deux facteurs. <br></br>1. Tout d'abord, vous devez scanner le code QR ci-dessus avec une application compatible comme <a1>Google Authenticator</a1> ou <a2>Authy</a2>. <br></br>2. Une fois activée, veuillez saisir ci-dessous le code de sécurité généré par votre application pour valider la double authentification. <br></br>3. Lorsque la double authentification est validée, vous serez invité à sauvegarder un code de secours pour désactiver la double authentification si vous perdez votre téléphone.",
+			"description": "Afin de sécuriser davantage votre compte, vous pouvez activer l'authentification à deux facteurs.<br></br><br></br>1. Tout d'abord, vous devez scanner le code QR ci-dessus avec une application compatible comme <a1>Google Authenticator</a1> ou <a2>Authy</a2>. <br></br>2. Une fois activée, veuillez saisir ci-dessous le code de sécurité généré par votre application pour valider la double authentification. <br></br>3. Lorsque la double authentification est validée, vous serez invité à sauvegarder un code de secours pour désactiver la double authentification si vous perdez votre téléphone.<br></br><br></br>Si vous rencontrez des difficultés pour scanner le code QR, vous pouvez saisir manuellement la clé secrète suivante dans votre application d'authentification : <code>{secret}</code>.",
 			"close": "Activer l'authentification à deux facteurs"
 		},
 		"reset_password": {