//
//  CharacterItemView.swift
//  SodaLive
//
//  Created by klaus on 8/29/25.
//

import SwiftUI
import Kingfisher

struct CharacterItemView: View {
    
    let character: Character
    let size: CGFloat
    let rank: Int
    let isShowRank: Bool
    
    private var capHeight: CGFloat {
        UIFont(name: Font.preBold.rawValue, size: 72)?.capHeight ?? 72
    }
    
    var body: some View {
        VStack(alignment: .leading, spacing: 4) {
            ZStack(alignment: .leading) {
                DownsampledKFImage(
                    url: URL(string: character.imageUrl),
                    size: CGSize(width: size, height: size)
                )
                .cornerRadius(12)
                
                VStack {
                    if character.isNew {
                        HStack {
                            Spacer()
                            
                            Text("N")
                                .font(.custom(Font.preRegular.rawValue, size: 18))
                                .foregroundColor(.white)
                                .frame(width: 30, height: 30)
                                .background(Color.button)
                                .clipShape(Circle())
                        }
                        .padding(.top, 8)
                        .padding(.trailing, 8)
                    }
                    
                    Spacer()
                    
                    if isShowRank {
                        Text("\(rank)")
                            .font(.custom(Font.preBold.rawValue, size: 72))
                            .foregroundColor(.white)
                            .lineLimit(1)
                            .frame(height: capHeight)
                    }
                }
            }
            
            Text(character.name)
                .font(.custom(Font.preRegular.rawValue, size: 18))
                .foregroundColor(.white)
                .lineLimit(1)
                .truncationMode(.tail)
            
            if let desc = character.description, !desc.isEmpty {
                Text(desc)
                    .font(.custom(Font.preRegular.rawValue, size: 14))
                    .foregroundColor(Color(hex: "78909C"))
                    .lineLimit(1)
            }
        }
        .frame(width: size, alignment: .leading)
    }
}

#Preview {
    CharacterItemView(
        character: Character(characterId: 1, name: "찰리", description: "새로운 친구", imageUrl: "https://picsum.photos/300", isNew: true),
        size: 168,
        rank: 20,
        isShowRank: true
    )
}