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

import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.*
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.unit.dp
import androidx.hilt.navigation.compose.hiltViewModel
import com.craigvg.lichun_android.domain.models.Person
import com.craigvg.lichun_android.ui.screens.dating.components.*
import com.craigvg.lichun_android.ui.theme.AppColors
import com.craigvg.lichun_android.ui.theme.AppSpacing
import com.craigvg.lichun_android.ui.theme.AppTypography
import com.craigvg.lichun_android.viewmodel.PlayerViewModel
import androidx.lifecycle.compose.collectAsStateWithLifecycle

/**
 * Dating screen - Swipe dating and relationships
 * Ported from iOS DatingView.swift
 */
@Composable
fun DatingScreen(
    playerViewModel: PlayerViewModel = hiltViewModel(),
    onViewRelationship: (String) -> Unit = {},
    onStartChat: (String) -> Unit = {},
    onGoOnDate: (String) -> Unit = {}
) {
    val relationships by playerViewModel.relationships.collectAsStateWithLifecycle()
    val romanticRelationships by playerViewModel.romanticRelationships.collectAsStateWithLifecycle()
    val swipeCharacter by playerViewModel.swipeCharacter.collectAsStateWithLifecycle()

    var selectedTab by remember { mutableStateOf(0) }
    val tabs = listOf("Swipe", "Relationships")

    Column(
        modifier = Modifier
            .fillMaxSize()
            .background(AppColors.background)
    ) {
        TabRow(
            selectedTabIndex = selectedTab,
            containerColor = AppColors.surfaceElevated,
            contentColor = AppColors.primaryText
        ) {
            tabs.forEachIndexed { index, title ->
                Tab(
                    selected = selectedTab == index,
                    onClick = { selectedTab = index },
                    text = {
                        Text(
                            text = title,
                            style = AppTypography.captionBold,
                            color = if (selectedTab == index) AppColors.primary else AppColors.secondaryText
                        )
                    }
                )
            }
        }

        when (selectedTab) {
            0 -> SwipeDatingTab(swipeCharacter, playerViewModel)
            1 -> RelationshipsTab(
                romanticRelationships = romanticRelationships,
                allRelationships = relationships,
                onViewRelationship = onViewRelationship,
                onStartChat = onStartChat,
                onGoOnDate = onGoOnDate
            )
        }
    }
}

@Composable
fun SwipeDatingTab(swipeCharacter: Person?, playerViewModel: PlayerViewModel) {
    Box(
        modifier = Modifier.fillMaxSize(),
        contentAlignment = Alignment.Center
    ) {
        if (swipeCharacter != null) {
            SwipeCardSimple(person = swipeCharacter, playerViewModel = playerViewModel)
        } else {
            EmptySwipeState()
        }
    }
}

@Composable
fun SwipeCardSimple(person: Person, playerViewModel: PlayerViewModel) {
    Card(
        modifier = Modifier
            .fillMaxWidth(0.9f)
            .fillMaxHeight(0.8f),
        shape = RoundedCornerShape(AppSpacing.largeCornerRadius),
        colors = CardDefaults.cardColors(containerColor = AppColors.surfaceElevated),
        elevation = CardDefaults.cardElevation(defaultElevation = 8.dp)
    ) {
        Column(modifier = Modifier.fillMaxSize()) {
            // Profile image area
            Box(
                modifier = Modifier
                    .fillMaxWidth()
                    .weight(1f)
                    .background(
                        Brush.linearGradient(
                            colors = listOf(AppColors.primary, AppColors.secondary)
                        )
                    ),
                contentAlignment = Alignment.Center
            ) {
                com.craigvg.lichun_android.ui.components.images.CharacterAvatar(
                    imageUrl = person.image,
                    firstName = person.firstname,
                    lastName = person.lastname,
                    size = 160.dp,
                    showBorder = false,
                    showGlow = false
                )
            }

            // Info section
            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(AppSpacing.md)
            ) {
                Row(verticalAlignment = Alignment.CenterVertically) {
                    Text(
                        text = person.fullName,
                        style = AppTypography.title,
                        color = AppColors.primaryText
                    )
                    Spacer(modifier = Modifier.width(8.dp))
                    Text(
                        text = "${person.ageYears}",
                        style = AppTypography.headline,
                        color = AppColors.secondaryText
                    )
                }

                if (person.bio.isNotEmpty()) {
                    Spacer(modifier = Modifier.height(AppSpacing.xs))
                    Text(
                        text = person.bio,
                        style = AppTypography.body,
                        color = AppColors.secondaryText,
                        maxLines = 2
                    )
                }

                if (person.interests.isNotEmpty()) {
                    Spacer(modifier = Modifier.height(AppSpacing.sm))
                    Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) {
                        person.interests.take(3).forEach { interest ->
                            InterestTag(text = interest)
                        }
                    }
                }

                person.compatibilityScore?.let { score ->
                    Spacer(modifier = Modifier.height(AppSpacing.sm))
                    CompatibilityBadge(score = score)
                }

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

                // Action buttons
                QuickActionsBar(
                    onPass = {
                        playerViewModel.swipeLeft(person.id)
                        playerViewModel.fetchSwipeCharacter()
                    },
                    onLike = {
                        playerViewModel.swipeRight(person.id)
                        playerViewModel.fetchSwipeCharacter()
                    },
                    onSuperLike = {
                        playerViewModel.swipeRight(person.id)
                        playerViewModel.fetchSwipeCharacter()
                    },
                    modifier = Modifier.fillMaxWidth()
                )
            }
        }
    }
}

