//
//  OriginalWorkDetailView.swift
//  SodaLive
//
//  Created by klaus on 9/15/25.
//

import SwiftUI
import Kingfisher

struct OriginalWorkDetailView: View {
    
    @StateObject var viewModel = OriginalWorkDetailViewModel()
    
    let originalId: Int
    
    private let horizontalPadding: CGFloat = 12
    private let gridSpacing: CGFloat = 12
    
    var body: some View {
        NavigationStack {
            BaseView(isLoading: $viewModel.isLoading) {
                ZStack(alignment: .top) {
                    if let imageUrl = viewModel.response?.imageUrl {
                        KFImage(URL(string: imageUrl))
                            .resizable()
                            .scaledToFit()
                            .frame(maxWidth: .infinity)
                            .blur(radius: 25)
                    }
                    
                    Color.black.opacity(0.5).ignoresSafeArea()
                    
                    VStack(spacing: 0) {
                        HStack(spacing: 0) {
                            Image("ic_back")
                                .resizable()
                                .frame(width: 24, height: 24)
                                .onTapGesture {
                                    AppState.shared.back()
                                }
                            
                            Spacer()
                        }
                        .padding(.horizontal, 24)
                        .frame(height: 56)
                        
                        if let response = viewModel.response {
                            GeometryReader { geo in
                                let totalSpacing: CGFloat = gridSpacing * 2
                                let width = (geo.size.width - (horizontalPadding * 2) - totalSpacing) / 3
                                
                                ScrollView(.vertical, showsIndicators: false) {
                                    VStack(spacing: 0) {
                                        OriginalWorkDetailHeaderView(item: response)
                                            .padding(.horizontal, 24)
                                            .padding(.bottom, 24)
                                        
                                        LazyVGrid(
                                            columns: Array(
                                                repeating: GridItem(
                                                    .flexible(),
                                                    spacing: gridSpacing,
                                                    alignment: .topLeading
                                                ),
                                                count: 3
                                            ),
                                            alignment: .leading,
                                            spacing: gridSpacing
                                        ) {
                                            ForEach(viewModel.characters.indices, id: \.self) { idx in
                                                let item = viewModel.characters[idx]
                                                
                                                NavigationLink(value: item.characterId) {
                                                    CharacterItemView(
                                                        character: item,
                                                        size: width,
                                                        rank: 0,
                                                        isShowRank: false
                                                    )
                                                    .onAppear { viewModel.loadMoreIfNeeded(currentIndex: idx) }
                                                }
                                            }
                                        }
                                        .padding(.horizontal, horizontalPadding)
                                        
                                        if viewModel.isLoadingMore {
                                            HStack {
                                                Spacer()
                                                ProgressView()
                                                    .progressViewStyle(CircularProgressViewStyle(tint: .white))
                                                    .padding(.vertical, 16)
                                                Spacer()
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
            .onAppear {
                if viewModel.response == nil {
                    viewModel.originalId = originalId
                }
            }
            .navigationDestination(for: Int.self) { characterId in
                CharacterDetailView(characterId: characterId)
            }
        }
    }
}

#Preview {
    OriginalWorkDetailView(originalId: 0)
}