import SwiftUI

struct SidebarView: View {
    @Bindable var viewModel: FrontPageViewModel

    var body: some View {
        VStack(spacing: 0) {
            header
            navigationSections
            Spacer(minLength: 0)
            upgradeCard
        }
        .frame(width: AppTheme.sidebarWidth)
        .background(AppTheme.sidebarBackground)
        .overlay(alignment: .trailing) {
            Rectangle()
                .fill(AppTheme.border)
                .frame(width: 1)
        }
    }

    private var header: some View {
        HStack(spacing: AppTheme.sidebarRowSpacing) {
            ZStack {
                RoundedRectangle(cornerRadius: 10)
                    .fill(
                        LinearGradient(
                            colors: [AppTheme.accentPurpleLight, AppTheme.accentPurple],
                            startPoint: .topLeading,
                            endPoint: .bottomTrailing
                        )
                    )
                    .frame(width: AppTheme.iconContainerSize, height: AppTheme.iconContainerSize)
                Image(systemName: "brain.head.profile")
                    .font(.system(size: 14, weight: .semibold))
                    .foregroundStyle(.white)
            }
            .frame(width: AppTheme.iconContainerSize, height: AppTheme.iconContainerSize)

            VStack(alignment: .leading, spacing: 2) {
                Text("Reddora AI")
                    .font(.system(size: 15, weight: .bold))
                    .foregroundStyle(AppTheme.textPrimary)
                Text("AI Assistant for Reddit")
                    .font(.system(size: 10))
                    .foregroundStyle(AppTheme.textSecondary)
            }

            Spacer(minLength: 0)
        }
        .padding(.horizontal, AppTheme.sidebarContentInset + AppTheme.sidebarRowPaddingH)
        .padding(.top, 20)
        .padding(.bottom, 16)
    }

    private var navigationSections: some View {
        ScrollView {
            VStack(alignment: .leading, spacing: AppTheme.sidebarSectionSpacing) {
                sidebarSection(title: SidebarSection.quickAccess.rawValue) {
                    SidebarQuickAccessItemView(isSelected: viewModel.isRedditActive) {
                        viewModel.openReddit()
                    }
                }

                sidebarSection(title: SidebarSection.create.rawValue) {
                    ForEach(viewModel.createItems) { item in
                        SidebarNavItemView(item: item, isSelected: viewModel.selectedNavItem == item) {
                            viewModel.selectNavItem(item)
                        }
                    }
                }

                sidebarSection(title: SidebarSection.settings.rawValue) {
                    SidebarNavItemView(
                        item: FrontPageViewModel.settingsItem,
                        isSelected: viewModel.isSettingsActive
                    ) {
                        viewModel.openSettings()
                    }
                }
            }
            .padding(.horizontal, AppTheme.sidebarContentInset)
            .padding(.top, 4)
        }
    }

    private func sidebarSection<Content: View>(
        title: String,
        @ViewBuilder content: () -> Content
    ) -> some View {
        VStack(alignment: .leading, spacing: AppTheme.sidebarItemSpacing) {
            SidebarSectionHeader(title: title)
            content()
        }
    }

    private var upgradeCard: some View {
        VStack(alignment: .center, spacing: 8) {
            HStack(spacing: 6) {
                Image(systemName: "crown.fill")
                    .font(.system(size: 12))
                    .foregroundStyle(AppTheme.accentYellow)
                Text("Upgrade to Pro")
                    .font(.system(size: 12, weight: .semibold))
                    .foregroundStyle(AppTheme.textPrimary)
            }

            Text("Unlock unlimited AI generations and advanced analytics")
                .font(.system(size: 10))
                .foregroundStyle(AppTheme.textSecondary)
                .multilineTextAlignment(.center)
                .fixedSize(horizontal: false, vertical: true)
                .lineSpacing(2)

            Button("Upgrade Now") {
                viewModel.showPaywall()
            }
                .font(.system(size: 11, weight: .semibold))
                .foregroundStyle(.white)
                .frame(maxWidth: .infinity)
                .padding(.vertical, 6)
                .background(AppTheme.accentPurple)
                .clipShape(RoundedRectangle(cornerRadius: 8))
                .buttonStyle(.plain)
        }
        .frame(maxWidth: .infinity, minHeight: 105)
        .padding(.horizontal, 12)
        .padding(.vertical, 12)
        .background(
            RoundedRectangle(cornerRadius: AppTheme.cornerRadiusSmall)
                .fill(AppTheme.cardBackground)
                .overlay(
                    RoundedRectangle(cornerRadius: AppTheme.cornerRadiusSmall)
                        .stroke(AppTheme.accentPurple.opacity(0.25), lineWidth: 1)
                )
        )
        .padding(.horizontal, AppTheme.sidebarContentInset + 8)
        .padding(.top, 12)
        .padding(.bottom, 20)
        .overlay(alignment: .top) {
            Rectangle()
                .fill(AppTheme.border)
                .frame(height: 1)
        }
    }
}