BlazorStart/Start/Client/Components/CreateContainer.razor

@using Start.Shared
@using Start.Shared.Api
@using Refit

@inject IBookmarkContainersApi bookmarkContainersApi

<Dialog Title="Create Container" Active="this.IsOpen" OnClose="this.OnDialogClose">
    <EditForm Model="this.model" OnValidSubmit="this.OnSubmit">
        @if (displayError)
        {
            <Alert Type="Alert.AlertType.Error">
                There was an error creating the container
            </Alert>
        }
        <div class="form-group">
            <div class="container">
                <div class="columns">
                    <div class="column col-12">
                        <div>
                            <label for="createBookmarkContainerTitle" class="form-label">Title</label>
                            <InputText id="createBookmarkContainerTitle" name="createBookmarkContainerTitle"
                                       class="form-input" @bind-Value="this.model.Title" />
                        </div>
                    </div>
                </div>
            </div>
            <div class="container">
                <div class="columns">
                    <div class="column col-12 text-right">
                        <div>
                            <button type="submit" class="btn btn-primary">
                                <i class="icon icon-plus"></i> Create
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </EditForm>
</Dialog>

@code {
    [Parameter]
    public EventCallback<BookmarkContainerDto> OnCreated { get; set; }
    [Parameter]
    public bool IsOpen { get; set; }
    [Parameter]
    public EventCallback OnClose { get; set; }

    private BookmarkContainerDto model = new("");
    private bool displayError = false;

    protected async void OnSubmit()
    {
        ApiResponse<BookmarkContainerDto?> apiResponse = await bookmarkContainersApi
            .CreateBookmarkContainer(model.Title);

        BookmarkContainerDto? container = apiResponse.Content;

        if (container == null)
        {
            this.displayError = true;
        }
        else
        {
            await this.OnCreated.InvokeAsync(container);
        }
    }

    protected async void OnDialogClose()
    {
        this.IsOpen = false;
        await this.OnClose.InvokeAsync();
    }
}