@Composable
fun EmptySwipeState() {
    Column(
        horizontalAlignment = Alignment.CenterHorizontally,
        modifier = Modifier.padding(AppSpacing.xl)
    ) {
        Icon(
            imageVector = Icons.Default.FavoriteBorder,
            contentDescription = null,
            tint = AppColors.disabledText,
            modifier = Modifier.size(80.dp)
        )
        Spacer(modifier = Modifier.height(AppSpacing.md))
        Text(
            text = "No more profiles",
            style = AppTypography.headline,
            color = AppColors.secondaryText,
            textAlign = TextAlign.Center
        )
        Spacer(modifier = Modifier.height(AppSpacing.xs))
        Text(
            text = "Check back later for new matches",
            style = AppTypography.body,
            color = AppColors.disabledText,
            textAlign = TextAlign.Center
        )
    }
}

@Composable
fun RelationshipsTab(
    romanticRelationships: List<Person>,
    allRelationships: List<Person>,
    onViewRelationship: (String) -> Unit = {},
    onStartChat: (String) -> Unit = {},
    onGoOnDate: (String) -> Unit = {}
) {
    LazyColumn(
        modifier = Modifier
            .fillMaxSize()
            .padding(AppSpacing.md),
        verticalArrangement = Arrangement.spacedBy(AppSpacing.sm)
    ) {
        if (romanticRelationships.isNotEmpty()) {
            item {
                Text(
                    text = "\u2764\uFE0F Romantic",
                    style = AppTypography.headline,
                    color = AppColors.primaryText
                )
                Spacer(modifier = Modifier.height(AppSpacing.xs))
            }
            items(romanticRelationships) { person ->
                RelationshipSnapshotCard(
                    person = person,
                    onViewDetail = { onViewRelationship(person.id) },
                    onMessage = { onStartChat(person.id) },
                    onGoOnDate = { onGoOnDate(person.id) }
                )
            }
            item { Spacer(modifier = Modifier.height(AppSpacing.md)) }
        }

        if (allRelationships.isNotEmpty()) {
            item {
                Text(
                    text = "\uD83D\uDC65 All Connections",
                    style = AppTypography.headline,
                    color = AppColors.primaryText
                )
                Spacer(modifier = Modifier.height(AppSpacing.xs))
            }
            items(allRelationships) { person ->
                RelationshipSnapshotCard(
                    person = person,
                    onViewDetail = { onViewRelationship(person.id) },
                    onMessage = { onStartChat(person.id) },
                    onGoOnDate = { onGoOnDate(person.id) }
                )
            }
        }

        if (romanticRelationships.isEmpty() && allRelationships.isEmpty()) {
            item {
                Box(
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(300.dp),
                    contentAlignment = Alignment.Center
                ) {
                    Column(horizontalAlignment = Alignment.CenterHorizontally) {
                        Icon(
                            imageVector = Icons.Default.People,
                            contentDescription = null,
                            tint = AppColors.disabledText,
                            modifier = Modifier.size(64.dp)
                        )
                        Spacer(modifier = Modifier.height(AppSpacing.md))
                        Text(
                            text = "No relationships yet",
                            style = AppTypography.headline,
                            color = AppColors.secondaryText
                        )
                        Text(
                            text = "Start swiping to meet people",
                            style = AppTypography.body,
                            color = AppColors.disabledText
                        )
                    }
                }
            }
        }
    }
}

@Composable
fun InterestTag(text: String) {
    Surface(
        shape = RoundedCornerShape(AppSpacing.pillCornerRadius),
        color = AppColors.accent.copy(alpha = 0.2f)
    ) {
        Text(
            text = text,
            style = AppTypography.caption,
            color = AppColors.accent,
            modifier = Modifier.padding(horizontal = 12.dp, vertical = 4.dp)
        )
    }
}