//
//  SectionLiveNowView.swift
//  SodaLive
//
//  Created by klaus on 2023/08/09.
//

import SwiftUI

struct SectionLiveNowView: View {
    
    let items: [GetRoomListResponse]
    
    let onClickParticipant: (Int) -> Void
    let onTapCreateLive: () -> Void
    
    var body: some View {
        VStack(spacing: 13.3) {
            HStack(spacing: 0) {
                Text("지금 ")
                    .font(.custom(Font.bold.rawValue, size: 18.3))
                    .foregroundColor(Color(hex: "eeeeee"))
                
                Text("라이브중")
                    .font(.custom(Font.bold.rawValue, size: 18.3))
                    .foregroundColor(Color(hex: "ff5c49"))
                
                Spacer()
                
                if items.count > 0 {
                    Text("전체보기")
                        .font(.custom(Font.light.rawValue, size: 11.3))
                        .foregroundColor(Color(hex: "bbbbbb"))
                        .onTapGesture { AppState.shared.setAppStep(step: .liveNowAll(onClickParticipant: onClickParticipant)) }
                }
            }
            .padding(.horizontal, 13.3)
            .frame(width: screenSize().width)
            
            if items.count > 0 {
                ScrollView(.horizontal, showsIndicators: false) {
                    HStack(spacing: 10) {
                        ForEach(items, id: \.self) { item in
                            LiveNowItemView(item: item)
                                .contentShape(Rectangle())
                                .onTapGesture {
                                    AppState.shared.setAppStep(
                                        step: .liveDetail(
                                            roomId: item.roomId,
                                            onClickParticipant: {
                                                AppState.shared.isShowPlayer = false
                                                onClickParticipant(item.roomId)
                                            },
                                            onClickReservation: {},
                                            onClickStart: {
                                            },
                                            onClickCancel: {
                                            }
                                        )
                                    )
                                }
                        }
                    }
                    .padding(.horizontal, 13.3)
                }
                .padding(.top, 28.3)
            } else {
                VStack(spacing: 0) {
                    Image("ic_no_item")
                        .resizable()
                        .frame(width: 60, height: 60)
                    
                    Text("🙀지금 참여가능한 라이브가 없습니다.\n직접 라이브를 만들어 보세요!")
                        .font(.custom(Font.medium.rawValue, size: 10.7))
                        .foregroundColor(Color(hex: "bbbbbb"))
                        .fixedSize(horizontal: false, vertical: true)
                        .multilineTextAlignment(.center)
                        .padding(.top, 8)
                    
                    HStack(spacing: 0) {
                        Image("ic_plus_no_bg")
                            .resizable()
                            .frame(width: 33.3, height: 33.3, alignment: .center)
                        
                        Text("라이브 만들기")
                            .font(.custom(Font.bold.rawValue, size: 13.3))
                            .foregroundColor(Color.white)
                    }
                    .frame(width: 200, height: 33.3, alignment: .center)
                    .background(Color(hex: "9970ff"))
                    .cornerRadius(4.7)
                    .padding(.top, 10.7)
                    .onTapGesture { onTapCreateLive() }
                }
                .padding(.vertical, 16.7)
                .frame(width: screenSize().width - 26.7)
                .background(Color(hex: "2b2635"))
                .cornerRadius(4.7)
                .padding(.top, 28.3)
            }
        }
    }
}

struct SectionLiveNowView_Previews: PreviewProvider {
    static var previews: some View {
        SectionLiveNowView(
            items: [],
            onClickParticipant: { _ in },
            onTapCreateLive: {}
        )
    }
}