package com.craigvg.lichun_android.ui.screens.dating.components

import androidx.compose.animation.core.*
import androidx.compose.foundation.background
import androidx.compose.foundation.gestures.detectDragGestures
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Favorite
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.scale
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.graphicsLayer
import androidx.compose.ui.input.pointer.pointerInput
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import com.craigvg.lichun_android.domain.models.Person
import com.craigvg.lichun_android.ui.theme.AppColors
import com.craigvg.lichun_android.ui.theme.AppSpacing
import com.craigvg.lichun_android.ui.theme.AppTypography

/**
 * Match celebration overlay shown when two users like each other
 */
@Composable
fun MatchCard(
    matchedPerson: Person?,
    onDismiss: () -> Unit
) {
    val scale = remember { Animatable(0f) }
    val alpha = remember { Animatable(0f) }

    LaunchedEffect(Unit) {
        alpha.animateTo(1f, animationSpec = tween(200))
        scale.animateTo(
            targetValue = 1f,
            animationSpec = spring(
                dampingRatio = Spring.DampingRatioMediumBouncy,
                stiffness = Spring.StiffnessMedium
            )
        )
        kotlinx.coroutines.delay(2000)
        alpha.animateTo(0f, animationSpec = tween(300))
        onDismiss()
    }

    Box(
        modifier = Modifier
            .fillMaxSize()
            .background(Color.Black.copy(alpha = 0.6f * alpha.value))
            .pointerInput(Unit) {
                detectDragGestures { _, _ -> }
            },
        contentAlignment = Alignment.Center
    ) {
        Column(
            horizontalAlignment = Alignment.CenterHorizontally,
            modifier = Modifier
                .scale(scale.value)
                .graphicsLayer { this.alpha = alpha.value }
        ) {
            Icon(
                imageVector = Icons.Default.Favorite,
                contentDescription = null,
                tint = AppColors.primary,
                modifier = Modifier.size(80.dp)
            )

            Spacer(modifier = Modifier.height(AppSpacing.md))

            Text(
                text = "It's a Match!",
                style = AppTypography.displayTitle,
                color = Color.White
            )

            matchedPerson?.let { person ->
                Spacer(modifier = Modifier.height(AppSpacing.sm))
                Text(
                    text = "You and ${person.firstname} liked each other",
                    style = AppTypography.body,
                    color = Color.White.copy(alpha = 0.8f),
                    textAlign = TextAlign.Center
                )
            }

            Spacer(modifier = Modifier.height(AppSpacing.lg))

            Button(
                onClick = onDismiss,
                colors = ButtonDefaults.buttonColors(
                    containerColor = AppColors.primary
                ),
                shape = RoundedCornerShape(AppSpacing.cornerRadius)
            ) {
                Text("Keep Swiping", style = AppTypography.button)
            }
        }
    }
}