//
//  AuditionDetailView.swift
//  SodaLive
//
//  Created by klaus on 1/6/25.
//

import SwiftUI
import Kingfisher

struct AuditionDetailView: View {
    
    @StateObject var viewModel = AuditionDetailViewModel()
    
    let auditionId: Int
    
    var body: some View {
        BaseView(isLoading: $viewModel.isLoading) {
            VStack(spacing: 0) {
                DetailNavigationBar(title: viewModel.title)
                
                if let response = viewModel.response {
                    ScrollView(.vertical, showsIndicators: false) {
                        VStack(alignment: .leading, spacing: 0) {
                            KFImage(URL(string: response.imageUrl))
                                .cancelOnDisappear(true)
                                .downsampling(size: CGSize(width: 1000, height: 530))
                                .resizable()
                                .aspectRatio(1000/530, contentMode: .fit)
                                .frame(maxWidth: .infinity)
                                .cornerRadius(6.7)
                            
                            Text("오디션 정보")
                                .font(.custom(Font.bold.rawValue, size: 14.7))
                                .foregroundColor(Color.grayee)
                                .padding(.top, 15)
                            
                            ExpandableTextView(text: response.information)
                                .padding(.top, 13.3)
                            
                            Text("오디션 캐릭터")
                                .font(.custom(Font.bold.rawValue, size: 14.7))
                                .foregroundColor(Color.grayee)
                                .padding(.top, 15)
                            
                            LazyVStack(spacing: 25) {
                                ForEach(0..<response.roleList.count, id: \.self) {
                                    let role = response.roleList[$0]
                                    
                                    AuditionDetailRoleItemView(item: role)
                                        .onTapGesture {
                                            if !role.isComplete {
                                                AppState.shared
                                                    .setAppStep(
                                                        step: .auditionRoleDetail(
                                                            roleId: role.roleId,
                                                            auditionTitle: viewModel.title
                                                        )
                                                    )
                                            }
                                        }
                                }
                            }
                            .padding(.top, 20)
                        }
                        .padding(.horizontal, 13.3)
                        .padding(.vertical, 8)
                    }
                }
            }
            .popup(isPresented: $viewModel.isShowPopup, type: .toast, position: .bottom, autohideIn: 2) {
                HStack {
                    Spacer()
                    Text(viewModel.errorMessage)
                        .padding(.vertical, 13.3)
                        .frame(width: screenSize().width - 66.7, alignment: .center)
                        .font(.custom(Font.medium.rawValue, size: 12))
                        .background(Color.button)
                        .foregroundColor(Color.white)
                        .multilineTextAlignment(.leading)
                        .cornerRadius(20)
                        .padding(.bottom, 66.7)
                    Spacer()
                }
            }
            .onAppear {
                viewModel.getAuditionDetail(auditionId: auditionId) {
                    AppState.shared.back()
                }
            }
        }
    }
}

#Preview {
    AuditionDetailView(auditionId: 1)
}