//
//  LiveRoomChatItemView.swift
//  SodaLive
//
//  Created by klaus on 2023/08/14.
//

import SwiftUI
import Kingfisher

struct LiveRoomChatItemView: View {
    
    let chatMessage: LiveRoomNormalChat
    let onClickProfile: () -> Void
    let onLongPressChat: (() -> Void)?

    private var rankValue: Int {
        chatMessage.rank + 1
    }

    private var isTopRank: Bool {
        (1...3).contains(rankValue)
    }

    private var topRankCrownImageName: String? {
        switch rankValue {
        case 1:
            return "img_rank_1"
        case 2:
            return "img_rank_2"
        case 3:
            return "img_rank_3"
        default:
            return nil
        }
    }
    
    var body: some View {
        HStack(alignment: .top, spacing: 13.3) {
            ZStack {
                if !isTopRank {
                    switch rankValue {
                    case -2:
                        Color(hex: "4999e3")
                            .frame(width: 33.3, height: 33.3, alignment: .top)
                            .clipShape(Circle())

                    case -1:
                        Color.button
                            .frame(width: 33.3, height: 33.3, alignment: .top)
                            .clipShape(Circle())

                    default:
                        Color(hex: "bbbbbb")
                            .frame(width: 33.3, height: 33.3, alignment: .top)
                            .clipShape(Circle())
                    }
                }
                
                KFImage(URL(string: chatMessage.profileUrl))
                    .cancelOnDisappear(true)
                    .downsampling(
                        size: CGSize(
                            width: 30,
                            height: 30
                        )
                    )
                    .resizable()
                    .scaledToFill()
                    .frame(width: 30, height: 30, alignment: .top)
                    .clipShape(Circle())

                if isTopRank {
                    if let topRankCrownImageName {
                        Image(topRankCrownImageName)
                            .resizable()
                            .frame(width: 39, height: 38)
                    }
                } else {
                    VStack(alignment: .trailing, spacing: 0) {
                        Spacer()

                        switch rankValue {
                        case -2:
                            Image("ic_badge_manager")
                                .resizable()
                                .frame(width: 16.7, height: 16.7)

                        case -1:
                            Image("ic_crown")
                                .resizable()
                                .frame(width: 16.7, height: 16.7)

                        default:
                            EmptyView()
                        }
                    }
                    .frame(width: 33.3, height: 33.3, alignment: .trailing)
                }
            }
            .frame(width: isTopRank ? 39 : 33.3, height: isTopRank ? 38 : 33.3)
            .onTapGesture { onClickProfile() }
            
            VStack(alignment: .leading, spacing: 6.7) {
                HStack(spacing: 5) {
                    if chatMessage.rank == -3 {
                        Text("스탭")
                            .appFont(size: 10)
                            .foregroundColor(.white)
                            .padding(2)
                            .background(Color(hex: "4999e3"))
                            .cornerRadius(2)
                    }
                    
                    Text(chatMessage.nickname)
                        .appFont(size: 12, weight: .light)
                        .foregroundColor(.white)
                }
                
                Text(chatMessage.chat)
                    .appFont(size: 15)
                    .foregroundColor(.white)
                    .multilineTextAlignment(.leading)
                    .lineLimit(nil)
                    .lineSpacing(6)
                    .fixedSize(horizontal: false, vertical: true)
            }
            .padding(.horizontal, 8)
            .padding(.vertical, 5.3)
            .background(
                UserDefaults.int(forKey: .userId) == chatMessage.userId ?
                Color.button.opacity(0.5) :
                    Color.black.opacity(0.6)
            )
            .cornerRadius(3.3)
            .onLongPressGesture {
                onLongPressChat?()
            }
        }
        .frame(width: screenSize().width - 86, alignment: .leading)
        .padding(.leading, 20)
    }
}