import SwiftUI

struct CreatorChannelView: View {
    let creatorId: Int

    @StateObject private var viewModel = CreatorChannelViewModel()
    @Environment(\.dismiss) private var dismiss

    var body: some View {
        ZStack {
            Color.black.ignoresSafeArea()

            VStack(spacing: 0) {
                titleBar
                tabBar
                selectedTabContent
            }

            if viewModel.isLoading {
                LoadingView()
            }
        }
        .navigationBarBackButtonHidden(true)
        .onAppear {
            if viewModel.hasLoaded == false {
                viewModel.fetchHome(creatorId: creatorId)
            }
        }
        .sodaToast(isPresented: $viewModel.isShowPopup, message: viewModel.errorMessage, autohideIn: 1)
    }

    private var titleBar: some View {
        HStack(spacing: 12) {
            Button {
                dismiss()
            } label: {
                Image(systemName: "chevron.left")
                    .foregroundColor(.white)
                    .frame(width: 44, height: 44)
            }

            Spacer()

            if let creator = viewModel.response?.creator {
                Button {
                    if creator.isFollow {
                        viewModel.creatorFollow(follow: false, notify: false)
                    } else {
                        viewModel.creatorFollow(follow: true, notify: true)
                    }
                } label: {
                    Text(creator.isFollow ? I18n.CreatorChannelHome.following : I18n.CreatorChannelHome.follow)
                        .font(.system(size: 13, weight: .semibold))
                        .foregroundColor(creator.isFollow ? .white : .black)
                        .padding(.horizontal, 12)
                        .frame(height: 30)
                        .background(creator.isFollow ? Color.gray33 : Color.soda400)
                        .clipShape(Capsule())
                }

                if creator.isFollow {
                    Button {
                        if creator.isNotify {
                            viewModel.creatorFollow(follow: true, notify: false)
                        } else {
                            viewModel.creatorFollow(follow: true, notify: true)
                        }
                    } label: {
                        Image(systemName: creator.isNotify ? "bell.fill" : "bell")
                            .foregroundColor(.white)
                            .frame(width: 44, height: 44)
                    }
                }
            }
        }
        .frame(height: 56)
        .padding(.horizontal, 8)
        .background(Color.black)
    }

    private var tabBar: some View {
        ScrollView(.horizontal, showsIndicators: false) {
            HStack(spacing: 20) {
                ForEach(CreatorChannelTab.allCases, id: \.self) { tab in
                    Button {
                        viewModel.selectedTab = tab
                    } label: {
                        VStack(spacing: 8) {
                            Text(tab.title)
                                .font(.system(size: 15, weight: viewModel.selectedTab == tab ? .semibold : .regular))
                                .foregroundColor(viewModel.selectedTab == tab ? .white : Color.gray500)

                            Rectangle()
                                .fill(viewModel.selectedTab == tab ? Color.soda400 : Color.clear)
                                .frame(height: 2)
                        }
                    }
                }
            }
            .padding(.horizontal, 20)
        }
        .frame(height: 48)
        .background(Color.black)
    }

    @ViewBuilder
    private var selectedTabContent: some View {
        if viewModel.selectedTab != .home || viewModel.isApiFailedPlaceholderVisible {
            CreatorChannelPlaceholderTabView(title: viewModel.selectedTab.title)
        } else if let response = viewModel.response {
            CreatorChannelHomeView(response: response) { tab in
                viewModel.selectedTab = tab
            }
        } else {
            CreatorChannelPlaceholderTabView(title: CreatorChannelTab.home.title)
        }
    }
}