package com.tsmobile.app.ui.components

import androidx.compose.foundation.layout.*
import androidx.compose.material3.*
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.text.style.TextAlign
import com.tsmobile.app.ui.theme.UiTokens

/**
 * 空状态视图。
 *
 * 对应 docs/implementation/12_主题与收尾.md 12.2 空状态处理。
 * 用于频道列表为空、消息列表为空、最近连接为空等场景。
 */
@Composable
fun EmptyStateView(
    icon: ImageVector,
    title: String,
    subtitle: String = "",
    actionText: String? = null,
    onAction: (() -> Unit)? = null,
) {
    Column(
        modifier = Modifier
            .fillMaxWidth()
            .padding(UiTokens.Spacing.Huge),
        horizontalAlignment = Alignment.CenterHorizontally,
    ) {
        Icon(
            imageVector = icon,
            contentDescription = null,
            modifier = Modifier.size(UiTokens.Size.AppBarHeight),
            tint = MaterialTheme.colorScheme.outline,
        )
        Spacer(Modifier.height(UiTokens.Spacing.Large))
        Text(
            text = title,
            style = MaterialTheme.typography.titleMedium,
            color = MaterialTheme.colorScheme.onSurfaceVariant,
            textAlign = TextAlign.Center,
        )
        if (subtitle.isNotEmpty()) {
            Spacer(Modifier.height(UiTokens.Spacing.Small))
            Text(
                text = subtitle,
                style = MaterialTheme.typography.bodyMedium,
                color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.7f),
                textAlign = TextAlign.Center,
            )
        }
        if (actionText != null && onAction != null) {
            Spacer(Modifier.height(UiTokens.Spacing.Large))
            TextButton(onClick = onAction) {
                Text(actionText)
            }
        }
    }
}
