//
//  FollowerListItemView.swift
//  SodaLive
//
//  Created by klaus on 2023/08/11.
//

import SwiftUI
import Kingfisher

struct FollowerListItemView: View {
    
    let item: GetFollowerListResponseItem
    let creatorFollow: (Int) -> Void
    let showCreatorFollowNotifyDialog: (Int) -> Void
    
    var body: some View {
        VStack(spacing: 13.3) {
            HStack(spacing: 0) {
                KFImage(URL(string: item.profileImage))
                    .resizable()
                    .frame(width: 60, height: 60)
                    .clipShape(Circle())
                
                Text(item.nickname)
                    .font(.custom(Font.medium.rawValue, size: 16.7))
                    .foregroundColor(Color(hex: "eeeeee"))
                    .padding(.leading, 13.3)
                
                Spacer()
                
                if let isFollow = item.isFollow, let isNotify = item.isNotify {
                    Image(isFollow ?
                          isNotify ?
                          "btn_following_big" :
                            "btn_following_no_alarm_big" :
                            "btn_follow_big"
                    )
                    .onTapGesture {
                        isFollow ?
                        showCreatorFollowNotifyDialog(item.userId) :
                        creatorFollow(item.userId)
                    }
                }
            }
            .padding(.top, 13.3)
            
            Rectangle()
                .frame(height: 1)
                .frame(maxWidth: .infinity)
                .foregroundColor(Color(hex: "909090"))
        }
        .padding(.horizontal, 20)
    }
}

struct FollowerListItemView_Previews: PreviewProvider {
    static var previews: some View {
        FollowerListItemView(
            item: GetFollowerListResponseItem(
                userId: 1,
                profileImage: "https://test-cf.sodalive.net/profile/default-profile.png",
                nickname: "상남자",
                isFollow: false
            ),
            creatorFollow: { _ in },
            showCreatorFollowNotifyDialog: { _ in }
        )
    }
}