@using System.Text.Json
@using TaikoWebUI.Pages.Dialogs;
@using TaikoWebUI.Utilities
@inject IDialogService DialogService;
@inject AuthService AuthService;
@inject HttpClient Client
@inject NavigationManager NavigationManager


@if (User is not null)
{
    <MudCard Outlined="true" Class="user-card">
        <MudCardHeader>
            <CardHeaderContent>
                <div style="display:flex;flex-wrap:wrap;align-items:center;gap:5px;">
                    @if (UserSetting is not null)
                    {
                        <MudText Typo="Typo.h6" Style="font-weight:bold;word-break:break-all">@UserSetting?.MyDonName</MudText>
                    } else
                    {
                        <MudSkeleton Width="35%" Height="32px" />
                    }

                    @if (AuthService.LoginRequired && User?.IsAdmin == true)
                    {
                        <MudChip Variant="Variant.Outlined" Color="Color.Info" Size="Size.Small" Icon="@Icons.Material.TwoTone.AdminPanelSettings">@Localizer["Admin"]</MudChip>
                    }
                </div>
                <MudText Typo="Typo.caption">@Localizer["User ID"]: @User?.Baid</MudText>
                </CardHeaderContent>
                <CardHeaderActions>
                    <MudMenu Icon="@Icons.Material.Filled.MoreVert" Dense="true" AnchorOrigin="Origin.BottomLeft"
                             TransformOrigin="Origin.TopLeft" Size="Size.Small">
                        <MudMenuItem Icon="@Icons.Material.Filled.QrCode"
                                     OnClick="@(_ => ShowQrCode(User))"
                                     OnTouch="@(_ => ShowQrCode(User))"
                                     IconColor="@Color.Primary">
                            @Localizer["Show QR Code"]
                    </MudMenuItem>
                    <MudDivider />
                    <MudMenuItem Icon="@Icons.Material.Filled.FeaturedPlayList"
                                 Href="@($"Users/{User.Baid}/AccessCode")"
                                 IconColor="@Color.Primary">
                        @Localizer["Access Codes"]
                    </MudMenuItem>
                    <MudDivider />
                    @if (AuthService.OnlyAdmin || AuthService.LoginRequired)
                    {
                        <MudMenuItem Icon="@Icons.Material.Filled.Lock"
                                     Href="@($"/ChangePassword")"
                                     IconColor="@Color.Primary">
                            @Localizer["Change Password"]
                        </MudMenuItem>
                        <MudDivider />
                    }
                    @if (AuthService.LoginRequired && AuthService.IsAdmin)
                    {
                        <MudMenuItem Icon="@Icons.Material.Filled.Password"
                                     OnClick="@(_ => GenerateInviteCode(User.Baid))"
                                     OnTouch="@(_ => GenerateInviteCode(User.Baid))"
                                     IconColor="@Color.Primary">
                            @Localizer["Generate Invite Code"]
                        </MudMenuItem>
                        <MudDivider />
                    }
                    @if (AuthService.LoginRequired && AuthService.IsAdmin)
                    {
                        <MudMenuItem Icon="@Icons.Material.Filled.LockReset"
                                     OnClick="@(_ => ResetPassword(User))"
                                     OnTouch="@(_ => ResetPassword(User))"
                                     IconColor="@Color.Primary">
                            @Localizer["Unregister"]
                        </MudMenuItem>
                        <MudDivider />
                    }
                    @if (AuthService.AllowUserDelete)
                    {
                        <MudMenuItem Icon="@Icons.Material.Filled.Delete"
                                     OnClick="@(_ => DeleteUser(User))"
                                     OnTouch="@(_ => DeleteUser(User))"
                                     IconColor="@Color.Error">
                            @Localizer["Delete User"]
                        </MudMenuItem>
                    }
                </MudMenu>
            </CardHeaderActions>
        </MudCardHeader>
        <MudCardContent>
            <MudText Typo="Typo.body2" Style="font-weight:bold">@Localizer["Access Code"]</MudText>
            <MudText Style="font-family:monospace;overflow:hidden;overflow-x:scroll">
                @if (User.AccessCodes.Count > 0)
                {
                    @if (User.AccessCodes[0].Length % 4 == 0 && StringUtil.OnlyHexInString(User.AccessCodes[0]))
                    {
                        foreach (var digitGroup in StringUtil.SplitIntoGroups(User.AccessCodes[0], 4))
                        {
                            <span class="mr-2">@digitGroup</span>
                        }
                    }
                    else
                    {
                        <span class="mr-2">@User.AccessCodes[0]</span>
                    }
                } else
				{
					<span class="mr-2">@Localizer["N/A"]</span>
				}
            </MudText>
            @if (User.AccessCodes.Count > 1)
            {
                <MudText Typo="Typo.caption">... @Localizer["And"] @(User.AccessCodes.Count - 1) @Localizer["other access code(s)"]</MudText>
            }
            else
            {
                // Empty line to keep the layout consistent
                <MudText Typo="Typo.caption"> </MudText>
            }
        </MudCardContent>
        <MudCardActions>
            <MudStack Row="true" Style="width:100%" Spacing="4" Justify="Justify.FlexEnd">
                <MudButton Href="@($"Users/{User.Baid}/Profile")"
                           Size="Size.Small" Variant="Variant.Text" StartIcon="@Icons.Material.Filled.Edit"
                           Color="Color.Primary">
                    @Localizer["Edit Profile"]
                </MudButton>
                <MudMenu Size="Size.Small"
                         Dense="true"
                         Color="Color.Primary"
                         Label="@Localizer["View Play Data"]"
                         StartIcon="@Icons.Material.Filled.EmojiEvents"
                         EndIcon="@Icons.Material.Filled.KeyboardArrowDown"
                         FullWidth="true"
                         AnchorOrigin="Origin.BottomCenter"
                         TransformOrigin="Origin.TopCenter">
                    <MudMenuItem Href="@($"Users/{User.Baid}/HighScores")">@Localizer["High Scores"]</MudMenuItem>
                    <MudMenuItem Href="@($"Users/{User.Baid}/PlayHistory")">@Localizer["Play History"]</MudMenuItem>
                    <MudMenuItem Href="@($"Users/{User.Baid}/Songs")">@Localizer["Song List"]</MudMenuItem>
                    <MudMenuItem Href="@($"Users/{User.Baid}/DaniDojo")">@Localizer["Dani Dojo"]</MudMenuItem>
                </MudMenu>
            </MudStack>
        </MudCardActions>
    </MudCard>
}