Moonlight/Moonlight.Client/UI/Screens/AuthenticationScreen.razor

@page "/auth"

@using MoonCore.Blazor.Services
@using MoonCore.Helpers
@using Moonlight.Client.Services
@using Moonlight.Shared.Http.Requests.Auth
@using Moonlight.Shared.Http.Responses.Auth

@inject NavigationManager Navigation
@inject HttpApiClient HttpApiClient
@inject WindowService WindowService
@inject HttpClient HttpClient
@inject LocalStorageService LocalStorageService

@if (Code == null)
{
    <div class="h-full w-full min-h-[100dvh] flex items-center justify-center px-5 md:px-0">

        <div class="card card-body w-full max-w-lg">
            @if (IsAuthenticating)
            {
                <div class="sm:mx-auto sm:w-full sm:max-w-sm mb-5">
                    <h2 class="mt-6 text-center text-2xl font-bold leading-9 tracking-tight text-gray-100">Login flow started in new window/tab</h2>
                </div>

                <div class="flex justify-center">
                    <div id="loader" class="my-10"></div>
                </div>
            }
            else
            {
                <div class="sm:mx-auto sm:w-full sm:max-w-sm mb-5">
                    <img class="mx-auto h-16 w-auto" src="/logolong.webp" alt="Moonlight">
                    <h2 class="mt-6 text-center text-2xl font-bold leading-9 tracking-tight text-gray-100">Login to access your account</h2>
                </div>

                <div class="flex justify-center">
                    <WButton OnClick="StartAuth" CssClasses="btn btn-primary">
                        Proceed to login
                        <i class="bi bi-arrow-right"></i>
                    </WButton>
                </div>
            }
        </div>

    </div>
}
else
{
    <div class="h-full w-full min-h-[100dvh] flex items-center justify-center px-5 md:px-0">

        <div class="card card-body w-full max-w-lg">
            @if (IsHandlingDone)
            {
                <div class="sm:mx-auto sm:w-full sm:max-w-sm mb-5">
                    <img class="mx-auto h-16 w-auto" src="/logolong.webp" alt="Moonlight">
                    <h2 class="mt-6 text-center text-2xl font-bold leading-9 tracking-tight text-gray-100">Login to access your account</h2>
                </div>

                <div class="flex justify-center">
                    <p class="mt-3 text-center text-md text-gray-400">
                        Login successful. You can close this window now
                    </p>
                </div>
            }
            else
            {
                <div class="flex justify-center">
                    <div id="loader"></div>
                </div>
            }
        </div>

    </div>
}

@code
{
    [SupplyParameterFromQuery(Name = "code")]
    [Parameter]
    public string? Code { get; set; }

    private bool IsAuthenticating = false;
    private bool IsHandlingDone = false;

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (!firstRender)
            return;

        if (Code == null)
            return;

        var authHandleData = await HttpApiClient.PostJson<OAuth2HandleResponse>("api/auth", new OAuth2HandleRequest()
        {
            Code = Code
        });

        await LocalStorageService.SetString("AccessToken", authHandleData.AccessToken);
        await LocalStorageService.SetString("RefreshToken", authHandleData.RefreshToken);
        await LocalStorageService.Set("ExpiresAt", authHandleData.ExpiresAt);
        
        try
        {
            await WindowService.Close();
        }
        finally
        {
            IsHandlingDone = true;
            await InvokeAsync(StateHasChanged);

            Navigation.NavigateTo("/", true);
        }
    }

    private async Task StartAuth(WButton _)
    {
        var authStartData = await HttpApiClient.GetJson<OAuth2StartResponse>("api/auth");

        var uri = authStartData.Endpoint
                  + $"?client_id={authStartData.ClientId}" +
                  $"&redirect_uri={authStartData.RedirectUri}" +
                  $"&response_type=code";

        Navigation.NavigateTo(uri, true);
        return;
        
        try
        {
            await WindowService.Open(
                uri,
                "OAuth2 Flow",
                600,
                450
            );

            IsAuthenticating = true;
            await InvokeAsync(StateHasChanged);

            Task.Run(async () =>
            {
                while (true)
                {
                    await Task.Delay(1000);

                    try
                    {
                        if(!await LocalStorageService.ContainsKey("AccessToken"))
                            continue;
                        
                        if (HttpClient.DefaultRequestHeaders.Contains("Authorization"))
                            HttpClient.DefaultRequestHeaders.Remove("Authorization");

                        HttpClient.DefaultRequestHeaders.Add("Authorization", "Bearer " + await LocalStorageService.GetString("AccessToken"));

                        var res = await HttpClient.GetAsync("api/auth/check");

                        if (res.IsSuccessStatusCode)
                            break;
                    }
                    catch (Exception e)
                    {
                        Console.WriteLine(e);
                    }
                }
                
                Navigation.NavigateTo(Navigation.Uri, true);
            });
        }
        catch (Exception)
        {
            Navigation.NavigateTo(uri, true);
        }
    }
}