//
//  MessagesEmptyState.swift
//  lichunWebsocket
//
//  Empty state for messages view
//

import SwiftUI

struct MessagesEmptyState: View {
    @Environment(\.dismiss) private var dismiss
    @EnvironmentObject var appViewModel: AppViewModel

    @State private var isAnimating = false
    @State private var iconScale: CGFloat = 0.5
    @State private var iconRotation: Double = -10

    var body: some View {
        VStack(spacing: AppSpacing.xl) {
            Spacer()

            // Animated icon
            ZStack {
                // Background circles
                Circle()
                    .fill(
                        LinearGradient(
                            colors: [AppColors.primary.opacity(0.1), AppColors.accent.opacity(0.1)],
                            startPoint: .topLeading,
                            endPoint: .bottomTrailing
                        )
                    )
                    .frame(width: 140, height: 140)
                    .scaleEffect(isAnimating ? 1.1 : 1.0)

                Circle()
                    .fill(AppColors.primary.opacity(0.05))
                    .frame(width: 120, height: 120)
                    .scaleEffect(isAnimating ? 1.0 : 0.9)

                // Main icon
                Image(systemName: "message.fill")
                    .font(.system(size: 50))
                    .foregroundColor(AppColors.primary)
                    .scaleEffect(iconScale)
                    .rotationEffect(.degrees(iconRotation))
            }
            .padding(.bottom, AppSpacing.md)

            // Friendly title
            Text("No Messages Yet")
                .font(.appTitle)
                .foregroundColor(AppColors.primaryText)
                .opacity(isAnimating ? 1.0 : 0)

            // Warm, inviting description
            Text("Connect with friends and family!\nStart a conversation to build\nyour relationships")
                .font(.appBody)
                .foregroundColor(AppColors.secondaryText)
                .multilineTextAlignment(.center)
                .lineSpacing(4)
                .opacity(isAnimating ? 1.0 : 0)

            // CTA Button
            Button(action: {
                openRelationships()
            }) {
                HStack(spacing: 8) {
                    Image(systemName: "person.2.fill")
                        .font(.system(size: 16, weight: .semibold))

                    Text("View Relationships")
                        .font(.appBodyBold)
                }
                .foregroundColor(.white)
                .padding(.horizontal, AppSpacing.lg)
                .padding(.vertical, AppSpacing.md)
                .background(
                    LinearGradient(
                        colors: [AppColors.primary, AppColors.accent],
                        startPoint: .leading,
                        endPoint: .trailing
                    )
                )
                .cornerRadius(AppSpacing.pillCornerRadius)
                .shadow(
                    color: AppColors.primary.opacity(0.3),
                    radius: 12,
                    x: 0,
                    y: 6
                )
            }
            .scaleEffect(isAnimating ? 1.0 : 0.9)
            .opacity(isAnimating ? 1.0 : 0)

            Spacer()

            // Tips card
            BaseCard(
                backgroundColor: AppColors.surfaceSubtle,
                borderColor: AppColors.info.opacity(0.3),
                showShadow: false
            ) {
                HStack(spacing: AppSpacing.sm) {
                    Image(systemName: "lightbulb.fill")
                        .font(.system(size: 20))
                        .foregroundColor(AppColors.accent)

                    VStack(alignment: .leading, spacing: 4) {
                        Text("Friendly Tip")
                            .font(.appCaptionBold)
                            .foregroundColor(AppColors.primaryText)

                        Text("Join activities and attend events to meet new people and strengthen your bonds!")
                            .font(.appCaption)
                            .foregroundColor(AppColors.secondaryText)
                            .lineSpacing(3)
                    }

                    Spacer()
                }
            }
            .opacity(isAnimating ? 1.0 : 0)
            .padding(.horizontal, AppSpacing.md)
        }
        .padding(AppSpacing.lg)
        .onAppear {
            // Stagger animations
            withAnimation(.spring(response: 0.6, dampingFraction: 0.7).delay(0.1)) {
                iconScale = 1.0
                iconRotation = 0
            }

            withAnimation(.easeOut(duration: 0.5).delay(0.3)) {
                isAnimating = true
            }

            // Breathing animation for background circles
            withAnimation(
                .easeInOut(duration: 3.0)
                .repeatForever(autoreverses: true)
                .delay(0.5)
            ) {
                isAnimating = true
            }
        }
    }

    private func openRelationships() {
        let generator = UIImpactFeedbackGenerator(style: .medium)
        generator.impactOccurred()

        appViewModel.selectedTab = 2
        appViewModel.selectedSocialSegment = 0
        dismiss()

        DispatchQueue.main.asyncAfter(deadline: .now() + 0.25) {
            appViewModel.showRelationships = true
        }
    }
}

// MARK: - Preview
#Preview {
    MessagesEmptyState()
        .environmentObject(AppViewModel())
        .background(AppColors.background)
}