//
//  ChattingView.swift
//  AcaMate
//
//  Created by TAnine on 2/11/25.
//

import SwiftUI

struct ChattingView: View {
    @StateObject private var topVM = TopViewModel()
    @StateObject private var btnVM = ButtonViewModel()
    @StateObject private var vm: ChatViewModel
    
    @State private var scrollOffset: CGPoint = .zero
    
    @State private var leftBtnID = UUID()
    @State private var rightBtnID = UUID()
    
    
    init(_ appVM: AppViewModel, _ myType: Binding<UserType>) {
        _vm = StateObject(wrappedValue: ChatViewModel(appVM))
        _myType = myType
    }
    
    let classList = [
        SummaryChat(id: "00", chatName: "Class 101", teacherName: "홍길동",
                    lastMessage: "여기에는 채팅이 나올 예정입니다. 2줄 정도로 나올 예정이며 끝자리는 잘려서 나올 것 입니다. 이정도의 채팅으로는 택도 없어서 조금 더 길게 길게 작성을 해봅니다.",
                    dayDate: "2025. 02. 14", timeDate: "PM 11:00", notiState: true, groupNum: 12),
        SummaryChat(id: "01", chatName: "Class 101", teacherName: "홍길동",
                    lastMessage: "여기에는 채팅이 나올 예정입니다. 2줄 정도로 나올 예정이며 끝자리는 잘려서 나올 것 입니다. 이정도의 채팅으로는 택도 없어서 조금 더 길게 길게 작성을 해봅니다.",
                    dayDate: "2025. 02. 14", timeDate: "PM 11:00", notiState: false, groupNum: 12),
        SummaryChat(id: "02", chatName: "Class 101", teacherName: "홍길동",
                    lastMessage: "여기에는 채팅이 나올 예정입니다. 2줄 정도로 나올 예정이며 끝자리는 잘려서 나올 것 입니다. 이정도의 채팅으로는 택도 없어서 조금 더 길게 길게 작성을 해봅니다.",
                    dayDate: "2025. 02. 14", timeDate: "PM 11:00", notiState: true, groupNum: 12)
    ]
    
    //MARK: - 변경 값
    @Binding var myType: UserType
    
    @State var chatMenu: chatType = .Class
    
    var body: some View {
        VStack(spacing: 0) {
            TopView(topVM: topVM)
            if myType == .ETC || myType == .Employee {
                EmptyBoxView(title: "이용하실 수 없는 기능입니다.")
                    .padding(24)
                Spacer(minLength: 1)
            }
            else {
                if myType == .Teacher || myType == .Admin {
                    if myType == .Admin {
                        HStack {
                            SimpleBtnView(vm: btnVM, id: leftBtnID)
                            Spacer(minLength: 1)
                            Text("선생님 이름")
                                .font(.nps(font: .bold, size: 24))
                                .foregroundStyle(Color(.Text.detail))
                            Spacer(minLength: 1)
                            SimpleBtnView(vm: btnVM, id: rightBtnID)
                        }
                        .padding(EdgeInsets(top: 12, leading: 24, bottom: 0, trailing: 24))
                    }
                    HStack {
                        SelectChatMenu(chatMenu: $chatMenu, tag: .Class, image: Image(.Icon.group), title: "클래스")
                        Spacer(minLength: 1)
                        SelectChatMenu(chatMenu: $chatMenu, tag: .Student, image: Image(.Icon.talk), title: "학생")
                        Spacer(minLength: 1)
                        SelectChatMenu(chatMenu: $chatMenu, tag: .Parent, image: Image(.Icon.talk), title: "학부모")
                    }
                    
                    .padding(EdgeInsets(top: 12, leading: 24, bottom: 12, trailing: 24))
                }
                OffsetObservableScrollView(showsIndicators: false, scrollOffset: $scrollOffset) { proxy in
                    LazyVStack(spacing: 24) {
                        if myType == .Student || myType == .Parent {
                            Group {
                                DashBoardView(image: Image(.Icon.group), title: "클래스") {
                                    ChatListView(chatList: classList)
                                }
                                
                                DashBoardView(image: Image(.Icon.talk), title: "선생님과 1:1") {
                                    
                                }
                                DashBoardView(image: Image(.Icon.talk), title: "부모님과 1:1") {
                                    
                                }
                            }
                            .background {
                                RoundedRectangle(cornerRadius: 8)
                                    .foregroundStyle(Color(.Other.cell))
                            }
                        } else {
                            Group {
                                switch chatMenu {
                                case .Class:
                                    DashBoardView(image: Image(.Icon.group), title: "클래스") {
                                        ChatListView(chatList: classList)
                                    }
                                case .Student:
                                    DashBoardView(image: Image(.Icon.talk), title: "학생과 1:1") {
                                        
                                    }
                                case .Parent:
                                    DashBoardView(image: Image(.Icon.talk), title: "부모님과 1:1") {
                                        
                                    }
                                }
                            }
                            .background {
                                RoundedRectangle(cornerRadius: 8)
                                    .foregroundStyle(Color(.Other.cell))
                            }
                        }
                    }
                    .padding(EdgeInsets(
                        top: (myType == .Student || myType == .Parent) ? 24 : 12, leading: 24, bottom: 24, trailing: 24))
                }
                
                .frame(maxWidth: .infinity, maxHeight: .infinity)
            }
        }
        .onAppear {
            // MARK: TO-DO
            // 여기도 수정봐야 함
            topVM.titleName = "Name"
            
            if myType == .Student {
                topVM.setLeftBtn(Image(.Icon.face), size: CGPoint(x: 40, y: 40), action: leftAct)
            } else {
                topVM.setLeftBtn(text: "\(myType.rawValue)", font: .nps(font: .bold, size: 24),
                                 size: CGPoint(x: 40, y: 40), action: leftAct)
            }
            topVM.setRightBtn(Image(.Icon.plus), size: CGPoint(x: 40, y: 40), action: rightAct)
            
            btnVM.setImage(for: leftBtnID, newImage: Image(.Icon.left))
            btnVM.setImage(for: rightBtnID, newImage: Image(.Icon.right))
            
            btnVM.setSize(for: leftBtnID, newWidth: 24, newHeight: 24)
            btnVM.setSize(for: rightBtnID, newWidth: 24, newHeight: 24)
        }
    }
    
    func leftAct() {
        printLog("왼쪽 버튼 클릭")
    }
    func rightAct() {
        printLog("오른쪽 버튼 클릭")
    }
}

struct SelectChatMenu: View {
    @Binding var chatMenu: chatType
    let tag: chatType
    let image: Image
    let title: String
    
    var body: some View {
        HStack(alignment: .center, spacing: 4) {
            if chatMenu == tag {
                image.resizable()
                    .frame(width: 24, height: 24, alignment: .center)
                Text("\(title)")
                    .font(.nps(font: .bold, size: 24))
                    .foregroundStyle(Color(.Text.detail))
            } else {
                image.resizable()
                    .renderingMode(.template)
                    .frame(width: 24, height: 24, alignment: .center)
                    .foregroundStyle(Color(.Disable.normal))
                Text("\(title)")
                    .font(.nps(size: 20))
                    .foregroundStyle(Color(.Disable.normal))
            }
        }
        .padding(2)
        .background {
            if chatMenu == tag {
                RoundedRectangle(cornerRadius: 4)
                    .foregroundStyle(Color.Other.cell)
            }
        }
        .onTapGesture {
            chatMenu = tag
        }
        
    }
}