Add notification to Webauthn Platform setup page

app/views/users/webauthn_setup/new.html.erb

@@ -4,6 +4,12 @@
 
 <%= render PageHeadingComponent.new.with_content(@presenter.heading) %>
 
+<% if @platform_authenticator %>
+  <%= render AlertComponent.new(type: :warning, class: 'margin-y-1') do %>
+    <%= t('forms.webauthn_platform_setup.warning_text') %>
+  <% end %>
+<% end %>
+
 <%= @presenter.intro_html %>
 
 <%= simple_form_for(

config/locales/forms/en.yml

@@ -161,6 +161,9 @@ en:
       intro_link_text: Learn more about face or touch unlock.
       login_text: 'When you are ready, press the button:'
       nickname: Device nickname
+      warning_text: If you lose or change your device, you’ll have to reset your
+        account. We recommend setting up multiple authentication methods to help
+        avoid account lockout.
     webauthn_setup:
       continue: Continue
       instructions_text: Press the button on your security key to register it with %{app_name}

config/locales/forms/es.yml

@@ -173,6 +173,9 @@ es:
       intro_link_text: Conozca más sobre el desbloqueo facial o táctil.
       login_text: 'Cuando esté listo, presione el botón:'
       nickname: Apodo de dispositivo.
+      warning_text: En caso de que pierdas o cambies tu dispositivo, tienes que
+        restablecer tu cuenta. Para evitar el bloqueo de la cuenta, te
+        recomendamos que configures diferentes métodos de autenticación.
     webauthn_setup:
       continue: Continuar
       instructions_text: Presione el botón en su clave de seguridad para registrarlo

config/locales/forms/fr.yml

@@ -178,6 +178,10 @@ fr:
       intro_link_text: En savoir plus sur le déverrouillage facial ou tactile.
       login_text: 'Lorsque vous êtes prêt, appuyez sur le bouton:'
       nickname: Pseudo dispositivo
+      warning_text: Si vous perdez ou changez votre appareil, vous devrez
+        réinitialiser votre compte. Nous vous conseillons de mettre en place
+        plusieurs méthodes d’authentification afin d’éviter que votre compte ne
+        se bloque.
     webauthn_setup:
       continue: Continuer
       instructions_text: Appuyez sur le bouton de votre clé de sécurité pour

spec/views/users/webauthn_setup/new.html.erb_spec.rb

@@ -0,0 +1,36 @@
+require 'rails_helper'
+
+describe 'users/webauthn_setup/new.html.erb' do
+  let(:user) { create(:user, :signed_up) }
+
+  context 'webauthn platform' do
+    let(:platform_authenticator) { true }
+    let(:user_session) do
+      { webauthn_challenge: 'fake_challenge' }
+    end
+    let(:presenter) do
+      WebauthnSetupPresenter.new(
+        current_user: user,
+        user_fully_authenticated: true,
+        user_opted_remember_device_cookie: true,
+        remember_device_default: true,
+        platform_authenticator: platform_authenticator,
+      )
+    end
+
+    before do
+      allow(view).to receive(:current_user).and_return(user)
+      allow(view).to receive(:user_session).and_return(user_session)
+      allow(view).to receive(:in_multi_mfa_selection_flow?).and_return(false)
+      assign(:platform_authenticator, platform_authenticator)
+      assign(:user_session, user_session)
+      assign(:presenter, presenter)
+    end
+
+    it 'displays warning alert' do
+      render
+
+      expect(rendered).to have_content(I18n.t('forms.webauthn_platform_setup.warning_text'))
+    end
+  end
+end