// commonMain/kotlin/mg.dot.feufaro/SongNumberInput.kt
package mg.dot.feufaro

import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.material3.Button
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.unit.dp

@Composable
fun SongNumberInput(
    // Callback appelé lorsque le numéro de chant est validé
    onSongNumberConfirmed: (Int) -> Unit
) {
    // État local pour le texte saisi par l'utilisateur
    var songNumberText by remember { mutableStateOf("") }
    // État local pour afficher un message d'erreur
    var errorMessage by remember { mutableStateOf<String?>(null) }

    Column(
        modifier = Modifier
            .fillMaxWidth()
            .padding(16.dp)
    ) {
        // Champ de texte pour la saisie du numéro de chant
        OutlinedTextField(
            value = songNumberText,
            onValueChange = { newValue ->
                // N'accepte que les chiffres
                val filteredValue = newValue.filter { it.isDigit() }
                // Limite la saisie à 3 chiffres
                if (filteredValue.length <= 3) {
                    songNumberText = filteredValue
                    errorMessage = null // Réinitialise l'erreur si la saisie redevient valide
                }
            },
            label = { Text("Numéro du chant") },
            placeholder = { Text("Ex: 123") },
            keyboardOptions = KeyboardOptions(keyboardType = KeyboardType.Number), // Affiche un clavier numérique
            isError = errorMessage != null, // Indique visuellement une erreur
            modifier = Modifier.fillMaxWidth()
        )

        // Affichage du message d'erreur si présent
        errorMessage?.let {
            Text(
                text = it,
                color = MaterialTheme.colorScheme.error,
                style = MaterialTheme.typography.bodySmall,
                modifier = Modifier.padding(top = 4.dp)
            )
        }

        // Bouton de confirmation
        Button(
            onClick = {
                val number = songNumberText.toIntOrNull()
                if (number == null) {
                    errorMessage = "Veuillez entrer un nombre valide."
                } else if (songNumberText.length != 3) {
                    errorMessage = "Le numéro doit avoir 3 chiffres."
                } else if (number < 1 || number > 999) { // Exemple de plage valide si besoin
                    errorMessage = "Le numéro doit être entre 001 et 999."
                } else {
                    errorMessage = null
                    onSongNumberConfirmed(number) // Appelle le callback avec le numéro validé
                }
            },
            modifier = Modifier
                .fillMaxWidth()
                .padding(top = 16.dp)
        ) {
            Text("Confirmer")
        }
    }
}