import SwiftUI
import NukeUI

struct ArtistProfileStat: View {
    let count: String
    let title: String
    
    var body: some View {
        VStack {
            Text(String(count))
                .foregroundStyle(Constants.Colors.Foreground.primary)
                .font(.custom("InputSans-Medium", size: 14))
            Text(title)
                .foregroundStyle(Constants.Colors.Foreground.primary)
                .font(Constants.Typography.xSmallRegular)
        }
        .padding(.leading, 8)
    }
}

struct ArtistProfileHeader: View {
    let artist: Artist
    
    private var tags: [String] {
        guard let tags = artist.tags else { return [] }
        
        return tags.split(separator: ",").map { $0.trimmingCharacters(in: .whitespaces) }
    }
    
    var body: some View {
        ZStack(alignment: .topLeading) {
            LazyImage(url: artist.coverURL == nil ? nil : URL(string: artist.coverURL!)) { state in
                if let image = state.image {
                    image.resizable()
                        .aspectRatio(contentMode: .fill)
                } else {
                    Rectangle()
                        .foregroundStyle(.black)
                }
            }
            .animation(.default)

            Rectangle()
                .foregroundStyle(LinearGradient(colors: [Constants.Colors.Background.primary.opacity(0.3), Color.black.opacity(0.5), Constants.Colors.Background.primary], startPoint: .top, endPoint: .bottom))

            VStack(alignment: .leading) {
                Spacer()
                
                HStack(spacing: 16) {
                    if let imageURL = artist.avatarURL, !imageURL.isEmpty {
                        LazyImage(url: URL(string: imageURL)) { state in
                            if let image = state.image {
                                image.resizable()
                                    .aspectRatio(contentMode: .fill)
                                    .frame(width: 80, height: 80)
                            } else {
                                Circle()
                                    .foregroundStyle(.gray)
                            }
                        }
                        .clipShape(Circle())
                        .frame(width: 80, height: 80)
                    } else {
                        Circle()
                            .frame(width: 80, height: 80)
                    }

                    GeometryReader { reader in
                        HStack {
                            ArtistProfileStat(count: "405K", title: "Plays")
                                .frame(width: reader.size.width / 3, height: 80)
                            ArtistProfileStat(count: "1.3k", title: "Followers")
                                .frame(width: reader.size.width / 3, height: 80)
                            ArtistProfileStat(count: "92", title: "Following")
                                .frame(width: reader.size.width / 3, height: 80)
                        }
                    }
                    .frame(height: 80)

                    Spacer()
                }
                .padding(.bottom, 16)
                
                Text(artist.displayName)
                    .font(Constants.Typography.largeTitle)
                    .foregroundStyle(Constants.Colors.Foreground.primary)
                if let bio = artist.bio {
                    Text(bio)
                        .font(Constants.Typography.xSmallRegular)
                        .foregroundStyle(Constants.Colors.Foreground.secondary)
                }
                
                ScrollView(.horizontal, showsIndicators: false) {
                    HStack(spacing: 8) {
                        ForEach(tags, id: \.self) { tag in
                            Text(tag)
                                .font(.custom("InputSans-Regular", size: 12))
                                .foregroundStyle(Constants.Colors.Foreground.primary)
                                .padding(.horizontal, 12)
                                .padding(.vertical, 6)
                                .overlay(
                                    Capsule().stroke(Constants.Colors.Border.primary, lineWidth: 1))
                        }
                    }
                    .padding(.horizontal, 20)
                }
                .padding(.horizontal, -20)
            }
            .padding(20)
            .padding(.top, 100)
        }
    }
}

#Preview {
    ZStack {
        Rectangle()
            .foregroundStyle(.black)
        ArtistProfileHeader(artist: Artist(id: "1", displayName: "Aretha Franklin", isArtist: true, bio: "Just a composer composing things", tags: "classical, opera, piano", avatarURL: "https://firebasestorage.googleapis.com/v0/b/suno-eden.firebasestorage.app/o/users%2F5U9MzHxnq8ODwPLpmZyT%2Favatar_1762473468528.avif?alt=media&token=7ec5a8dd-1965-48d7-bfb3-1d7ed948168c", coverURL: "https://firebasestorage.googleapis.com/v0/b/suno-eden.firebasestorage.app/o/users%2F5U9MzHxnq8ODwPLpmZyT%2Fcover_1762473591490.webp?alt=media&token=09adac33-df9b-4c38-8046-db261778804a"))
    }
}