@if (IsVisible)
{
    <div class="modal show d-block sb-modal-backdrop" tabindex="-1">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h6 class="modal-title">New Area</h6>
                    <button type="button" class="btn-close" @onclick="Close"></button>
                </div>
                <div class="modal-body">
                    @if (RequireSitePicker)
                    {
                        <div class="mb-2">
                            <label class="form-label small">Site</label>
                            <select class="form-select form-select-sm" @bind="_siteId">
                                <option value="0">(Select a site)</option>
                                @foreach (var opt in SiteOptions)
                                {
                                    <option value="@opt.Id">@opt.Label</option>
                                }
                            </select>
                        </div>
                        <div class="mb-2">
                            <label class="form-label small">Parent area</label>
                            <select class="form-select form-select-sm" @bind="_parentAreaId">
                                <option value="0">(Site root)</option>
                                @foreach (var opt in ParentOptions.Where(o => SelectedSiteMatches(o)))
                                {
                                    <option value="@opt.Id">@opt.Label</option>
                                }
                            </select>
                        </div>
                    }
                    else
                    {
                        <div class="text-muted small mb-2">
                            @ContextLabel
                        </div>
                    }
                    <label class="form-label small">Name</label>
                    <input class="form-control form-control-sm" placeholder="Area name" @bind="_name" />
                    @if (!string.IsNullOrEmpty(ErrorMessage)) { <div class="text-danger small mt-1">@ErrorMessage</div> }
                </div>
                <div class="modal-footer">
                    <button class="btn btn-outline-secondary btn-sm" @onclick="Close">Cancel</button>
                    <button class="btn btn-primary btn-sm" @onclick="Submit">Create</button>
                </div>
            </div>
        </div>
    </div>
}

@code {
    [Parameter] public bool IsVisible { get; set; }
    [Parameter] public EventCallback<bool> IsVisibleChanged { get; set; }
    [Parameter] public bool RequireSitePicker { get; set; }
    [Parameter] public string ContextLabel { get; set; } = string.Empty;
    [Parameter] public int? SiteId { get; set; }
    [Parameter] public int? ParentAreaId { get; set; }
    [Parameter] public IEnumerable<(int Id, string Label)> SiteOptions { get; set; } = Array.Empty<(int, string)>();
    [Parameter] public IEnumerable<(int Id, string Label, int SiteId)> ParentOptions { get; set; } = Array.Empty<(int, string, int)>();
    [Parameter] public string? ErrorMessage { get; set; }
    [Parameter] public EventCallback<(int SiteId, int? ParentAreaId, string Name)> OnSubmit { get; set; }

    private bool _wasVisible;
    private string _name = string.Empty;
    private int _siteId;
    private int _parentAreaId;

    protected override void OnParametersSet()
    {
        if (IsVisible && !_wasVisible)
        {
            _name = string.Empty;
            _siteId = SiteId ?? 0;
            _parentAreaId = ParentAreaId ?? 0;
        }
        _wasVisible = IsVisible;
    }

    private bool SelectedSiteMatches((int Id, string Label, int SiteId) opt) =>
        _siteId == 0 || opt.SiteId == _siteId;

    private async Task Close() => await IsVisibleChanged.InvokeAsync(false);

    private async Task Submit()
    {
        var effectiveSite = RequireSitePicker ? _siteId : (SiteId ?? 0);
        var effectiveParent = RequireSitePicker
            ? (_parentAreaId == 0 ? (int?)null : _parentAreaId)
            : ParentAreaId;
        await OnSubmit.InvokeAsync((effectiveSite, effectiveParent, _name.Trim()));
    }
}