//
//  AutoSlideCharacterBannerView.swift
//  SodaLive
//
//  Created by klaus on 8/29/25.
//

import SwiftUI
import Kingfisher

struct AutoSlideCharacterBannerView: View {
    var items: [CharacterBannerResponse] = []
    var onTap: (CharacterBannerResponse) -> Void = { _ in }
    
    @State private var index: Int = 0
    @State private var height: CGFloat = 0
    private let timer = Timer.publish(every: 4, on: .main, in: .common).autoconnect()
    
    var body: some View {
        TabView(selection: $index) {
            ForEach(0..<items.count, id: \.self) { index in
                let item = items[index]
                KFImage(URL(string: item.imageUrl))
                    .placeholder { Color.gray.opacity(0.2) }
                    .retry(maxCount: 2, interval: .seconds(1))
                    .cancelOnDisappear(true)
                    .resizable()
                    .scaledToFill()
                    .frame(height: height)
                    .clipped()
                    .cornerRadius(12)
                    .contentShape(Rectangle())
                    .tag(index)
                    .onTapGesture { onTap(item) }
            }
        }
        .tabViewStyle(.page(indexDisplayMode: .automatic))
        .frame(maxWidth: .infinity)
        .frame(height: height)
        .onAppear {
            self.height = screenSize().width * 0.53
        }
        .onDisappear {
            timer.upstream.connect().cancel()
        }
        .onReceive(timer) { _ in
            guard !items.isEmpty else { return }
            withAnimation { index = (index + 1) % items.count }
        }
    }
}

#Preview {
    AutoSlideCharacterBannerView(
        items: [
            CharacterBannerResponse(characterId: 1, imageUrl: "https://picsum.photos/1000/300")
        ]
    )
    .padding()
    .background(Color.black)
}