import SwiftUI

struct LoadingTrackCell: View {
    @State private var isShimmering = false
    
    var body: some View {
        HStack(spacing: 12) {
            // Thumbnail placeholder
            RoundedRectangle(cornerRadius: 8)
                .fill(Color.white.opacity(0.1))
                .frame(width: 44, height: 56)
                .shimmer(isShimmering: isShimmering)
            
            // Track information placeholders
            VStack(alignment: .leading, spacing: 8) {
                // Title placeholder
                RoundedRectangle(cornerRadius: 100)
                    .fill(Color.white.opacity(0.1))
                    .frame(width: 84, height: 8)
                    .shimmer(isShimmering: isShimmering)
                
                // Description placeholder
                RoundedRectangle(cornerRadius: 100)
                    .fill(Color.white.opacity(0.1))
                    .frame(width: 200, height: 8)
                    .shimmer(isShimmering: isShimmering)
            }
            .padding(.vertical, 6)
            
            Spacer()
        }
        .frame(height: 56)
        .onAppear {
            withAnimation(.easeInOut(duration: 1.5).repeatForever(autoreverses: true)) {
                isShimmering = true
            }
        }
    }
}

// Shimmer effect modifier
struct ShimmerModifier: ViewModifier {
    let isShimmering: Bool
    
    func body(content: Content) -> some View {
        content
            .overlay(
                LinearGradient(
                    colors: [
                        Color.white.opacity(0),
                        Color.white.opacity(0.6),
                        Color.white.opacity(0.8),
                        Color.white.opacity(0.6),
                        Color.white.opacity(0)
                    ],
                    startPoint: .leading,
                    endPoint: .trailing
                )
                .scaleEffect(x: isShimmering ? 2.5 : 0.3, y: 1, anchor: .center)
                .offset(x: isShimmering ? 150 : -150)
                .animation(.easeInOut(duration: 1.2).repeatForever(autoreverses: false), value: isShimmering)
                .mask(content)
            )
    }
}

extension View {
    func shimmer(isShimmering: Bool) -> some View {
        self.modifier(ShimmerModifier(isShimmering: isShimmering))
    }
}

#Preview {
    VStack(spacing: 16) {
        LoadingTrackCell()
        LoadingTrackCell()
        LoadingTrackCell()
    }
    .padding()
    .background(Constants.Colors.Background.primary)
}