mirror of
https://github.com/System-End/identity-vault.git
synced 2026-04-19 18:35:13 +00:00
52 lines
2 KiB
Text
52 lines
2 KiB
Text
<div class="passkey-setup" x-data="webauthnRegister()">
|
|
<p class="webauthn-setup-description">
|
|
A passwordless way to sign in using your device's biometric authentication or PIN.
|
|
</p>
|
|
|
|
<div x-show="!browserSupported" x-cloak class="alert alert-warning">
|
|
<strong>Browser not supported</strong>
|
|
<p>Your browser doesn't support the latest WebAuthn features. Use something modern!</p>
|
|
</div>
|
|
|
|
<%= form_with url: identity_webauthn_credentials_path, method: :post, local: true, id: "webauthn-registration-form", style: "display: none;" do |form| %>
|
|
<%= form.hidden_field :credential_data, id: "registration-credential-data" %>
|
|
<%= form.hidden_field :nickname, id: "registration-nickname" %>
|
|
<% end %>
|
|
|
|
<div x-show="browserSupported">
|
|
<form x-on:submit.prevent="register()">
|
|
<div class="form-group">
|
|
<label for="webauthn-nickname">Passkey Nickname</label>
|
|
<input
|
|
type="text"
|
|
id="webauthn-nickname"
|
|
x-model="nickname"
|
|
placeholder="e.g., Heidi's iPhone, MacBook Air"
|
|
required
|
|
maxlength="50"
|
|
autocomplete="off">
|
|
<small class="form-hint">Give this passkey a memorable name to identify it later!</small>
|
|
</div>
|
|
|
|
<div x-show="error" x-cloak class="alert alert-error" role="alert">
|
|
<strong>Registration Failed</strong>
|
|
<p x-text="error"></p>
|
|
</div>
|
|
|
|
<div class="form-actions">
|
|
<button type="submit" class="btn btn-primary" :disabled="loading">
|
|
<span x-show="!loading">Register Passkey</span>
|
|
<span x-show="loading" x-cloak>Registering...</span>
|
|
</button>
|
|
<%= link_to "Cancel",
|
|
identity_webauthn_credentials_path,
|
|
class: "btn btn-secondary",
|
|
data: {
|
|
"hx-get": identity_webauthn_credentials_path,
|
|
"hx-target": "#webauthn-credentials-container",
|
|
"hx-swap": "innerHTML"
|
|
} %>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|