Talaria/app/src/main/java/dev/lonami/talaria/ui/screens/LoginScreen.kt

package dev.lonami.talaria.ui.screens

import androidx.compose.foundation.layout.*
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material.Button
import androidx.compose.material.Text
import androidx.compose.material.TextField
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.platform.LocalFocusManager
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import dev.lonami.talaria.R
import dev.lonami.talaria.ui.theme.TalariaTheme
import uniffi.talaria.requestLoginCode
import uniffi.talaria.signIn

enum class LoginStage {
    ASK_PHONE,
    ASK_CODE,
}

fun isPhoneValid(phone: String): Boolean = phone.trim('+', ' ').isNotEmpty()
fun isLoginCodeValid(code: String): Boolean = code.trim().count { it.isDigit() } == 5

@Composable
fun PhoneInput(
    phone: String,
    onPhoneChanged: (String) -> Unit,
    onSendCode: () -> Unit,
    modifier: Modifier = Modifier,
) {
    val focusManager = LocalFocusManager.current

    Column(modifier = modifier) {
        Text(stringResource(R.string.enter_phone))
        TextField(
            phone,
            label = { Text(stringResource(R.string.phone_international)) },
            placeholder = { Text(stringResource(R.string.phone_example)) },
            singleLine = true,
            keyboardOptions = KeyboardOptions(
                keyboardType = KeyboardType.Phone,
                imeAction = ImeAction.Done
            ),
            keyboardActions = KeyboardActions(onDone = { focusManager.clearFocus() }),
            modifier = Modifier.fillMaxWidth(),
            onValueChange = onPhoneChanged
        )
        Spacer(Modifier.height(16.dp))
        Button(
            enabled = isPhoneValid(phone),
            modifier = Modifier.fillMaxWidth(),
            onClick = onSendCode
        ) {
            Text(stringResource(R.string.send_otp))
        }
    }
}

@Composable
fun OtpInput(
    otp: String,
    onOtpChanged: (String) -> Unit,
    onConfirmOtp: () -> Unit,
    modifier: Modifier = Modifier,
) {
    val focusManager = LocalFocusManager.current

    Column(modifier = modifier) {
        Text(stringResource(R.string.enter_otp))
        TextField(
            otp,
            label = { Text(stringResource(R.string.otp)) },
            placeholder = { Text(stringResource(R.string.otp_example)) },
            singleLine = true,
            keyboardOptions = KeyboardOptions(
                keyboardType = KeyboardType.Number,
                imeAction = ImeAction.Done
            ),
            keyboardActions = KeyboardActions(onDone = { focusManager.clearFocus() }),
            modifier = Modifier.fillMaxWidth(),
            onValueChange = onOtpChanged
        )
        Spacer(Modifier.height(16.dp))
        Button(
            enabled = isLoginCodeValid(otp),
            modifier = Modifier.fillMaxWidth(),
            onClick = onConfirmOtp
        ) {
            Text(stringResource(R.string.do_login))
        }
    }
}

@Composable
fun LoginScreen(onConfirmOtp: () -> Unit, modifier: Modifier = Modifier) {
    var stage by remember { mutableStateOf(LoginStage.ASK_PHONE) }
    var phone by remember { mutableStateOf("") }
    var otp by remember { mutableStateOf("") }

    var tokenPtr by remember { mutableStateOf(0UL) }

    Column(
        modifier = modifier
            .fillMaxSize()
            .padding(16.dp),
        verticalArrangement = Arrangement.Center
    ) {
        Text(
            stringResource(R.string.welcome_to, stringResource(R.string.app_name)),
            fontSize = 24.sp,
            fontWeight = FontWeight.Bold,
            modifier = Modifier
                .fillMaxWidth()
                .wrapContentWidth(Alignment.CenterHorizontally)
                .padding(16.dp)
        )
        when (stage) {
            LoginStage.ASK_PHONE -> PhoneInput(
                phone,
                onPhoneChanged = { phone = it },
                onSendCode = {
                    tokenPtr = requestLoginCode(phone)
                    stage = LoginStage.ASK_CODE
                }
            )
            LoginStage.ASK_CODE -> OtpInput(
                otp,
                onOtpChanged = { otp = it },
                onConfirmOtp = {
                    signIn(tokenPtr, otp)
                    onConfirmOtp()
                }
            )
        }
    }
}

@Preview(showBackground = true)
@Composable
fun LoginPreview() {
    TalariaTheme {
        LoginScreen(onConfirmOtp = { })
    }
}