@page "/ispezioni"
@attribute [Authorize]
@using SteUp.Shared.Components.Layout
@using SteUp.Shared.Components.SingleElements.Card
@using SteUp.Shared.Core.Entities
@using SteUp.Shared.Core.Interface.LocalDb
@inject IIspezioniService IspezioniService
@inject IDialogService Dialog

@* L'azione "nuova ispezione" non sta qui: vive nella barra in basso, dove
   il pollice arriva senza attraversare lo schermo. *@
<HeaderLayout Title="Ispezioni" Subtitle="@Subtitle"/>

<div class="app-scroll">
    <div class="page-width page-body">
        @if (_loading)
        {
            @* Scheletri, non uno spinner in mezzo al contenuto: la pagina ha
               gia' la forma che avra', e non salta quando i dati arrivano. *@
            <div class="card-list" aria-hidden="true">
                @for (var i = 0; i < 3; i++)
                {
                    <div class="list-card">
                        <div class="skeleton skeleton--line-short"></div>
                        <div class="skeleton skeleton--title" style="margin-top: 10px;"></div>
                        <div class="skeleton skeleton--line" style="margin-top: 12px;"></div>
                        <div class="skeleton skeleton--badge" style="margin-top: 14px;"></div>
                    </div>
                }
            </div>
        }
        else if (Ispezioni.Count == 0)
        {
            <div class="empty-state">
                <i class="empty-state__icon ri-clipboard-line" aria-hidden="true"></i>
                <p class="empty-state__title">Nessuna ispezione</p>
                <p class="empty-state__text">
                    Apri la prima ispezione scegliendo il punto vendita da controllare.
                </p>
                <div class="empty-state__action">
                    <MudButton Variant="Variant.Filled" Color="Color.Primary"
                               StartIcon="@Icons.Material.Rounded.Add"
                               Disabled="@(!NetworkService.IsNetworkAvailable())"
                               OnClick="NewInspection">
                        Nuova ispezione
                    </MudButton>
                </div>
            </div>
        }
        else
        {
            <div class="card-list">
                <Virtualize Items="Ispezioni" Context="ispezione" OverscanCount="4">
                    <InspectionCard Ispezione="ispezione" OnClick="@OnClickIspezione"/>
                </Virtualize>
            </div>
        }
    </div>
</div>

@code{
    private List<Ispezione> Ispezioni { get; set; } = [];
    private bool _loading = true;

    private string? Subtitle => _loading || Ispezioni.Count == 0
        ? null
        : Ispezioni.Count == 1
            ? "1 ispezione"
            : $"{Ispezioni.Count} ispezioni";

    protected override async Task OnInitializedAsync()
    {
        Ispezioni = await IspezioniService.GetAllIspezioniWithSchedeAsync(UserSession.User.Username);

        _loading = false;
        StateHasChanged();
    }

    private async Task NewInspection()
    {
        if (await SteupDataService.CanOpenNewInspection())
        {
            var modal = await Dialog.OpenSelectShop();
            // La scelta del punto vendita naviga da sola sull'ispezione; se
            // l'utente torna indietro, la lista dev'essere quella aggiornata.
            if (modal is { Canceled: true }) return;
        }
        else
        {
            await Dialog.ShowWarning(
                "Per aprire una nuova ispezione devi prima concludere tutte le ispezioni aperte da piu' di 20 giorni.");
        }
    }

    private void OnClickIspezione(Ispezione ispezione)
    {
        SteupDataService.InspectionPageState.Ispezione = ispezione;
        NavigationManager.NavigateTo("/ispezione");
    }
}