//
//  SeriesByChannelView.swift
//  SodaLive
//
//  Created by klaus on 2/21/25.
//

import SwiftUI

struct SeriesByChannelView: View {
    
    let title: String
    let creatorList: [ContentCreatorResponse]
    let seriesList: [SeriesListItem]
    let onClickCreator: (Int) -> Void
    
    @State private var selectedCreatorId = 0
    
    var body: some View {
        VStack(alignment: .leading, spacing: 13.3) {
            Text(title)
                .font(.custom(Font.bold.rawValue, size: 18.3))
                .foregroundColor(Color(hex: "eeeeee"))
                .padding(.horizontal, 13.3)
            
            ScrollView(.horizontal) {
                HStack(spacing: 22) {
                    ForEach(0..<creatorList.count, id: \.self) { index in
                        let item = creatorList[index]
                        
                        ContentCreatorView(
                            isSelected: item.creatorId == selectedCreatorId,
                            item: item
                        )
                        .onTapGesture {
                            let creatorId = item.creatorId
                            
                            if creatorId != selectedCreatorId {
                                selectedCreatorId = creatorId
                                onClickCreator(creatorId)
                            }
                        }
                    }
                }
                .padding(.horizontal, 13.3)
            }
            
            if seriesList.isEmpty {
                ContentMainNoItemView()
            } else {
                ScrollView(.horizontal) {
                    HStack(spacing: 13.3) {
                        ForEach(0..<seriesList.count, id: \.self) { index in
                            let item = seriesList[index]
                            
                            SeriesListBigItemView(
                                item: item,
                                isVisibleCreator: true
                            )
                        }
                    }
                    .padding(.horizontal, 13.3)
                }
            }
        }
        .onAppear {
            if !self.creatorList.isEmpty {
                selectedCreatorId = creatorList[0].creatorId
            }
        }
    }
}

#Preview {
    SeriesByChannelView(
        title: "채널별 추천 시리즈",
        creatorList: [
            ContentCreatorResponse(
                creatorId: 1,
                creatorNickname: "유저1",
                creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
            ),
            ContentCreatorResponse(
                creatorId: 2,
                creatorNickname: "유저2",
                creatorProfileImageUrl: "https://test-cf.sodalive.net/profile/default-profile.png"
            )
        ],
        seriesList: [
            SeriesListItem(
                seriesId: 1,
                title: "제목, 관심사,프로필+방장, 참여인원(어딘가..)",
                coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
                publishedDaysOfWeek: "매주 수, 토요일",
                isComplete: true,
                creator: SeriesListItemCreator(
                    creatorId: 1,
                    nickname: "creator",
                    profileImage: "https://test-cf.sodalive.net/profile/default-profile.png"
                ),
                numberOfContent: 10,
                isNew: true,
                isPopular: true
            ),
            SeriesListItem(
                seriesId: 1,
                title: "제목, 관심사,프로필+방장, 참여인원(어딘가..)",
                coverImage: "https://test-cf.sodalive.net/profile/default-profile.png",
                publishedDaysOfWeek: "매주 수, 토요일",
                isComplete: true,
                creator: SeriesListItemCreator(
                    creatorId: 1,
                    nickname: "creator",
                    profileImage: "https://test-cf.sodalive.net/profile/default-profile.png"
                ),
                numberOfContent: 10,
                isNew: true,
                isPopular: true
            )
        ],
        onClickCreator: { _ in }
    )
}