@using WatchIt.Common.Model.Persons

@page "/person/{id:long}/edit"
@page "/person/new"



<PageTitle>
    WatchIt -
    @if (_loaded)
    {
        if (string.IsNullOrWhiteSpace(_error) && _user?.IsAdmin == true)
        {
            if (_person is not null)
            {
                @("Edit \"")@(_person.Name)@("\"")
            }
            else
            {
                @("Create new person")
            }
        }
        else
        {
            @("Error")
        }
    }
    else
    {
        @("Loading")
    }
</PageTitle>



@if (_loaded)
{
    if (_user?.IsAdmin == true)
    {
        <div class="container-grid">
            <div class="row">
                <div class="col">
                    <div class="rounded-3 panel panel-regular p-2 px-3">
                        <h3 class="m-0 p-0">@(Id is not null ? "Edit" : "Create new") person @(_person is not null ? $" \"{_person.Name}\"" : string.Empty)</h3>
                    </div>
                </div>
            </div>
            <div class="row mt-3 gx-3">
                <div class="col-auto">
                    <PictureEditorComponent Id="@(Id)"
                                            PictureGetTask="@(async (id, action) => await PersonsWebAPIService.GetPersonPhoto(id, action))"
                                            PicturePutTask="@(async (id, data, action) => await PersonsWebAPIService.PutPersonPhoto(id, new PersonPhotoRequest(data), action))"
                                            PictureDeleteTask="@(async (id, action) => await PersonsWebAPIService.DeletePersonPhoto(id, action))"
                                            PicturePlaceholder="/assets/person_picture.png"
                                            Class="h-100"/>
                </div>
                <div class="col">
                    <PersonEditFormComponent Id="@(Id)" 
                                             Class="h-100"/>
                </div>
            </div>
            <div class="row mt-3">
                <div class="col">
                    <PersonRolesEditActorComponent Id="@(Id)"
                                                   Media="@(_media)"/>
                </div>
            </div>
        </div>
    }
    else
    {
        <ErrorComponent ErrorMessage="You do not have permission to view this site"/>
    }
}
else
{
    <div class="m-5">
        <LoadingComponent/>
    </div>
}
