@using System.Buffers.Text
@using LiteCharmsSecurity.STS.Identity.Passkeys
@using Microsoft.AspNetCore.Mvc.Localization
@inject IViewLocalizer Localizer
@model LiteCharmsSecurity.STS.Identity.ViewModels.Manage.PasskeysViewModel
@{
    ViewData["Title"] = Localizer["Title"];
}

<partial name="_StatusMessage" model="@Model.StatusMessage" />

<h3 class="text-2xl font-bold mb-6">@ViewData["Title"]</h3>

<div class="card mb-6">
    <div class="card-content py-6">
        @if (Model.CurrentPasskeys?.Count > 0)
        {
            <div class="space-y-4">
                @foreach (var passkey in Model.CurrentPasskeys)
                {
                    var credentialId = Base64Url.EncodeToString(passkey.CredentialId);
                    <div class="flex items-center justify-between py-3 border-b border-border last:border-0">
                        <div class="flex items-center gap-3">
                            <lucideicon name="fingerprint" class="h-5 w-5 text-muted-foreground" />
                            <span>@(passkey.Name ?? Localizer["UnnamedPasskey"].Value)</span>
                        </div>
                        <form asp-action="UpdatePasskey" method="post" class="flex items-center gap-2">
                            <input type="hidden" name="CredentialId" value="@credentialId" />
                            <button type="submit" name="Action" value="rename" class="btn-outline btn-sm">
                                <lucideicon name="pencil" class="h-4 w-4 mr-1" />
                                @Localizer["Rename"]
                            </button>
                            <button type="submit" name="Action" value="delete" class="btn-destructive btn-sm"
                                onclick="return confirm('@Localizer["ConfirmDelete"]');">
                                <lucideicon name="trash-2" class="h-4 w-4 mr-1" />
                                @Localizer["Delete"]
                            </button>
                        </form>
                    </div>
                }
            </div>
        }
        else
        {
            <div class="text-center py-8 text-muted-foreground">
                <lucideicon name="fingerprint" class="h-12 w-12 mx-auto mb-4 opacity-50" />
                <p>@Localizer["NoPasskeys"]</p>
            </div>
        }
    </div>
</div>

<div class="card">
    <div class="card-header">
        <h4 class="card-title">@Localizer["AddPasskey"]</h4>
        <p class="card-description">@Localizer["AddPasskeyDescription"]</p>
    </div>
    <div class="card-content">
        <form asp-action="AddPasskey" method="post">
            <passkey-submit operation="@PasskeyOperation.Create" name="Passkey" class="btn-default" formnovalidate>
                <lucideicon name="plus" class="inline-block h-4 w-4 mr-2" />
                @Localizer["AddPasskeyButton"]
            </passkey-submit>
        </form>
    </div>
</div>

@section scripts {
    <script src="~/js/passkey-submit.js" asp-append-version="true"></script>
}
