package com.suno.android.ui.screens.hooks.overlay

import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.border
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.hapticfeedback.HapticFeedbackType
import androidx.compose.ui.platform.LocalHapticFeedback
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import com.suno.android.common_core_utils.model.Url
import com.suno.android.common_core_utils.model.UserHandle
import com.suno.android.common_data.mappers.hooks.LocalHookData
import com.suno.android.common_ui.components.images.ProfileAvatarImage
import com.suno.android.common_ui.theme.ExtendedTheme
import com.suno.android.common_res.R as CommonResR

@Composable
fun HookCreator(
    creator: LocalHookData.Creator,
    showFollowButton: Boolean,
    onCreatorAttributionClick: (handle: UserHandle?) -> Unit,
    onFollowCreatorClick: () -> Unit,
) {
    creator.displayName?.takeIf { it.isNotBlank() }
        ?.let { displayName ->
            Row(
                verticalAlignment = Alignment.CenterVertically,
                horizontalArrangement = Arrangement.spacedBy(8.dp),
                modifier = Modifier.padding(end = 8.dp),
            ) {
                CreatorAttribution(
                    onCreatorAttributionClick = onCreatorAttributionClick,
                    creatorHandle = creator.handle,
                    creatorAvatarUrl = creator.avatarUrl,
                    creatorDisplayName = displayName,
                    modifier = Modifier.weight(
                        weight = 1f,
                        fill = false,
                    ),
                )
                AnimatedVisibility(
                    visible = showFollowButton,
                    exit = fadeOut(),
                ) {
                    FollowButton(onFollowCreatorClick = onFollowCreatorClick)
                }
            }
        }
}

@Composable
private fun CreatorAttribution(
    onCreatorAttributionClick: (UserHandle?) -> Unit,
    creatorHandle: UserHandle?,
    creatorAvatarUrl: Url?,
    creatorDisplayName: String,
    modifier: Modifier = Modifier,
) {
    val hapticFeedback = LocalHapticFeedback.current
    Row(
        verticalAlignment = Alignment.CenterVertically,
        horizontalArrangement = Arrangement.spacedBy(8.dp),
        modifier = modifier
            .clickable(
                interactionSource = remember { MutableInteractionSource() },
                indication = null,
            ) {
                hapticFeedback.performHapticFeedback(HapticFeedbackType.Confirm)
                onCreatorAttributionClick(creatorHandle)
            },
    ) {
        ProfileAvatarImage(
            modifier = Modifier.size(26.dp),
            avatarUrl = creatorAvatarUrl,
            displayName = creatorDisplayName,
            contentDescription = stringResource(CommonResR.string.creator_profile_name, creatorDisplayName),
        )
        Text(
            text = creatorDisplayName,
            color = Color.White,
            maxLines = 1,
            overflow = TextOverflow.Ellipsis,
            style = ExtendedTheme.typography.smallPlayerTitle,
        )
    }
}

@Composable
private fun FollowButton(
    onFollowCreatorClick: () -> Unit,
) {
    val hapticFeedback = LocalHapticFeedback.current
    Box(
        modifier = Modifier
            .border(1.dp, Color.White, RoundedCornerShape(50.dp))
            .clickable(
                interactionSource = remember { MutableInteractionSource() },
                indication = null,
                onClick = {
                    hapticFeedback.performHapticFeedback(HapticFeedbackType.Confirm)
                    onFollowCreatorClick()
                },
            )
            .padding(horizontal = 8.dp, vertical = 6.dp),
    ) {
        Text(
            text = stringResource(CommonResR.string.follow),
            color = Color.White,
            style = ExtendedTheme.typography.smallSubtitle,
        )
    }
}