Recovery phrase page setup (#3451)

* Setup recovery-phrase route

* Setup recovery-phrase route

* CR changes

* Move on enter and space

* Rename

* Do not use tabindex

* Remove unnecessary code

* Use event.code for space

Author: lmuntaner

src/frontend/src/lib/locales/de.po

@@ -53,7 +53,7 @@ msgstr "<0>Keine Identitätsnummern mehr:</0> Wie oben erklärt, bedeuten entdec
 msgid "<0>Seamless Passkey Integration:</0> We continue to embrace passkeys as the future of secure authentication. Internet Identity 2.0 leverages the latest passkey standards for enhanced security and ease of use."
 msgstr "<0>Nahtlose Passkey-Integration:</0> Wir setzen weiterhin auf Passkeys als die Zukunft sicherer Authentifizierung. Internet Identity 2.0 nutzt die neuesten Passkey-Standards für erhöhte Sicherheit und Benutzerfreundlichkeit."
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:207
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:156
 #: src/frontend/src/routes/(new-styling)/manage/(authenticated)/access/+page.svelte:8
 msgid "Access methods"
 msgstr ""
@@ -94,6 +94,10 @@ msgstr "Wenn Sie diese Funktion aktivieren, können Sie mehr als ein Konto für
 msgid "Can't find your identity?"
 msgstr "Finden Sie Ihre Identität nicht?"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:63
+msgid "Cancel"
+msgstr ""
+
 #: src/frontend/src/lib/components/wizards/auth/views/SolveCaptcha.svelte:61
 msgid "CAPTCHA characters"
 msgstr "CAPTCHA-Zeichen"
@@ -112,19 +116,23 @@ msgstr "Identität auswählen, um fortzufahren"
 
 #: src/frontend/src/routes/(new-styling)/authorize/+layout.svelte:146
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:168
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:148
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:260
 msgid "choose method"
 msgstr "Methode auswählen"
 
 #: src/frontend/src/routes/(new-styling)/authorize/(panel)/+page.svelte:41
 msgid "Choose method"
 msgstr "Methode auswählen"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:60
+msgid "Clear all"
+msgstr ""
+
 #: src/frontend/src/lib/components/ui/IdentitySwitcher.svelte:52
 msgid "Close"
 msgstr "Schließen"
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:175
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:124
 msgid "Close menu"
 msgstr ""
 
@@ -243,6 +251,10 @@ msgstr "Mehrere Konten aktivieren"
 msgid "Enter characters"
 msgstr "Zeichen eingeben"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:34
+msgid "Enter your recovery phrase words in each box, spelled correctly and in order."
+msgstr ""
+
 #: src/frontend/src/routes/(new-styling)/+page.svelte:190
 msgid "Everything you need to know about Internet Identity, your private, secure, and easy way to log in to apps on the Internet Computer."
 msgstr "Alles, was Sie über Internet Identity wissen müssen – Ihre private, sichere und einfache Möglichkeit, sich bei Apps auf dem Internet Computer anzumelden."
@@ -297,7 +309,7 @@ msgstr "Zur App gehen - (<0>{countdown}</0>)"
 msgid "Help & FAQ"
 msgstr "Hilfe & FAQ"
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:198
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:147
 msgid "Home"
 msgstr ""
 
@@ -518,7 +530,7 @@ msgstr "Nein. Ihr Face ID oder Fingerabdruck wird nur verwendet, um Ihren Passke
 msgid "Only enter the code from that device if you initiated this process <0>yourself</0>."
 msgstr "Geben Sie den Code von diesem Gerät nur ein, wenn Sie diesen Vorgang <0>selbst</0> gestartet haben."
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:255
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:204
 msgid "Open menu"
 msgstr ""
 
@@ -605,6 +617,10 @@ msgstr "Scannen Sie den obigen QR-Code mit Ihrem <0>neuen Gerät</0> oder geben
 msgid "Seamless Access"
 msgstr "Nahtloser Zugriff"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:31
+msgid "Secure recovery"
+msgstr ""
+
 #: src/frontend/src/routes/(new-styling)/unsupported/+page.svelte:38
 msgid "Select <0>Open in Safari</0> or <1>Open in Chrome</1>."
 msgstr "Wählen Sie <0>In Safari öffnen</0> oder <1>In Chrome öffnen</1>."
@@ -613,6 +629,10 @@ msgstr "Wählen Sie <0>In Safari öffnen</0> oder <1>In Chrome öffnen</1>."
 msgid "Set as default sign-in"
 msgstr "Als Standardanmeldung festlegen"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:59
+msgid "Show all"
+msgstr ""
+
 #: src/frontend/src/routes/(new-styling)/authorize/(panel)/continue/+page.svelte:364
 msgid "Sign in"
 msgstr "Anmelden"
@@ -651,7 +671,7 @@ msgid "Something went wrong during authentication. Authenticating service was no
 msgstr "Fehler bei der Authentifizierung. Der Dienst wurde informiert. Sie können diese Seite schließen."
 
 #: src/frontend/src/lib/components/layout/Footer.svelte:34
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:224
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:173
 msgid "Source code"
 msgstr "Quellcode"
 
@@ -664,12 +684,12 @@ msgid "Still have an identity number?"
 msgstr "Haben Sie noch eine Identitätsnummer?"
 
 #: src/frontend/src/lib/components/layout/Footer.svelte:26
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:218
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:167
 msgid "Support"
 msgstr "Support"
 
 #: src/frontend/src/lib/components/ui/IdentitySwitcher.svelte:44
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:244
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:193
 msgid "Switch identity"
 msgstr "Identität wechseln"
 
@@ -777,7 +797,7 @@ msgstr "Nutzen Sie ein Gerät mit Ihrer Identität, um die URL zu scannen oder z
 #: src/frontend/src/routes/(new-styling)/authorize/+layout.svelte:143
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:142
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:165
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:145
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:257
 msgid "Use another identity"
 msgstr "Andere Identität verwenden"
 

src/frontend/src/lib/locales/en.po

@@ -53,7 +53,7 @@ msgstr "<0>No More Identity Numbers:</0> As explained above, discoverable passke
 msgid "<0>Seamless Passkey Integration:</0> We continue to embrace passkeys as the future of secure authentication. Internet Identity 2.0 leverages the latest passkey standards for enhanced security and ease of use."
 msgstr "<0>Seamless Passkey Integration:</0> We continue to embrace passkeys as the future of secure authentication. Internet Identity 2.0 leverages the latest passkey standards for enhanced security and ease of use."
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:207
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:156
 #: src/frontend/src/routes/(new-styling)/manage/(authenticated)/access/+page.svelte:8
 msgid "Access methods"
 msgstr "Access methods"
@@ -94,6 +94,10 @@ msgstr "By enabling this feature, you can create more than one account for a sin
 msgid "Can't find your identity?"
 msgstr "Can't find your identity?"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:63
+msgid "Cancel"
+msgstr "Cancel"
+
 #: src/frontend/src/lib/components/wizards/auth/views/SolveCaptcha.svelte:61
 msgid "CAPTCHA characters"
 msgstr "CAPTCHA characters"
@@ -112,19 +116,23 @@ msgstr "choose identity to continue"
 
 #: src/frontend/src/routes/(new-styling)/authorize/+layout.svelte:146
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:168
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:148
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:260
 msgid "choose method"
 msgstr "choose method"
 
 #: src/frontend/src/routes/(new-styling)/authorize/(panel)/+page.svelte:41
 msgid "Choose method"
 msgstr "Choose method"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:60
+msgid "Clear all"
+msgstr "Clear all"
+
 #: src/frontend/src/lib/components/ui/IdentitySwitcher.svelte:52
 msgid "Close"
 msgstr "Close"
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:175
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:124
 msgid "Close menu"
 msgstr "Close menu"
 
@@ -243,6 +251,10 @@ msgstr "Enable multiple accounts"
 msgid "Enter characters"
 msgstr "Enter characters"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:34
+msgid "Enter your recovery phrase words in each box, spelled correctly and in order."
+msgstr "Enter your recovery phrase words in each box, spelled correctly and in order."
+
 #: src/frontend/src/routes/(new-styling)/+page.svelte:190
 msgid "Everything you need to know about Internet Identity, your private, secure, and easy way to log in to apps on the Internet Computer."
 msgstr "Everything you need to know about Internet Identity, your private, secure, and easy way to log in to apps on the Internet Computer."
@@ -297,7 +309,7 @@ msgstr "Go to the app - (<0>{countdown}</0>)"
 msgid "Help & FAQ"
 msgstr "Help & FAQ"
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:198
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:147
 msgid "Home"
 msgstr "Home"
 
@@ -518,7 +530,7 @@ msgstr "No. Your face ID or fingerprint is only used to create or unlock your pa
 msgid "Only enter the code from that device if you initiated this process <0>yourself</0>."
 msgstr "Only enter the code from that device if you initiated this process <0>yourself</0>."
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:255
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:204
 msgid "Open menu"
 msgstr "Open menu"
 
@@ -605,6 +617,10 @@ msgstr "Scan the above QR code with your <0>new device</0> or enter the URL manu
 msgid "Seamless Access"
 msgstr "Seamless Access"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:31
+msgid "Secure recovery"
+msgstr "Secure recovery"
+
 #: src/frontend/src/routes/(new-styling)/unsupported/+page.svelte:38
 msgid "Select <0>Open in Safari</0> or <1>Open in Chrome</1>."
 msgstr "Select <0>Open in Safari</0> or <1>Open in Chrome</1>."
@@ -613,6 +629,10 @@ msgstr "Select <0>Open in Safari</0> or <1>Open in Chrome</1>."
 msgid "Set as default sign-in"
 msgstr "Set as default sign-in"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:59
+msgid "Show all"
+msgstr "Show all"
+
 #: src/frontend/src/routes/(new-styling)/authorize/(panel)/continue/+page.svelte:364
 msgid "Sign in"
 msgstr "Sign in"
@@ -651,7 +671,7 @@ msgid "Something went wrong during authentication. Authenticating service was no
 msgstr "Something went wrong during authentication. Authenticating service was notified and you may close this page."
 
 #: src/frontend/src/lib/components/layout/Footer.svelte:34
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:224
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:173
 msgid "Source code"
 msgstr "Source code"
 
@@ -664,12 +684,12 @@ msgid "Still have an identity number?"
 msgstr "Still have an identity number?"
 
 #: src/frontend/src/lib/components/layout/Footer.svelte:26
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:218
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:167
 msgid "Support"
 msgstr "Support"
 
 #: src/frontend/src/lib/components/ui/IdentitySwitcher.svelte:44
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:244
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:193
 msgid "Switch identity"
 msgstr "Switch identity"
 
@@ -777,7 +797,7 @@ msgstr "Use a device that already holds your identity to scan or open the URL. T
 #: src/frontend/src/routes/(new-styling)/authorize/+layout.svelte:143
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:142
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:165
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:145
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:257
 msgid "Use another identity"
 msgstr "Use another identity"
 

src/frontend/src/lib/locales/es.po

@@ -53,7 +53,7 @@ msgstr "<0>Sin números de identidad:</0> Como se explica más arriba, las passk
 msgid "<0>Seamless Passkey Integration:</0> We continue to embrace passkeys as the future of secure authentication. Internet Identity 2.0 leverages the latest passkey standards for enhanced security and ease of use."
 msgstr "<0>Integración de passkey sin interrupciones:</0> Seguimos adoptando las passkeys como el futuro de la autenticación segura. Internet Identity 2.0 aprovecha los últimos estándares de passkey para mayor seguridad y facilidad de uso."
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:207
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:156
 #: src/frontend/src/routes/(new-styling)/manage/(authenticated)/access/+page.svelte:8
 msgid "Access methods"
 msgstr ""
@@ -94,6 +94,10 @@ msgstr "Al activar esta función, puedes crear más de una cuenta por app. Cambi
 msgid "Can't find your identity?"
 msgstr "¿No encuentras tu identidad?"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:63
+msgid "Cancel"
+msgstr "Cancelar"
+
 #: src/frontend/src/lib/components/wizards/auth/views/SolveCaptcha.svelte:61
 msgid "CAPTCHA characters"
 msgstr "Caracteres del CAPTCHA"
@@ -112,19 +116,23 @@ msgstr "elige una identidad para continuar"
 
 #: src/frontend/src/routes/(new-styling)/authorize/+layout.svelte:146
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:168
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:148
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:260
 msgid "choose method"
 msgstr "elige un método"
 
 #: src/frontend/src/routes/(new-styling)/authorize/(panel)/+page.svelte:41
 msgid "Choose method"
 msgstr "Elige un método"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:60
+msgid "Clear all"
+msgstr "Borrar todo"
+
 #: src/frontend/src/lib/components/ui/IdentitySwitcher.svelte:52
 msgid "Close"
 msgstr "Cerrar"
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:175
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:124
 msgid "Close menu"
 msgstr ""
 
@@ -243,6 +251,10 @@ msgstr "Activar cuentas múltiples"
 msgid "Enter characters"
 msgstr "Introduce los caracteres"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:34
+msgid "Enter your recovery phrase words in each box, spelled correctly and in order."
+msgstr "Escribe tus palabras de recuperación en cada campo, escritas correctamente y en orden."
+
 #: src/frontend/src/routes/(new-styling)/+page.svelte:190
 msgid "Everything you need to know about Internet Identity, your private, secure, and easy way to log in to apps on the Internet Computer."
 msgstr "Todo lo que necesitas saber sobre Internet Identity, tu forma privada, segura y sencilla de iniciar sesión en aplicaciones de Internet Computer."
@@ -297,7 +309,7 @@ msgstr "Ir a la app - (<0>{countdown}</0>)"
 msgid "Help & FAQ"
 msgstr "Ayuda y preguntas frecuentes"
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:198
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:147
 msgid "Home"
 msgstr ""
 
@@ -518,7 +530,7 @@ msgstr "No. Tu Face ID o huella digital solo se usa para crear o desbloquear tu
 msgid "Only enter the code from that device if you initiated this process <0>yourself</0>."
 msgstr "Introduce el código de ese dispositivo solo si iniciaste este proceso <0>tú mismo</0>."
 
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:255
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:204
 msgid "Open menu"
 msgstr ""
 
@@ -605,6 +617,10 @@ msgstr "Escanea el código QR de arriba con tu <0>nuevo dispositivo</0> o introd
 msgid "Seamless Access"
 msgstr "Acceso Senzillo"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:31
+msgid "Secure recovery"
+msgstr "Recuperación Segura"
+
 #: src/frontend/src/routes/(new-styling)/unsupported/+page.svelte:38
 msgid "Select <0>Open in Safari</0> or <1>Open in Chrome</1>."
 msgstr "Selectiona <0>Abrir en Safari</0> o <1>Abrir en Chrome</1>."
@@ -613,6 +629,10 @@ msgstr "Selectiona <0>Abrir en Safari</0> o <1>Abrir en Chrome</1>."
 msgid "Set as default sign-in"
 msgstr "Establecer como inicio de sesión predeterminado"
 
+#: src/frontend/src/routes/(new-styling)/recovery-phrase/+page.svelte:59
+msgid "Show all"
+msgstr ""
+
 #: src/frontend/src/routes/(new-styling)/authorize/(panel)/continue/+page.svelte:364
 msgid "Sign in"
 msgstr "Iniciar sesión"
@@ -651,7 +671,7 @@ msgid "Something went wrong during authentication. Authenticating service was no
 msgstr "Algo salió mal durante la autenticación. Se notificó al servicio y puedes cerrar esta página."
 
 #: src/frontend/src/lib/components/layout/Footer.svelte:34
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:224
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:173
 msgid "Source code"
 msgstr "Código fuente"
 
@@ -664,12 +684,12 @@ msgid "Still have an identity number?"
 msgstr "¿Aún tienes un número de identidad?"
 
 #: src/frontend/src/lib/components/layout/Footer.svelte:26
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:218
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:167
 msgid "Support"
 msgstr "Soporte"
 
 #: src/frontend/src/lib/components/ui/IdentitySwitcher.svelte:44
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:244
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:193
 msgid "Switch identity"
 msgstr "Cambiar de identidad"
 
@@ -777,7 +797,7 @@ msgstr "Usa un dispositivo que ya tenga tu identidad para escanear o abrir la UR
 #: src/frontend/src/routes/(new-styling)/authorize/+layout.svelte:143
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:142
 #: src/frontend/src/routes/(new-styling)/login/+page.svelte:165
-#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:145
+#: src/frontend/src/routes/(new-styling)/manage/(authenticated)/+layout.svelte:257
 msgid "Use another identity"
 msgstr "Usar otra identidad"