//
//  ChatRoomView.swift
//  SodaLive
//
//  Created by klaus on 9/2/25.
//

import SwiftUI
import Kingfisher
import UIKit

struct ChatRoomView: View {
    
    @StateObject var viewModel = ChatRoomViewModel()
    
    @AppStorage("can") private var can: Int = UserDefaults.int(forKey: .can)
    
    let roomId: Int
    
    var body: some View {
        BaseView(isLoading: $viewModel.isLoading) {
            ChatRoomBgView()
            
            VStack(spacing: 0) {
                HStack(spacing: 12) {
                    Image("ic_back")
                        .resizable()
                        .frame(width: 24, height: 24)
                        .onTapGesture {
                            AppState.shared.back()
                        }
                    
                    KFImage(URL(string: viewModel.characterProfileUrl))
                        .placeholder {
                            Image(systemName: "person.crop.circle")
                                .resizable()
                                .scaledToFit()
                        }
                        .resizable()
                        .frame(width: 36, height: 36)
                    
                    VStack(alignment: .leading, spacing: 4) {
                        Text(viewModel.characterName)
                            .font(.custom(Font.preBold.rawValue, size: 12))
                            .foregroundColor(.white)
                            .lineLimit(1)
                            .truncationMode(.tail)
                        
                        Text(viewModel.characterType.rawValue)
                            .font(.custom(Font.preBold.rawValue, size: 10))
                            .foregroundColor(.white)
                            .padding(.horizontal, 4)
                            .padding(.vertical, 2)
                            .background(
                                Color(hex:
                                        viewModel.characterType == .Clone ?
                                      "0020C9" : "009D68"
                                     )
                            )
                            .cornerRadius(6)
                    }
                    
                    Spacer()
                    
                    HStack(spacing: 4) {
                        Image("ic_can")
                            .resizable()
                            .frame(width: 20, height: 20)
                        
                        Text("\(can)")
                            .font(.custom(Font.preRegular.rawValue, size: 16))
                            .foregroundColor(.white)
                    }
                    .padding(.horizontal, 10)
                    .padding(.vertical, 5)
                    .background(Color(hex: "263238"))
                    .cornerRadius(30)
                    
                    Image("ic_seemore_vertical_white")
                        .resizable()
                        .frame(width: 24, height: 24)
                        .onTapGesture {}
                }
                .padding(.horizontal, 16)
                .padding(.vertical, 8)
                .frame(width: screenSize().width, height: 60)
                
                HStack(spacing: 8) {
                    Image(systemName: "info.circle.fill")
                        .resizable()
                        .frame(width: 20, height: 20)
                    
                    Text(
                        viewModel.characterType == .Character
                        ? "보이스온 AI캐릭터톡은 대화의 자유도가 높아 대화에 참여하는 당신은 누구든 될 수 있습니다.\n세계관 속 캐릭터로 대화를 하거나 새로운 인물로 캐릭터와 당신만의 스토리를 만들어보세요.\n※ AI캐릭터톡은 오픈베타 서비스 중이며, 캐릭터의 대화가 어색하거나 불완전할 수 있습니다."
                        : "AI Clone은 크리에이터의 정보를 기반으로 대화하지만, 모든 정보를 완벽하게 반영하거나 실제 대화와 일치하지 않을 수 있습니다."
                    )
                    .font(.custom(Font.preRegular.rawValue, size: 12))
                    .foregroundColor(.white)
                    
                    Image(systemName: "chevron.up")
                        .resizable()
                        .scaledToFit()
                        .frame(width: 20)
                }
                .padding(12)
                .background(Color(hex: "13181B").opacity(0.7))
                .cornerRadius(16)
                .frame(width: screenSize().width - 48)
                
                GeometryReader { geometry in
                    ScrollViewReader { proxy in
                        ScrollView(.vertical, showsIndicators: false) {
                            LazyVStack(spacing: 16) {
                                ForEach(0..<viewModel.messages.count, id: \.self) { index in
                                    let message = viewModel.messages[index]
                                    if message.mine {
                                        UserMessageItemView(message: message)
                                    } else {
                                        AiMessageItemView(
                                            message: message,
                                            characterName: viewModel.characterName
                                        )
                                    }
                                }
                            }
                            .padding(.horizontal, 24)
                            .frame(minHeight: geometry.size.height, alignment: .bottom)
                        }
                        .onChange(of: viewModel.messages.count) { _ in
                            if !viewModel.messages.isEmpty {
                                withAnimation(.easeOut(duration: 0.3)) {
                                    proxy.scrollTo(viewModel.messages.count - 1, anchor: .bottom)
                                }
                            }
                        }
                    }
                }
                .frame(width: screenSize().width)
                .frame(maxHeight: .infinity)
                
                HStack(spacing: 8) {
                    HStack(spacing: 0) {
                        ZStack(alignment: .leading) {
                            if viewModel.messageText.isEmpty {
                                Text("메시지를 입력하세요.")
                                    .font(.custom(Font.preRegular.rawValue, size: 14))
                                    .foregroundColor(Color(hex: "78909C"))
                            }
                            
                            TextField("", text: $viewModel.messageText)
                                .font(.custom(Font.preRegular.rawValue, size: 14))
                                .foregroundColor(.white)
                                .onSubmit {
                                    viewModel.sendMessage()
                                }
                        }
                        .frame(maxWidth: .infinity)
                    }
                    .padding(.horizontal, 16)
                    .padding(.vertical, 13)
                    .background(Color(hex: "263238"))
                    .cornerRadius(999)
                    .overlay(
                        RoundedRectangle(cornerRadius: 999)
                            .stroke(Color(hex: "263238"), lineWidth: 1)
                    )
                    
                    Button(action: {
                        UIApplication.shared.sendAction(#selector(UIResponder.resignFirstResponder), to: nil, from: nil, for: nil)
                        viewModel.sendMessage()
                    }) {
                        Image("ic_message_send")
                            .resizable()
                            .frame(width: 24, height: 24)
                    }
                }
                .padding(.horizontal, 12)
                .padding(.vertical, 12)
                .frame(width: screenSize().width)
            }
        }
    }
}

struct ChatRoomBgView: View {
    
    let url: String? = nil
    
    var body: some View {
        ZStack {
            if let url = url {
                KFImage(URL(string: url))
                    .resizable()
                    .scaledToFill()
                    .ignoresSafeArea()
            } else {
                Image("img_sample")
                    .resizable()
                    .scaledToFill()
                    .ignoresSafeArea()
            }
            
            Color.black
                .opacity(0.6)
                .ignoresSafeArea()
        }
    }
}

#Preview {
    ChatRoomView(roomId: 0)
}