import SwiftUI

public struct PlayListCardV1: View {
    let image: ImageSource
    let title: String
    let tags: String
    let avatarImageUrl: String?
    let displayName: String
    let plays: Int
    let likes: Int

    public init(image: ImageSource, title: String, tags: String, avatarImageUrl: String?, displayName: String, plays: Int, likes: Int) {
        self.image = image
        self.title = title
        self.tags = tags
        self.avatarImageUrl = avatarImageUrl
        self.displayName = displayName
        self.plays = plays
        self.likes = likes
    }

    public var body: some View {
        VStack(spacing: 0) {
            image.source
                .aspectRatio(1, contentMode: .fit)
                .cornerRadius(8)
                .glassBorder(shape: .rect(cornerRadius: 8))
                .overlay(alignment: .bottomLeading, content: stats)
                .padding(.bottom, 16)

            VStack(alignment: .leading, spacing: 0) {
                Text(title)
                    .typographyV1(.body1)
                    .lineLimit(1)
                    .foregroundColor(.SemanticV1.textPrimary)
                    .frame(maxWidth: .infinity, alignment: .leading)

                Text(tags.isEmpty ? " " : tags.capitalized)
                    .typographyV1(.body2)
                    .foregroundColor(.SemanticV1.textBrand)
                    .lineLimit(2, reservesSpace: true)
                    .fixedSize(horizontal: false, vertical: true)

                HStack(alignment: .center, spacing: 4) {
                    RemoteImage(url: avatarImageUrl, fallbackId: "1") // TODO: Replace with user id
                        .frame(width: 24, height: 24)
                        .clipShape(Circle())

                    Text(displayName)
                        .typographyV1(.caption2)
                        .foregroundColor(.SemanticV1.textPrimary)
                        .lineLimit(1)
                }
            }
            .frame(maxWidth: .infinity)
        }
    }

    private func stats() -> some View {
        HStack {
            if plays > 0 {
                HStack(spacing: 4) {
                    Image.Icon.playFilled
                        .frame(width: 20, height: 20)
                        .foregroundColor(Color.SemanticV1.iconPrimary)

                    Text(plays.formatted(.number.notation(.compactName)))
                        .typographyV1(.monospace)
                        .foregroundColor(Color.SemanticV1.iconPrimary)
                }
                .padding(.vertical, 4)
                .padding(.horizontal, 8)
                .glassBackground(shape: .rect(cornerRadius: 6), type: nil, fallbackStyle: Material.ultraThin)
            }

            HStack(spacing: 4) {
                Image.Icon.thumbsUpV1
                    .frame(width: 20, height: 20)
                    .foregroundColor(Color.SemanticV1.iconPrimary)

                Text(likes.formatted(.number.notation(.compactName)))
                    .typographyV1(.monospace)
                    .foregroundColor(Color.SemanticV1.iconPrimary)
            }
            .padding(4)
            .padding(.horizontal, 8)
            .glassBackground(shape: .rect(cornerRadius: 6), type: nil, fallbackStyle: Material.ultraThin)
        }
        .frame(maxWidth: .infinity, alignment: .leading)
        .padding(.leading, 4)
        .padding(.bottom, 4)
        .colorScheme(.dark)
    }
}

struct PlayListCardV1_Previews: PreviewProvider {
    static var previews: some View {
        HStack(spacing: 8) {
            PlayListCardV1(
                image: .local(Image.Assets.mySongs),
                title: "8-Bit Melodies",
                tags: "Moody, Synth, Disco, 90's, Pop",
                avatarImageUrl: nil,
                displayName: "json",
                plays: 2000,
                likes: 102
            )

            PlayListCardV1(
                image: .remote(url: "", fallbackId: "1"),
                title: "8-Bit Melodies",
                tags: "Moody, Synth, Disco, 90's, Pop",
                avatarImageUrl: nil,
                displayName: "json",
                plays: 2000,
                likes: 102
            )
        }
        .frame(height: 400)
        .padding(.horizontal, 12)
    }
}