feat: passwordless strategy (#170)

* feat: passwordless strategy * chore: revert formatting change * fix: spelling of lookupSecret -> lookup_secret * fix: show default nodes for webauthn * feat: add passkey auth story * feat: add passkey to user auth form --------- Co-authored-by: Jonas Hungershausen <[email protected]>
ory · Jan 10, 2024 · 4254a53 · 4254a53
1 parent d701e4e
commit 4254a53
Show file tree

Hide file tree

Showing 25 changed files with 511 additions and 65 deletions.
diff --git a/examples/nextjs-spa/src/pages/settings.tsx b/examples/nextjs-spa/src/pages/settings.tsx
@@ -108,7 +108,7 @@ const Settings: NextPageWithLayout = () => {
           "password",
           "totp",
           "webauthn",
-          "lookupSecret",
+          "lookup_secret",
           "oidc",
         ] as UserSettingsFlowType[]
       ).map((flowType: UserSettingsFlowType, index) => (

diff --git a/examples/preact-spa/src/settings.tsx b/examples/preact-spa/src/settings.tsx
@@ -76,7 +76,7 @@ export const Settings = () => {
           "password",
           "totp",
           "webauthn",
-          "lookupSecret",
+          "lookup_secret",
           "oidc",
         ] as UserSettingsFlowType[]
       ).map((flowType: UserSettingsFlowType, index) => (

diff --git a/examples/react-spa/src/Settings.tsx b/examples/react-spa/src/Settings.tsx
@@ -80,7 +80,7 @@ export const Settings = () => {
           "password",
           "totp",
           "webauthn",
-          "lookupSecret",
+          "lookup_secret",
           "oidc",
         ] as UserSettingsFlowType[]
       ).map((flowType: UserSettingsFlowType, index) => (

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -29,6 +29,7 @@
   "homepage": "https://github.com/ory/elements#readme",
   "devDependencies": {
     "@babel/core": "7.18.10",
+    "@formatjs/cli-lib": "6.3.3",
     "@ory/client": "1.2.10",
     "@ory/integrations": "1.1.5",
     "@playwright/experimental-ct-react": "1.38.0",

diff --git a/src/locales/de.json b/src/locales/de.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Profil",
   "settings.navigation-totp": "Zwei-Faktor App",
   "settings.navigation-webauthn": "Sicherheitsschlüssel",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Hier können Sie Einstellungen zu Ihrem Konto vornehmen. Für manche Einstellungen müssen Sie Ihre Identität erneut bestätigen.",
   "settings.title": "Kontoeinstellungen",
   "settings.title-lookup-secret": "Manage 2FA Backup Recovery Codes",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Profil Einstellungen",
   "settings.title-totp": "Zwei-Faktor TOTP App",
   "settings.title-webauthn": "Sicherheitsschlüssel verwalten",
+  "settings.title-passkey": "Passkeys verwalten",
   "verification.registration-button": "Registrieren",
   "verification.registration-label": "Sie haben noch kein Konto?",
   "verification.title": "Verifizieren Sie ihr Konto"

diff --git a/src/locales/en.json b/src/locales/en.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Profile",
   "settings.navigation-totp": "Authenticator App",
   "settings.navigation-webauthn": "Hardware Tokens",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Here you can manage settings related to your account. Keep in mind that certain actions require you to re-authenticate.",
   "settings.title": "Account Settings",
   "settings.title-lookup-secret": "Manage 2FA Backup Recovery Codes",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Profile Settings",
   "settings.title-totp": "Manage 2FA TOTP Authenticator App",
   "settings.title-webauthn": "Manage Hardware Tokens",
+  "settings.title-passkey": "Manage Passkeys",
   "verification.registration-button": "Sign up",
   "verification.registration-label": "Don't have an account?",
   "verification.title": "Verify your account"

diff --git a/src/locales/es.json b/src/locales/es.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Perfil",
   "settings.navigation-totp": "Aplicación Autenticadora",
   "settings.navigation-webauthn": "Tokens de Hardware",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Aquí puede gestionar las configuraciones relacionadas con su cuenta. Tenga en cuenta que ciertas acciones requieren que vuelva a autenticarse.",
   "settings.title": "Configuraciones de la Cuenta",
   "settings.title-lookup-secret": "Gestionar Códigos de Recuperación de Respaldo de 2FA",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Configuraciones del Perfil",
   "settings.title-totp": "Gestionar Aplicación Autenticadora de 2FA",
   "settings.title-webauthn": "Gestionar Tokens de Hardware",
+  "settings.title-passkey": "Gestionar Passkeys",
   "verification.registration-button": "Registrarse",
   "verification.registration-label": "¿No tiene una cuenta?",
   "verification.title": "Verificar su cuenta"

diff --git a/src/locales/fr.json b/src/locales/fr.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Profil",
   "settings.navigation-totp": "Application d'authentification TOTP",
   "settings.navigation-webauthn": "Tokens matériels",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Ici, vous pouvez gérer les paramètres liés à votre compte. Gardez à l'esprit que certaines actions nécessitent une nouvelle authentification.",
   "settings.title": "Paramètres du compte",
   "settings.title-lookup-secret": "Gérer les codes de récupération 2FA",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Paramètres de profil",
   "settings.title-totp": "Gérer l'application d'authentification TOTP 2FA",
   "settings.title-webauthn": "Gérer les tokens matériels",
+  "settings.title-passkey": "Gérer les Passkeys",
   "verification.registration-button": "S'inscrire",
   "verification.registration-label": "Vous n'avez pas de compte ?",
   "verification.title": "Vérifiez votre compte"

diff --git a/src/locales/nl.json b/src/locales/nl.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Profiel",
   "settings.navigation-totp": "Authenticator App",
   "settings.navigation-webauthn": "Hardware Tokens",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Hier kun je instellingen beheren die verband houden met je account. Houd er rekening mee dat bepaalde acties vereisen dat je opnieuw wordt geauthenticeerd.",
   "settings.title": "Accountinstellingen",
   "settings.title-lookup-secret": "Beheer 2FA Backup Herstelcodes",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Profielinstellingen",
   "settings.title-totp": "Beheer 2FA TOTP Authenticator App",
   "settings.title-webauthn": "Beheer Hardware Tokens",
+  "settings.title-passkey": "Beheer Passkeys",
   "verification.registration-button": "Registreren",
   "verification.registration-label": "Heb je nog geen account?",
   "verification.title": "Verifieer je account"

diff --git a/src/locales/pl.json b/src/locales/pl.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Profil",
   "settings.navigation-totp": "Aplikacja Autentykator",
   "settings.navigation-webauthn": "Tokeny Sprzętowe",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Tutaj możesz zarządzać ustawieniami związanymi z Twoim kontem. Miej na uwadze że niektóre akcje mogą wymagać ponownej uwierzytelnienia.",
   "settings.title": "Ustawienia Konta",
   "settings.title-lookup-secret": "Zarządzaj kodami odzyskiwania 2FA",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Ustawienia Profilu",
   "settings.title-totp": "Zarządzaj aplikacją autentykator 2FA TOTP",
   "settings.title-webauthn": "Zarządzaj tokenami sprzętowymi",
+  "settings.title-passkey": "Zarządzaj Passkeys",
   "verification.registration-button": "Zarejestruj się",
   "verification.registration-label": "Nie posiadasz konta?",
   "verification.title": "Zweryfikuj konto"

diff --git a/src/locales/pt.json b/src/locales/pt.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Perfil",
   "settings.navigation-totp": "Aplicação Autenticador 2FA",
   "settings.navigation-webauthn": "Tokens de Hardware",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Aqui pode gerar configurações relacionadas com a sua conta. Lembre-se de que certas ações exigem que efetue novamente login.",
   "settings.title": "Configurações da Conta",
   "settings.title-lookup-secret": "Gerar Códigos de Recuperação de Backup de 2FA",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Configurações de Perfil",
   "settings.title-totp": "Gerar Aplicação Autenticador 2FA",
   "settings.title-webauthn": "Gerar Tokens de Hardware",
+  "settings.title-passkey": "Gerar Passkeys",
   "verification.registration-button": "Registar",
   "verification.registration-label": "Não tem uma conta?",
   "verification.title": "Verifique a sua conta"

diff --git a/src/locales/se.json b/src/locales/se.json
@@ -158,6 +158,7 @@
   "settings.navigation-profile": "Profil",
   "settings.navigation-totp": "Autentiserings App",
   "settings.navigation-webauthn": "Hårdvaru Tokens",
+  "settings.navigation-passkey": "Passkeys",
   "settings.subtitle-instructions": "Här kan du hantera inställningar relaterade till ditt konto. Tänk på att vissa åtgärder kräver att du autentiseras på nytt.",
   "settings.title": "Kontoinställningar",
   "settings.title-lookup-secret": "Hantera 2FA backup-återställningskoder",
@@ -167,6 +168,7 @@
   "settings.title-profile": "Profilinställningar",
   "settings.title-totp": "Hantera 2FA TOTP Autentiserings App",
   "settings.title-webauthn": "Hantera Hårdvaru Tokens",
+  "settings.title-passkey": "Hantera Passkeys",
   "verification.registration-button": "Skapa konto",
   "verification.registration-label": "Har du inget konto?",
   "verification.title": "Verifiera ditt konto"

diff --git a/src/markup-components/components.ts b/src/markup-components/components.ts
@@ -59,6 +59,8 @@ import {
   UserSettingsScreenProps,
   WebAuthnSettingsProps,
   WebAuthnSettingsSection as webAuthnSettingsSection,
+  PasskeySettingsSection as passkeySettingsSection,
+  PasskeySettingsProps,
 } from "../react-components"
 import { ComponentWrapper, Context } from "./component-wrapper"
 
@@ -197,6 +199,13 @@ export const WebAuthnSettingsSection = (
   return ComponentWrapper(webAuthnSettingsSection, props, context)
 }
 
+export const PasskeySettingsSection = (
+  props: PasskeySettingsProps,
+  context: Context = {},
+) => {
+  return ComponentWrapper(passkeySettingsSection, props, context)
+}
+
 export const OIDCSettingsSection = (
   props: OIDCSettingsProps,
   context: Context = {},