package llc.arma.ble.app.ui.screen.password.view

import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.rounded.Visibility
import androidx.compose.material.icons.rounded.VisibilityOff
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.material3.TextField
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.text.input.PasswordVisualTransformation
import androidx.compose.ui.text.input.VisualTransformation
import androidx.compose.ui.unit.dp
import llc.arma.ble.app.ui.screen.password.ChangePasswordContract

@Composable
fun Display(
    onEvent: (ChangePasswordContract.Event) -> Unit,
    state: ChangePasswordContract.State
){

    Column(
        modifier = Modifier.padding(20.dp)
    ) {


        var passwordVisibility by remember {
            mutableStateOf(false)
        }
        var rePasswordVisibility by remember {
            mutableStateOf(false)
        }

        @Composable
        fun TrailingPasswordIcon(
            visible: Boolean,
            onClick: () -> Unit
        ) {
            IconButton(onClick = onClick) {
                Icon(
                    contentDescription = null,
                    imageVector = if (visible) {
                        Icons.Rounded.Visibility
                    } else {
                        Icons.Rounded.VisibilityOff
                    }
                )
            }
        }

        val isError = state.exception != null

        TextField(
            modifier = Modifier.fillMaxWidth(),
            singleLine = true,
            visualTransformation = if (passwordVisibility.not()) PasswordVisualTransformation() else VisualTransformation.None,
            value = state.password,
            onValueChange = {
                onEvent(ChangePasswordContract.Event.OnPasswordChanged(it))
            },
            keyboardOptions = KeyboardOptions(
                keyboardType = KeyboardType.NumberPassword,
                imeAction = ImeAction.Next),
            trailingIcon = {
                TrailingPasswordIcon(visible = passwordVisibility) {
                    passwordVisibility = passwordVisibility.not()
                }
            },
            isError = isError,
            label = {
                Text(text = "Пароль")
            },
            supportingText = {
                Row() {
                    Spacer(modifier = Modifier.weight(1f))

                    Text(
                        style = MaterialTheme.typography.bodyMedium,
                        text = "${state.password.length}/6"
                    )
                }
            }
        )

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

        TextField(
            modifier = Modifier.fillMaxWidth(),
            singleLine = true,
            visualTransformation = if (rePasswordVisibility.not()) PasswordVisualTransformation() else VisualTransformation.None,
            value = state.rePassword,
            onValueChange = {
                onEvent(ChangePasswordContract.Event.OnRePasswordChanged(it))
            },
            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.NumberPassword),
            trailingIcon = {
                TrailingPasswordIcon(visible = rePasswordVisibility) {
                    rePasswordVisibility = rePasswordVisibility.not()
                }
            },
            label = {
                Text(text = "Повторите пароль")
            },
            isError = isError,
            supportingText = {

                Row() {

                    if (isError) {
                        val text = when (state.exception) {
                            is ChangePasswordContract.State.ValidationException.WrongLength -> "Неверная длинна"
                            is ChangePasswordContract.State.ValidationException.PasswordsNotMatch -> "Пароли не совпадают"
                            null -> ""
                        }

                        Text(
                            style = MaterialTheme.typography.bodyMedium,
                            color = MaterialTheme.colorScheme.error,
                            text = text
                        )
                    }

                    Spacer(modifier = Modifier.weight(1f))

                    Text(
                        style = MaterialTheme.typography.bodyMedium,
                        text = "${state.rePassword.length}/6"
                    )

                }

            }
        )

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

        Box(
            modifier = Modifier
        ) {

            Surface(
                modifier = Modifier
                    .fillMaxWidth()
                    .height(50.dp),
                shape = CircleShape,
                color = MaterialTheme.colorScheme.primaryContainer,
                onClick = {
                    onEvent(ChangePasswordContract.Event.OnChange)
                }
            ) {

                Box(modifier = Modifier.fillMaxSize()) {

                    Text(
                        modifier = Modifier.align(Alignment.Center),
                        color = MaterialTheme.colorScheme.onPrimaryContainer,
                        style = MaterialTheme.typography.labelLarge,
                        text = "Применить"
                    )

                }

            }

        }

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

        Box(
            modifier = Modifier
        ) {

            Surface(
                modifier = Modifier
                    .fillMaxWidth()
                    .height(50.dp),
                shape = CircleShape,
                color = MaterialTheme.colorScheme.surfaceVariant,
                onClick = {
                    onEvent(ChangePasswordContract.Event.OnNavigateUp)
                }
            ) {

                Box(modifier = Modifier.fillMaxSize()) {

                    Text(
                        modifier = Modifier.align(Alignment.Center),
                        color = MaterialTheme.colorScheme.onSurfaceVariant,
                        style = MaterialTheme.typography.labelLarge,
                        text = "Отменить"
                    )

                }

            }

        }

    }

}