package com.suno.android.ui.bottom_sheets.song_actions

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.layout.wrapContentHeight
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.painter.ColorPainter
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.stringResource
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import coil3.compose.AsyncImage
import com.braze.support.emptyToNull
import com.suno.android.common_core_utils.model.Url
import com.suno.android.common_ui.components.omni.CircleIconButton
import com.suno.android.common_ui.theme.ExtendedTheme
import com.suno.android.common_ui.theme.SunoTheme
import com.suno.android.common_res.R as CommonResR
import com.suno.android.common_ui.R as CommonUiR

@Composable
fun SongActionsTrayHeader(
    songTitle: String?,
    songImageUrl: Url?,
    songTags: String?,
    onClose: () -> Unit,
) {
    Column(
        modifier = Modifier.fillMaxWidth(),
        verticalArrangement = Arrangement.spacedBy(8.dp),
    ) {
        Column(
            verticalArrangement = Arrangement.spacedBy(8.dp),
        ) {
            Row(modifier = Modifier.fillMaxWidth(), verticalAlignment = Alignment.Top) {
                // Used to center image by balancing with end icon
                Box(modifier = Modifier.weight(1f))

                AsyncImage(
                    model = songImageUrl,
                    contentDescription = "Song Cover",
                    modifier = Modifier
                        .padding(top = 18.dp)
                        .height(136.dp)
                        .width(92.dp)
                        .clip(RoundedCornerShape(10.dp)),
                    placeholder = ColorPainter(ExtendedTheme.colors.backgroundSecondary),
                    error = ColorPainter(ExtendedTheme.colors.backgroundSecondary),
                    contentScale = ContentScale.Crop,
                )

                Row(
                    modifier = Modifier
                        .weight(1f)
                        .wrapContentHeight(),
                    horizontalArrangement = Arrangement.End,
                    verticalAlignment = Alignment.Top,
                ) {
                    CircleIconButton(
                        vectorDrawableResId = CommonUiR.drawable.close,
                        contentDescription = "Close",
                        onClick = { onClose() },
                    )
                }
            }

            Column(
                modifier = Modifier.fillMaxWidth(),
                verticalArrangement = Arrangement.spacedBy(4.dp),
                horizontalAlignment = Alignment.CenterHorizontally,
            ) {
                Text(
                    text = songTitle?.emptyToNull() ?: stringResource(CommonResR.string.untitled),
                    style = ExtendedTheme.typography.introCopy,
                    maxLines = 2,
                    overflow = TextOverflow.Ellipsis,
                    modifier = Modifier.align(Alignment.CenterHorizontally),
                )
                songTags?.let { SongTagsText(tags = it) }
            }
        }
    }
}

@Preview
@Composable
private fun SongActionsTrayHeader_Preview() {
    SunoTheme {
        Column(modifier = Modifier.fillMaxWidth()) {
            SongActionsTrayHeader(
                songTitle = "This is the greatest song ever",
                songImageUrl = null,
                songTags = "vibes electronic",
                onClose = {},
            )
        }
    }
}