package com.suno.android.common_ui.components.player

import androidx.compose.animation.animateColorAsState
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.material3.FilledIconButton
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButtonDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.painter.Painter
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import com.suno.android.common_ui.theme.BackgroundPrimary
import com.suno.android.common_ui.theme.DarkBackgroundPrimary
import com.suno.android.common_ui.theme.DarkTextPrimary
import com.suno.android.common_ui.theme.ExtendedTheme
import com.suno.android.common_ui.theme.SunoTheme
import com.suno.android.common_ui.theme.TextPrimary
import com.suno.android.common_ui.R as CommonUiR

/**
 * Action button used for actions in hooks feed and omni player.
 */
@Composable
fun PlayerActionButton(
    icon: Painter,
    contentDescription: String,
    onClick: () -> Unit,
    modifier: Modifier = Modifier,
    iconModifier: Modifier = Modifier,
    text: String? = null,
    isSelected: Boolean = false,
    colors: PlayerActionButtonColors = PlayerActionButtonColors.Default,
) {
    Column(
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.spacedBy(4.dp),
        modifier = modifier,
    ) {
        FilledIconButton(
            onClick = onClick,
            shape = CircleShape,
            modifier = Modifier.size(48.dp),
            colors = IconButtonDefaults.filledIconButtonColors(
                containerColor = animateColorAsState(
                    if (isSelected) colors.selectedContainer else colors.unselectedContainer,
                ).value,
                contentColor = animateColorAsState(
                    if (isSelected) colors.selectedContent else colors.unselectedContent,
                ).value,
            ),
        ) {
            Icon(
                painter = icon,
                contentDescription = contentDescription,
                modifier = iconModifier.size(24.dp),
            )
        }
        text?.let {
            Text(
                text = it.uppercase(),
                style = ExtendedTheme.typography.cardMeta.copy(letterSpacing = (-1).sp),
                color = Color.White,
            )
        }
    }
}

data class PlayerActionButtonColors(
    val selectedContainer: Color,
    val unselectedContainer: Color,
    val selectedContent: Color,
    val unselectedContent: Color,
) {
    companion object {
        val Default = PlayerActionButtonColors(
            selectedContainer = BackgroundPrimary,
            unselectedContainer = DarkBackgroundPrimary.copy(alpha = 0.40f),
            selectedContent = TextPrimary,
            unselectedContent = DarkTextPrimary,
        )
    }
}

@Preview
@Composable
private fun PlayerActionButton_Favorite_Preview() {
    SunoTheme {
        PlayerActionButton(
            icon = painterResource(CommonUiR.drawable.heart_v2),
            contentDescription = "Like",
            onClick = {},
            text = "123",
        )
    }
}

@Preview
@Composable
private fun PlayerActionButton_Favorite_Selected_Preview() {
    SunoTheme {
        PlayerActionButton(
            icon = painterResource(CommonUiR.drawable.heart_v2),
            contentDescription = "Like",
            onClick = {},
            text = "123",
            isSelected = true,
        )
    }
}

@Preview
@Composable
private fun PlayerActionButton_Share_Preview() {
    SunoTheme {
        PlayerActionButton(
            icon = painterResource(CommonUiR.drawable.share_arrow),
            contentDescription = "Share",
            text = "Share",
            onClick = {},
        )
    }
}