@page "/admin/servers/nodes/create"

@using LucideBlazor
@using Moonlight.Frontend.Helpers
@using MoonlightServers.Shared
@using MoonlightServers.Shared.Admin.Nodes
@using ShadcnBlazor.Buttons
@using ShadcnBlazor.Cards
@using ShadcnBlazor.Extras.Forms
@using ShadcnBlazor.Extras.Toasts
@using ShadcnBlazor.Fields
@using ShadcnBlazor.Inputs

@inject HttpClient HttpClient
@inject NavigationManager Navigation
@inject ToastService ToastService

<EnhancedEditForm Model="Request" OnValidSubmit="OnSubmitAsync" Context="formContext">

    <div class="flex flex-row justify-between">
        <div class="flex flex-col">
            <h1 class="text-xl font-semibold">Create Node</h1>
            <div class="text-muted-foreground">
                Create a new node
            </div>
        </div>
        <div class="flex flex-row gap-x-1.5">
            <Button Variant="ButtonVariant.Secondary">
                <Slot>
                    <a href="/admin/servers?tab=nodes" @attributes="context">
                        <ChevronLeftIcon/>
                        Back
                    </a>
                </Slot>
            </Button>
            <SubmitButton>
                <CheckIcon/>
                Continue
            </SubmitButton>
        </div>
    </div>

    <div class="mt-8">
        <Card>
            <CardContent>
                <DataAnnotationsValidator/>

                <FieldGroup>
                    <FormValidationSummary/>

                    <FieldSet>
                        <FieldGroup>
                            <div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 gap-8">
                                <Field>
                                    <FieldLabel for="nodeName">Name</FieldLabel>
                                    <TextInputField
                                        @bind-Value="Request.Name"
                                        id="nodeName"/>
                                </Field>

                                <Field>
                                    <FieldLabel for="nodeHttpEndpoint">HTTP Endpoint</FieldLabel>
                                    <TextInputField
                                        @bind-Value="Request.HttpEndpointUrl"
                                        id="nodeHttpEndpoint"
                                        placeholder="http://example.com:8080"/>
                                </Field>
                            </div>
                        </FieldGroup>
                    </FieldSet>
                </FieldGroup>
            </CardContent>
        </Card>
    </div>

</EnhancedEditForm>

@code
{
    private CreateNodeDto Request = new();

    private async Task<bool> OnSubmitAsync(EditContext context, ValidationMessageStore validationMessageStore)
    {
        var response = await HttpClient.PostAsJsonAsync(
            "/api/admin/servers/nodes",
            Request,
            SerializationContext.Default.Options
        );

        if (!response.IsSuccessStatusCode)
        {
            await ProblemDetailsHelper.HandleProblemDetailsAsync(response, Request, validationMessageStore);
            return false;
        }

        await ToastService.SuccessAsync(
            "Node Creation",
            $"Successfully created node {Request.Name}"
        );

        Navigation.NavigateTo("/admin/servers?tab=nodes");
        return true;
    }
}