@page "/account/login"
@layout AuthenticationLayout
@using Indotalent.Shared.Consts
@using Microsoft.JSInterop
@using Indotalent.Infrastructure.Authentication.Identity
@using Microsoft.Extensions.Options
@inject IJSRuntime JSRuntime
@inject IOptions<IdentitySettingsModel> IdentityOptions
@inject NavigationManager Navigation
@inject ISnackbar Snackbar

<PageTitle>Sign In - @GlobalConsts.AppInitial</PageTitle>

<style>
    /* ===== PAGE HEADER ===== */
    .page-header {
        text-align: center;
        margin-bottom: 1.5rem;
    }

    .page-header h2 {
        font-size: 1.5rem;
        font-weight: 700;
        color: #0f172a;
        margin-bottom: 0.25rem;
    }

    .page-header p {
        font-size: 0.8125rem;
        color: #64748b;
        margin: 0;
    }

    /* ===== FORM LABELS ===== */
    .form-label {
        font-size: 0.8125rem;
        font-weight: 600;
        color: #475569;
        margin-bottom: 0.375rem;
        display: block;
    }

    .form-label-row {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 0.375rem;
    }

    .form-label-row .form-label {
        margin-bottom: 0;
    }

    .forgot-link {
        font-size: 0.75rem;
        color: #64748b;
        text-decoration: none;
        cursor: pointer;
        transition: color 0.2s;
        font-weight: 500;
    }

    .forgot-link:hover {
        color: #6366F1;
        text-decoration: underline;
    }

    /* ===== REMEMBER ROW ===== */
    .remember-row {
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    /* ===== DIVIDER ===== */
    .divider-or {
        display: flex;
        align-items: center;
        gap: 1rem;
        margin: 1.5rem 0;
    }

    .divider-or::before,
    .divider-or::after {
        content: '';
        flex: 1;
        height: 1px;
        background: #e2e8f0;
    }

    .divider-or span {
        font-size: 0.75rem;
        color: #94a3b8;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 0.05em;
    }

    /* ===== AUTH LINK ===== */
    .auth-link {
        color: #6366F1;
        font-size: 0.875rem;
        font-weight: 600;
        text-decoration: none;
        cursor: pointer;
        transition: color 0.2s;
        margin-left: 0.25rem;
    }

    .auth-link:hover {
        color: #4f51d4;
        text-decoration: underline;
    }

    /* ===== GOOGLE BUTTON ===== */
    .btn-google {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0.5rem;
        padding: 0.625rem 1rem;
        background: transparent;
        color: #6366F1;
        font-size: 0.875rem;
        font-weight: 500;
        border-radius: 0.5rem;
        border: 1.5px solid #c7c3ff;
        transition: all 0.2s;
        cursor: pointer;
        width: 100%;
        font-family: "Poppins", sans-serif;
    }

    .btn-google:hover {
        border-color: #6366F1;
        background: #f5f3ff;
    }

    /* ===== MISC ===== */
    .w-100 { width: 100%; }
    .mb-2 { margin-bottom: 0.5rem; }
    .mb-4 { margin-bottom: 1rem; }
    .mb-5 { margin-bottom: 1.25rem; }
    .mb-6 { margin-bottom: 1.5rem; }
    .mt-4 { margin-top: 1rem; }
    .text-center { text-align: center; }
    .text-muted { color: #64748b; }
</style>

<div class="page-header">
    <h2>Sign In</h2>
    <p>Enter your credentials to access your account</p>
</div>

<MudForm @ref="form" @bind-IsValid="@success" Validation="@(new Func<EditContext, Task<bool>>(ValidateForm))" Class="w-100">

    <span class="form-label">Email Address</span>
    <MudTextField T="string"
                  @bind-Value="model.Email"
                  Variant="Variant.Outlined"
                  Placeholder="you@company.com"
                  Margin="Margin.Dense"
                  Adornment="Adornment.Start"
                  AdornmentIcon="@Icons.Material.Filled.Email"
                  Required="true"
                  For="@(() => model.Email)"
                  Class="mb-4"
                  Style="border-radius: 0.5rem;" />

    <div class="form-label-row">
        <span class="form-label">Password</span>
        <MudLink Href="/account/forgot-password" Class="forgot-link">Forgot password?</MudLink>
    </div>
    <MudTextField T="string"
                  @bind-Value="model.Password"
                  Variant="Variant.Outlined"
                  Placeholder="Enter your password"
                  Margin="Margin.Dense"
                  Adornment="Adornment.Start"
                  AdornmentIcon="@Icons.Material.Filled.Lock"
                  InputType="@(showPassword ? InputType.Text : InputType.Password)"
                  AdornmentEndIcon="@(showPassword? Icons.Material.Filled.Visibility : Icons.Material.Filled.VisibilityOff)"
                  OnAdornmentEndClick="() => showPassword = !showPassword"
                  Required="true"
                  For="@(() => model.Password)"
                  Class="mb-5"
                  Style="border-radius: 0.5rem;" />

    <div class="remember-row mb-5">
        <MudCheckBox T="bool"
                     @bind-Value="rememberMe"
                     Label="Remember me"
                     Color="Color.Primary"
                     Dense="true" />
    </div>

    <MudButton Variant="Variant.Filled"
               Color="Color.Primary"
               Size="Size.Large"
               FullWidth="true"
               Disabled="!success || isProcessing"
               OnClick="HandleLogin"
               Style="text-transform:none; border-radius: 0.5rem; height: 48px; font-weight: 600;">
        @if (isProcessing)
        {
            <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" Color="Color.Inherit" />
            <span class="ms-2">Signing in...</span>
        }
        else
        {
            <span>Sign In</span>
            <svg class="ms-2" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                <polyline points="13 7 18 12 13 17" />
                <polyline points="6 12 18 12" />
            </svg>
        }
    </MudButton>

    @if (IdentityOptions.Value.SsoFirebase.IsUsed)
    {
        <div class="divider-or">
            <span>Or continue with</span>
        </div>

        <MudButton Variant="Variant.Outlined"
                   FullWidth="true"
                   Size="Size.Large"
                   Disabled="isProcessing"
                   OnClick="HandleFirebaseGoogleLogin"
                   StartIcon="@Icons.Custom.Brands.Google"
                   Style="text-transform:none; border-radius: 0.5rem; height: 44px; border: 1.5px solid #c7c3ff; color: #6366F1; font-weight: 500;"
                   Class="mb-2">
            Sign in with Google
        </MudButton>
    }
</MudForm>

<div class="text-center mt-4">
    <MudText Typo="Typo.body2">
        Don't have an account?
        <MudLink Href="/account/register" Style="color: #6366F1; font-weight: 600; margin-left: 0.25rem;">Create one</MudLink>
    </MudText>
</div>

@code {
    private MudForm form = default!;
    private bool success;
    private bool isProcessing;
    private bool showPassword;
    private bool rememberMe;
    private LoginModel model = new();

    private async Task<bool> ValidateForm(EditContext context) => await Task.FromResult(true);

    private async Task HandleLogin()
    {
        await form.Validate();
        if (!success) return;
        isProcessing = true;
        StateHasChanged();

        var result = await JSRuntime.InvokeAsync<ApiJSRuntimeResponse>("apiAccountSignIn", model.Email, model.Password, rememberMe);
        ProcessLoginResult(result);
    }

    private async Task HandleFirebaseGoogleLogin()
    {
        isProcessing = true;
        StateHasChanged();

        var firebaseUser = await JSRuntime.InvokeAsync<FirebaseUserResponse>("signInWithGoogle");

        if (firebaseUser == null || string.IsNullOrEmpty(firebaseUser.Email))
        {
            Snackbar.Add("Google Sign-In failed or cancelled.", Severity.Error);
            isProcessing = false;
            return;
        }

        var checkResult = await JSRuntime.InvokeAsync<ActiveCheckResponse>("apiCheckActiveUser", firebaseUser.Email);
        bool openForPublic = IdentityOptions.Value.SsoFirebase.OpenForPublic;

        if (checkResult.Exists)
        {
            if (checkResult.IsActive)
            {
                await ExecuteSsoSignIn(firebaseUser.Email);
            }
            else
            {
                Snackbar.Add("Account is registered but not active.", Severity.Warning);
                isProcessing = false;
            }
        }
        else
        {
            var registerResult = await JSRuntime.InvokeAsync<ApiJSRuntimeResponse>(
                "apiAccountSignUpSso",
                firebaseUser.Email,
                firebaseUser.Email,
                openForPublic
            );

            if (registerResult.Status == 200)
            {
                if (openForPublic)
                {
                    await ExecuteSsoSignIn(firebaseUser.Email);
                }
                else
                {
                    Snackbar.Add("Registration successful. Please wait for admin approval.", Severity.Info);
                    isProcessing = false;
                }
            }
            else
            {
                Snackbar.Add("Failed to auto-register account.", Severity.Error);
                isProcessing = false;
            }
        }
    }

    private async Task ExecuteSsoSignIn(string email)
    {
        var result = await JSRuntime.InvokeAsync<ApiJSRuntimeResponse>("apiAccountSsoSignIn", email);
        ProcessLoginResult(result);
    }

    private void ProcessLoginResult(ApiJSRuntimeResponse result)
    {
        if (result.Status == 200)
        {
            Snackbar.Add(result.Title ?? "Login successful!", Severity.Success);
            Task.Run(async () =>
            {
                await Task.Delay(500);
                Navigation.NavigateTo("/home", forceLoad: true);
            });
        }
        else
        {
            Snackbar.Add(result.Title ?? "Sign in failed.", Severity.Error);
            isProcessing = false;
        }
        StateHasChanged();
    }

    private class ApiJSRuntimeResponse { public int? Status { get; set; } public string? Title { get; set; } public string? Message { get; set; } }
    private class FirebaseUserResponse { public string? Email { get; set; } }
    private class ActiveCheckResponse { public bool Exists { get; set; } public bool IsActive { get; set; } }
    private class LoginModel { public string Email { get; set; } = ""; public string Password { get; set; } = ""; }
}

<script>
    window.apiAccountSignIn = async (email, password, rememberMe) => {
        try {
            const response = await fetch('/api/account/signin', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({ email, password, rememberMe }),
                credentials: 'include'
            });
            const result = await response.json();
            return { status: response.status, title: result.title };
        } catch (error) {
            return { status: 500, title: 'Network error' };
        }
    };

    window.apiCheckActiveUser = async (email) => {
        try {
            const response = await fetch(`/api/account/active-user-exists?email=${encodeURIComponent(email)}`);
            return await response.json();
        } catch (error) {
            return { exists: false, isActive: false };
        }
    };

    window.apiAccountSignUpSso = async (email, fullName, isOpenForPublic) => {
        try {
            const response = await fetch('/api/account/signup', {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                body: JSON.stringify({
                    email: email,
                    fullName: fullName,
                    password: 'SSO_AUTO_GENERATED_PASSWORD_123!',
                    isActive: isOpenForPublic,
                    emailConfirmed: isOpenForPublic
                })
            });
            const result = await response.json();
            return { status: response.status, message: result.message };
        } catch (error) {
            return { status: 500 };
        }
    };

    window.apiAccountSsoSignIn = async (email) => {
        try {
            const response = await fetch(`/api/account/signin-sso?email=${encodeURIComponent(email)}`, {
                method: 'POST',
                headers: { 'Content-Type': 'application/json' },
                credentials: 'include'
            });
            const result = await response.json();
            return { status: response.status, title: result.title };
        } catch (error) {
            return { status: 500, title: 'SSO Network error' };
        }
    };
</script>