package com.suno.android.common_ui.components.text_fields

import androidx.compose.animation.core.animateFloatAsState
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.IntrinsicSize
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.defaultMinSize
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.BasicText
import androidx.compose.foundation.text.BasicTextField
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.foundation.text.TextAutoSize
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.graphics.SolidColor
import androidx.compose.ui.graphics.painter.Painter
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.res.vectorResource
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.suno.android.common_ui.R
import com.suno.android.common_ui.theme.ExtendedTheme

@Composable
fun OneLineTextField(
    value: String,
    placeholder: String,
    onValueChange: (String) -> Unit,
    modifier: Modifier = Modifier,
    leadingPainter: Painter? = null,
    keyboardActions: KeyboardActions = KeyboardActions.Default,
    keyboardOptions: KeyboardOptions = KeyboardOptions.Default,
) {
    BasicTextField(
        modifier = modifier
            .padding(horizontal = 16.dp, vertical = 12.dp)
            .defaultMinSize(minHeight = 44.dp)
            .height(IntrinsicSize.Min)
            .background(
                color = ExtendedTheme.colors.backgroundTertiary,
                shape = RoundedCornerShape(8.dp),
            ),
        value = value,
        onValueChange = onValueChange,
        textStyle = ExtendedTheme.typography.body.copy(color = ExtendedTheme.colors.textPrimary),
        maxLines = 1,
        keyboardOptions = keyboardOptions,
        keyboardActions = keyboardActions,
        cursorBrush = SolidColor(ExtendedTheme.colors.aukPink),
        decorationBox = @Composable { innerTextField ->
            Row(
                horizontalArrangement = Arrangement.spacedBy(4.dp),
                verticalAlignment = Alignment.CenterVertically,
                modifier = Modifier
                    .padding(horizontal = 8.dp)
                    .fillMaxHeight()
                    .background(
                        color = ExtendedTheme.colors.backgroundTertiary,
                        shape = RoundedCornerShape(8.dp),
                    ),
            ) {
                leadingPainter?.let {
                    Icon(
                        modifier = Modifier.size(24.dp),
                        painter = leadingPainter,
                        tint = ExtendedTheme.colors.textSecondary,
                        contentDescription = null,
                    )
                }
                Row(
                    modifier = Modifier.weight(1f),
                ) {
                    Box(
                        contentAlignment = Alignment.CenterStart,
                    ) {
                        innerTextField()
                        if (value.isEmpty()) {
                            BasicText(
                                text = placeholder,
                                style = ExtendedTheme.typography.body.copy(
                                    color = ExtendedTheme.colors.textSecondary,
                                ),
                                maxLines = 1,
                                autoSize = TextAutoSize.StepBased(
                                    maxFontSize = ExtendedTheme.typography.body.fontSize,
                                    minFontSize = 8.sp,
                                ),
                            )
                        }
                    }
                }

                val clearButtonAlpha by animateFloatAsState(
                    if (value.isNotEmpty()) {
                        1f
                    } else {
                        0f
                    },
                )

                IconButton(
                    onClick = {
                        onValueChange("")
                    },
                    enabled = clearButtonAlpha > .2f,
                    modifier = Modifier.alpha(clearButtonAlpha),
                ) {
                    Icon(
                        modifier = Modifier.size(24.dp),
                        imageVector = ImageVector.vectorResource(
                            id = R.drawable.close,
                        ),
                        tint = ExtendedTheme.colors.textTertiary,
                        contentDescription = stringResource(com.suno.android.common_res.R.string.clear_search),
                    )
                }
            }
        },
    )
}