package com.example.oxygenhub.ui

import androidx.compose.foundation.layout.*

import androidx.compose.foundation.text.KeyboardOptions

import androidx.compose.material.icons.Icons

import androidx.compose.material.icons.filled.Lock

import androidx.compose.material.icons.filled.Person

import androidx.compose.material3.*

import androidx.compose.runtime.*

import androidx.compose.ui.Alignment

import androidx.compose.ui.Modifier

import androidx.compose.ui.text.font.FontWeight

import androidx.compose.ui.text.input.KeyboardType

import androidx.compose.ui.text.input.PasswordVisualTransformation

import androidx.compose.ui.unit.dp

import androidx.compose.ui.unit.sp

@Composable

fun LoginScreen(onLoginSuccess: () -> Unit) {

    var username by remember { mutableStateOf("") }

    var password by remember { mutableStateOf("") }

    var serverUrl by remember { mutableStateOf("https://oxygenhub.io") }

    var isLoading by remember { mutableStateOf(false) }

    Column(

        modifier = Modifier

            .fillMaxSize()

            .padding(24.dp),

        horizontalAlignment = Alignment.CenterHorizontally,

        verticalArrangement = Arrangement.Center

    ) {

        Text(

            text = "OxygenHub",

            fontSize = 36.sp,

            fontWeight = FontWeight.Bold,

            color = MaterialTheme.colorScheme.primary

        )

        Spacer(modifier = Modifier.height(8.dp))

        Text(

            text = "Sign in to delegate your identity",

            style = MaterialTheme.typography.bodyLarge,

            color = MaterialTheme.colorScheme.onSurfaceVariant

        )

        Spacer(modifier = Modifier.height(48.dp))

        OutlinedTextField(

            value = serverUrl,

            onValueChange = { serverUrl = it },

            label = { Text("Server URL") },

            modifier = Modifier.fillMaxWidth(),

            singleLine = true

        )

        Spacer(modifier = Modifier.height(16.dp))

        OutlinedTextField(

            value = username,

            onValueChange = { username = it },

            label = { Text("Username or Email") },

            leadingIcon = { Icon(Icons.Filled.Person, contentDescription = "Username") },

            modifier = Modifier.fillMaxWidth(),

            singleLine = true

        )

        Spacer(modifier = Modifier.height(16.dp))

        OutlinedTextField(

            value = password,

            onValueChange = { password = it },

            label = { Text("Password") },

            leadingIcon = { Icon(Icons.Filled.Lock, contentDescription = "Password") },

            visualTransformation = PasswordVisualTransformation(),

            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Password),

            modifier = Modifier.fillMaxWidth(),

            singleLine = true

        )

        Spacer(modifier = Modifier.height(32.dp))

        Button(

            onClick = {

                isLoading = true

                // TODO: Wire this up to rust-core to authenticate with the API

                // For now, we simulate a successful login immediately

                onLoginSuccess()

            },

            modifier = Modifier

                .fillMaxWidth()

                .height(50.dp),

            enabled = username.isNotBlank() && password.isNotBlank()

        ) {

            if (isLoading) {

                CircularProgressIndicator(

                    modifier = Modifier.size(24.dp),

                    color = MaterialTheme.colorScheme.onPrimary

                )

            } else {

                Text("Log In", fontSize = 16.sp)

            }

        }

    }

}