//
//  SeriesContentListItemView.swift
//  SodaLive
//
//  Created by klaus on 4/30/24.
//

import SwiftUI
import Kingfisher

struct SeriesContentListItemView: View {
    
    let item: GetSeriesContentListItem
    
    var body: some View {
        VStack(spacing: 12) {
            HStack(spacing: 11) {
                KFImage(URL(string: item.coverImage))
                    .cancelOnDisappear(true)
                    .downsampling(size: CGSize(width: 66.7, height: 66.7))
                    .resizable()
                    .scaledToFill()
                    .frame(width: 66.7, height: 66.7)
                    .cornerRadius(5.3)
                
                VStack(alignment: .leading, spacing: 2.7) {
                    Text(item.duration)
                        .font(.custom(Font.medium.rawValue, size: 10))
                        .foregroundColor(Color.gray77)
                        .padding(2.7)
                        .background(Color.gray22)
                        .cornerRadius(2.6)
                    
                    Text(item.title)
                        .font(.custom(Font.medium.rawValue, size: 12))
                        .foregroundColor(Color.grayd2)
                }
                
                Spacer()
                
                if item.isOwned {
                    Text("소장중")
                        .font(.custom(Font.medium.rawValue, size: 13.3))
                        .foregroundColor(Color.gray11)
                        .padding(.horizontal, 5.3)
                        .padding(.vertical, 2.7)
                        .background(Color(hex: "b1ef2c"))
                        .cornerRadius(2.6)
                } else if item.isRented {
                    Text("대여중")
                        .font(.custom(Font.medium.rawValue, size: 13.3))
                        .foregroundColor(Color.white)
                        .padding(.horizontal, 5.3)
                        .padding(.vertical, 2.7)
                        .background(Color(hex: "660fd4"))
                        .cornerRadius(2.6)
                } else if item.price > 0 {
                    HStack(spacing: 5.3) {
                        Image("ic_can")
                        
                        Text("\(item.price)")
                            .font(.custom(Font.medium.rawValue, size: 13.3))
                            .foregroundColor(Color(hex: "909090"))
                    }
                } else {
                    Text("무료")
                        .font(.custom(Font.medium.rawValue, size: 13.3))
                        .foregroundColor(Color.white)
                        .padding(.horizontal, 5.3)
                        .padding(.vertical, 2.7)
                        .background(Color(hex: "cf5c37"))
                        .cornerRadius(2.6)
                }
            }
            
            Rectangle()
                .foregroundColor(Color.gray59)
                .frame(maxWidth: .infinity)
                .frame(height: 0.5)
        }
    }
}

#Preview("무료") {
    SeriesContentListItemView(
        item: GetSeriesContentListItem(
            contentId: 1,
            title: "[무료] 두근두근 연애 연구부 EP1",
            coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
            releaseDate: "",
            duration: "00:14:59",
            price: 0,
            isRented: false,
            isOwned: false
        )
    )
}

#Preview("유료") {
    SeriesContentListItemView(
        item: GetSeriesContentListItem(
            contentId: 1,
            title: "두근두근 연애 연구부 EP1",
            coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
            releaseDate: "",
            duration: "00:14:59",
            price: 100,
            isRented: false,
            isOwned: false
        )
    )
}

#Preview("대여") {
    SeriesContentListItemView(
        item: GetSeriesContentListItem(
            contentId: 1,
            title: "두근두근 연애 연구부 EP1",
            coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
            releaseDate: "",
            duration: "00:14:59",
            price: 200,
            isRented: true,
            isOwned: false
        )
    )
}

#Preview("소장") {
    SeriesContentListItemView(
        item: GetSeriesContentListItem(
            contentId: 1,
            title: "두근두근 연애 연구부 EP1",
            coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
            releaseDate: "",
            duration: "00:14:59",
            price: 300,
            isRented: false,
            isOwned: true
        )
    )
}
