import android.os.Bundle
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.viewModels
import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.material3.icons.Icons
import androidx.compose.material3.icons.filled.Check
import androidx.compose.material3.icons.filled.Email
import androidx.compose.material3.icons.filled.Person
import androidx.compose.material3.icons.filled.Phone
import androidx.compose.material3.internal.ExperimentalMaterial3Api
import androidx.compose.material3.rememberScaffoldState
import androidx.compose.material3.rememberTextFieldColors
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.platform.LocalContext
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.platform.LocalLayoutDirection
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import com.example.featherandroidtasks.ui.theme.FeatherAndroidTasksTheme
import kotlinx.coroutines.launch

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            FeatherAndroidTasksTheme {
                // A surface container using the 'background' color from the theme
                Surface(
                    modifier = Modifier.fillMaxSize(),
                    color = MaterialTheme.colorScheme.background
                ) {
                    GoelectronixApp()
                }
            }
        }
    }
}

@Composable
fun GoelectronixApp() {
    // Create a ViewModel to hold the form state
    val viewModel: MyFormViewModel = viewModel()
    // Get the scaffold state for snackbar display
    val scaffoldState = rememberScaffoldState()

    // Create a coroutine scope for launching effects
    val coroutineScope = rememberCoroutineScope()

    LaunchedEffect(viewModel.submitEvent) {
        // Observe the submit event and show a snackbar when it occurs
        viewModel.submitEvent?.let { submitEvent ->
            coroutineScope.launch {
                scaffoldState.snackbarHostState.showSnackbar(
                    message = "IMEI: ${submitEvent.imei}",
                    actionLabel = "Dismiss"
                )
            }
        }
    }

    // Display the form UI
    GoelectronixForm(
        viewModel = viewModel,
        scaffoldState = scaffoldState
    )
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun GoelectronixForm(
    viewModel: MyFormViewModel,
    scaffoldState: ScaffoldState
) {
    Scaffold(
        scaffoldState = scaffoldState,
        topBar = {
            // Display the app bar with a centered title
            TopAppBar(
                title = {
                    Text(
                        text = stringResource(id = R.string.app_name),
                        color = Color.White,
                        fontWeight = FontWeight.Bold,
                        fontSize = 30.sp
                    )
                },
                backgroundColor = MaterialTheme.colorScheme.primary
            )
        },
        content = {
            // Display the form content
            Column(
                modifier = Modifier
                    .padding(16.dp)
                    .fillMaxSize(),
                verticalArrangement = Arrangement.Center
            ) {
                // Display the IMEI input field
                GoelectronixTextField(
                    value = viewModel.imei.value,
                    onValueChange = { newValue ->
                        viewModel.onImeiValueChanged(newValue)
                    },
                    label = "Enter IMEI Number",
                    keyboardType = KeyboardType.Number,
                    errorMessage = viewModel.imeiError.value
                )

                // Add vertical spacing
                Spacer(modifier = Modifier.height(20.dp))

                // Display the submit button
                GoelectronixButton(
                    onClick = {
                        // Call the view model function to submit the form
                        viewModel.onSubmitForm()
                    },
                    text = "Submit"
                )
            }
        }
    )
}

@OptIn(ExperimentalMaterial3Api::class)
@Composable
fun GoelectronixTextField(
    value: String,
    onValueChange: (String) -> Unit,
    label: String,
    keyboardType: KeyboardType,
    errorMessage: String?
) {
    val context = LocalContext.current

    // Get the appropriate colors for the text field
    val colors = rememberTextFieldColors(
        textColor = MaterialTheme.colorScheme.onSurface,
        backgroundColor = MaterialTheme.colorScheme.background
    )

    // Get the layout direction for RTL support
    val layoutDirection = LocalLayoutDirection.current

    // Display the text field with appropriate styling
    TextField(
        value = value,
        onValueChange = { onValueChange(it) },
        label = { Text(text = label) },
        isError = errorMessage != null,
        singleLine = true,
        keyboardOptions = KeyboardOptions.Default.copy(keyboardType = keyboardType),
        colors = colors,
        leadingIcon = {
            // Display appropriate leading icon based on keyboard type
            val icon = when (keyboardType) {
                KeyboardType.Number -> Icons.Default.Phone
                KeyboardType.Email -> Icons.Default.Email
                else -> Icons.Default.Person
            }
            Icon(imageVector = icon, contentDescription = null)
        },
        trailingIcon = {
            // Display error icon if there is an error
            if (errorMessage != null) {
                Icon(
                    painter = painterResource(id = R.drawable.ic_baseline_error_outline_24),
                    contentDescription = stringResource(id = R.string.error_icon)
                )
            }
        },
        modifier = Modifier
            .fillMaxWidth()
            .padding(bottom = 8.dp),
        visualTransformation = if (keyboardType == KeyboardType.Password) PasswordVisualTransformation() else VisualTransformation.None,
        keyboardActions = KeyboardActions(
            onDone = {
                // Handle the "Done" action if needed
                // In this example, clear focus to dismiss the keyboard
                // Note: This is just a placeholder, and you may need to customize it based on your requirements
                LocalDensity.current.run {
                    // Clear focus to dismiss the keyboard
                    FocusManagerAmbient.current.clearFocus()
                }
            }
        ),
        modifier = Modifier
            .fillMaxWidth()
            .padding(bottom = 8.dp)
    )

    // Display error message if there is one
    errorMessage?.let { message ->
        Text(
            text = message,
            color = MaterialTheme.colorScheme.error,
            modifier = Modifier.padding(start = 8.dp, top = 4.dp)
        )
    }
}

@Composable
fun GoelectronixButton(
    onClick: () -> Unit,
    text: String
) {
    // Display the elevated button with the specified text
    Button(
        onClick = { onClick() },
        modifier = Modifier.fillMaxWidth()
    ) {
        Text(text = text)
    }
}