import SwiftUI

struct CreatorChannelCommunityTabView: View {
    let creatorId: Int
    let isOwnCreatorChannel: Bool
    @ObservedObject var viewModel: CreatorChannelCommunityViewModel

    private let gridColumns = [
        GridItem(.flexible(), spacing: 0),
        GridItem(.flexible(), spacing: 0),
        GridItem(.flexible(), spacing: 0)
    ]

    var body: some View {
        content
        .background(Color.black)
        .onAppear {
            if viewModel.hasLoaded == false {
                viewModel.fetchFirstPage(creatorId: creatorId)
            }
        }
        .sheet(isPresented: $viewModel.isShowCommentListView) {
            NavigationStack {
                CreatorCommunityCommentListView(
                    isPresented: $viewModel.isShowCommentListView,
                    creatorId: creatorId,
                    postId: viewModel.selectedPostId,
                    isShowSecret: viewModel.isShowSecret
                )
            }
            .toolbar(.hidden, for: .navigationBar)
        }
        .sodaToast(isPresented: $viewModel.isShowPopup, message: viewModel.errorMessage, autohideIn: 1)
    }

    private var content: some View {
        VStack(spacing: 0) {
            if isEmptyState {
                CreatorChannelCommunityEmptyView()
            } else {
                CreatorChannelCommunityViewModeBar(
                    communityPostCount: viewModel.communityPostCount,
                    viewMode: viewModel.viewMode,
                    onTapToggle: viewModel.toggleViewMode
                )

                if viewModel.viewMode == .list {
                    listContent
                } else {
                    gridContent
                }
            }
        }
    }

    private var listContent: some View {
        LazyVStack(spacing: SodaSpacing.s8) {
            ForEach(viewModel.communityPosts) { post in
                let isOwnPost = post.creatorId == UserDefaults.int(forKey: .userId)

                CreatorChannelCommunityListItem(
                    post: post,
                    isOwnPost: isOwnPost,
                    isOwnCreatorChannel: isOwnCreatorChannel,
                    onTapLike: {
                        viewModel.communityPostLike(postId: post.postId)
                    },
                    onTapComment: {
                        viewModel.openCommentList(post: post)
                    },
                    onTapMore: {
                        viewModel.openReportMenu(post: post)
                    },
                    onTapPurchase: {
                        viewModel.openPurchaseDialog(post: post)
                    }
                )
                .onAppear {
                    viewModel.fetchNextPageIfNeeded(creatorId: creatorId, currentItem: post)
                }
            }

            loadingNextPageView
        }
        .padding(.horizontal, SodaSpacing.s14)
        .padding(.bottom, contentBottomPadding)
    }

    private var gridContent: some View {
        LazyVGrid(columns: gridColumns, spacing: 0) {
            ForEach(viewModel.communityPosts) { post in
                let isOwnPost = post.creatorId == UserDefaults.int(forKey: .userId)

                CreatorChannelCommunityGridItem(
                    post: post,
                    isOwnPost: isOwnPost,
                    onTapPurchase: {
                        viewModel.openPurchaseDialog(post: post)
                    }
                )
                .onAppear {
                    viewModel.fetchNextPageIfNeeded(creatorId: creatorId, currentItem: post)
                }
            }

            loadingNextPageView
        }
        .padding(.bottom, contentBottomPadding)
    }

    @ViewBuilder
    private var loadingNextPageView: some View {
        if viewModel.isLoadingNextPage {
            ProgressView()
                .padding(.vertical, SodaSpacing.s20)
        }
    }

    private var isEmptyState: Bool {
        guard viewModel.hasLoaded else { return false }
        return viewModel.communityPostCount == 0
    }

    private var contentBottomPadding: CGFloat {
        isOwnCreatorChannel ? 120 : SodaSpacing.s20
    }

}