package com.radiola.ui.history

import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.Crossfade
import androidx.compose.animation.fadeIn
import androidx.compose.animation.slideInVertically
import androidx.compose.foundation.ExperimentalFoundationApi
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Modifier
import androidx.compose.ui.text.SpanStyle
import androidx.compose.ui.text.buildAnnotatedString
import androidx.compose.ui.text.withStyle
import androidx.compose.ui.unit.dp
import androidx.hilt.navigation.compose.hiltViewModel
import com.composables.icons.lucide.History
import com.composables.icons.lucide.Lucide
import com.radiola.domain.model.Track
import com.radiola.ui.components.DeeplinkBottomSheet
import com.radiola.ui.components.EmptyState
import com.radiola.ui.components.SearchBar
import com.radiola.ui.components.TrackListItem
import com.radiola.ui.theme.RadiolaTheme

@OptIn(ExperimentalFoundationApi::class)
@Composable
fun HistoryScreen(
    modifier: Modifier = Modifier,
    viewModel: HistoryViewModel = hiltViewModel()
) {
    val history by viewModel.history.collectAsState()
    val searchQuery by viewModel.searchQuery.collectAsState()
    var selectedTrack by remember { mutableStateOf<Track?>(null) }
    val colors = RadiolaTheme.colors

    Column(
        modifier = modifier
            .fillMaxSize()
            .padding(horizontal = 20.dp)
    ) {
        // Двухцветный заголовок
        Text(
            text = buildAnnotatedString {
                withStyle(SpanStyle(color = colors.textPrimary)) { append("Исто") }
                withStyle(SpanStyle(color = colors.accent)) { append("рия") }
            },
            style = MaterialTheme.typography.headlineLarge,
            modifier = Modifier.padding(top = 20.dp, bottom = 16.dp)
        )

        SearchBar(
            query = searchQuery,
            onQueryChange = viewModel::onSearchQueryChange,
            placeholder = "Поиск в истории...",
            modifier = Modifier.padding(bottom = 16.dp)
        )

        Crossfade(
            targetState = history.isEmpty(),
            label = "historyState"
        ) { isEmpty ->
            if (isEmpty) {
                AnimatedVisibility(
                    visible = true,
                    enter = fadeIn() + slideInVertically()
                ) {
                    EmptyState(
                        message = "История пуста",
                        icon = Lucide.History,
                        modifier = Modifier.fillMaxSize()
                    )
                }
            } else {
                LazyColumn(
                    modifier = Modifier.fillMaxSize(),
                    contentPadding = PaddingValues(bottom = 16.dp)
                ) {
                    items(history) { track ->
                        TrackListItem(
                            track = track,
                            onClick = { selectedTrack = track }
                        )
                        // Разделитель с низким alpha
                        HorizontalDivider(
                            color = colors.border.copy(alpha = 0.5f),
                            thickness = 0.5.dp
                        )
                    }
                }
            }
        }
    }

    if (selectedTrack != null) {
        DeeplinkBottomSheet(
            track = selectedTrack!!,
            onDismiss = { selectedTrack = null }
        )
    }
}
