btcpayserver/BTCPayServer/Views/UIManage/TwoFactorAuthentication.cshtml
d11n 0f8da123b8
UI: Move section navigation to sidebar (#5744)
* UI: Move section navigation to sidebar

* Scroll active nav link into view

* Move CTAs to top right

* Server Settings: Make Policies first page

* Responsive table fixes

* Spacing fixes

* Add breadcrumb samples

* store settings fixes

* payment request fixes

* updates pull payment title

* adds invoice detail fix

* updates server settings breadcrumbs + copy fix

* Don't open Server Settings on Plugins page

* Add breadcrumbs to pull payment views

* adds breadcrumbs to account

* server and store breadcrumb fixes

* fixes access tokens

* Fix payment processor breadcrumbs

* fixes webhook 404

* Final touches

* Fix test

* Add breadcrumb for email rules page

* Design system updates

---------

Co-authored-by: dstrukt <gfxdsign@gmail.com>
2024-06-19 15:23:10 +02:00

146 lines
8.5 KiB
Text

@using BTCPayServer.Abstractions.Models
@model TwoFactorAuthenticationViewModel
@{
ViewData.SetActivePage(ManageNavPages.TwoFactorAuthentication, "Two-Factor Authentication");
}
<div class="sticky-header">
<h2 class="my-1">@ViewData["Title"]</h2>
</div>
<partial name="_StatusMessage" />
<div class="row">
<div class="col-xl-8 col-xxl-constrain">
<p>
Two-Factor Authentication (2FA) is an additional measure to protect your account.
In addition to your password you will be asked for a second proof on login.
This can be provided by an app (such as Google or Microsoft Authenticator)
or a security device (like a Yubikey or your hardware wallet supporting FIDO2).
</p>
<h4 class="mb-3">App-based 2FA</h4>
@if (Model.Is2faEnabled)
{
if (Model.RecoveryCodesLeft == 0)
{
<div class="alert alert-danger">
<h4 class="alert-heading mb-3">
<vc:icon symbol="warning" />
You have no recovery codes left.
</h4>
<p class="mb-0">You must <a asp-action="GenerateRecoveryCodes" class="alert-link">generate a new set of recovery codes</a> before you can log in with a recovery code.</p>
</div>
}
else if (Model.RecoveryCodesLeft == 1)
{
<div class="alert alert-danger">
<h4 class="alert-heading mb-3">
<vc:icon symbol="warning" />
You only have 1 recovery code left.
</h4>
<p class="mb-0">You can <a asp-action="GenerateRecoveryCodes" class="alert-link">generate a new set of recovery codes</a>.</p>
</div>
}
else if (Model.RecoveryCodesLeft <= 3)
{
<div class="alert alert-warning">
<h4 class="alert-heading mb-3">
<vc:icon symbol="warning" />
You only have @Model.RecoveryCodesLeft recovery codes left.
</h4>
<p class="mb-0">You should <a asp-action="GenerateRecoveryCodes" class="alert-link">generate a new set of recovery codes</a>.</p>
</div>
}
}
<div class="list-group mb-3">
@if (Model.Is2faEnabled)
{
<a asp-action="Disable2fa" class="list-group-item d-flex justify-content-between align-items-center list-group-item-action py-3" data-bs-toggle="modal" data-bs-target="#ConfirmModal" data-title="Disable two-factor authentication (2FA)" data-description="Disabling 2FA does not change the keys used in the authenticator apps. If you wish to change the key used in an authenticator app you should reset your authenticator keys." data-confirm="Disable" data-confirm-input="DISABLE">
<div>
<h5>Disable 2FA</h5>
<p class="mb-0 me-3">Re-enabling will not require you to reconfigure your app.</p>
</div>
<vc:icon symbol="caret-right"/>
</a>
<a asp-action="GenerateRecoveryCodes" class="list-group-item d-flex justify-content-between align-items-center list-group-item-action py-3" data-bs-toggle="modal" data-bs-target="#ConfirmModal" data-title="Reset recovery codes" data-description="Your existing recovery codes will no longer be valid!" data-confirm="Reset" data-confirm-input="RESET">
<div>
<h5>Reset recovery codes</h5>
<p class="mb-0 me-3">Regenerate your 2FA recovery codes.</p>
</div>
<vc:icon symbol="caret-right"/>
</a>
<a asp-action="ResetAuthenticator" class="list-group-item d-flex justify-content-between align-items-center list-group-item-action py-3" data-bs-toggle="modal" data-bs-target="#ConfirmModal" data-title="Reset authenticator app" data-description="This process disables 2FA until you verify your authenticator app and will also reset your 2FA recovery codes. If you do not complete your authenticator app configuration you may lose access to your account." data-confirm="Reset" data-confirm-input="RESET">
<div>
<h5>Reset app</h5>
<p class="mb-0 me-3">Invalidates the current authenticator configuration. Useful if you believe your authenticator settings were compromised.</p>
</div>
<vc:icon symbol="caret-right"/>
</a>
<a asp-action="EnableAuthenticator" class="list-group-item d-flex justify-content-between align-items-center list-group-item-action py-3">
<div>
<h5>Configure app</h5>
<p class="mb-0 me-3">Display the key or QR code to configure an authenticator app with your current setup.</p>
</div>
<vc:icon symbol="caret-right"/>
</a>
}
else
{
<a asp-action="EnableAuthenticator" class="list-group-item d-flex justify-content-between align-items-center list-group-item-action py-3">
<div>
<h5>Enable 2FA</h5>
<p class="mb-0 me-3">Using apps such as Google or Microsoft Authenticator.</p>
</div>
<vc:icon symbol="caret-right"/>
</a>
}
</div>
<h4 class="mt-4 mb-3">Security devices</h4>
@if (Model.Credentials.Any())
{
<div class="list-group mb-3">
@foreach (var device in Model.Credentials)
{
var name = string.IsNullOrEmpty(device.Name) ? "Unnamed security device" : device.Name;
<div class="list-group-item d-flex justify-content-between align-items-center py-3">
<div class="mb-0">
<h5 class="mb-0 w-100">@name</h5>
@switch (device.Type)
{
case Fido2Credential.CredentialType.FIDO2:
<span class="text-muted">Security device (FIDO2)</span>
break;
case Fido2Credential.CredentialType.LNURLAuth:
<span class="text-muted">Lightning node (LNURL Auth)</span>
break;
}
</div>
@if (device.Type == Fido2Credential.CredentialType.FIDO2)
{
<a asp-controller="UIFido2" asp-action="Remove" asp-route-id="@device.Id" class="btn btn-outline-danger" data-bs-toggle="modal" data-bs-target="#ConfirmModal" data-title="Remove security device" data-description="Your account will no longer have the security device <strong>@Html.Encode(name)</strong> as an option for two-factor authentication." data-confirm="Remove" data-confirm-input="REMOVE">Remove</a>
}
else if (device.Type == Fido2Credential.CredentialType.LNURLAuth)
{
<a asp-controller="UILNURLAuth" asp-action="Remove" asp-route-id="@device.Id" class="btn btn-outline-danger" data-bs-toggle="modal" data-bs-target="#ConfirmModal" data-title="Remove Lightning security" data-description="Your account will no longer be linked to the lightning node <strong>@Html.Encode(name)</strong> as an option for two-factor authentication." data-confirm="Remove" data-confirm-input="REMOVE">Remove</a>
}
</div>
}
</div>
}
<form asp-action="CreateCredential">
<div class="input-group">
<input type="text" class="form-control" name="Name" placeholder="Security device name"/>
<select asp-items="@Html.GetEnumSelectList<Fido2Credential.CredentialType>()" class="form-select w-auto" name="type"></select>
<button id="btn-add" type="submit" class="btn btn-primary">
Add
</button>
</div>
</form>
</div>
</div>
<partial name="_Confirm" model="@(new ConfirmModel("Two-Factor Authentication", "Placeholder", "Placeholder"))"/>