Reflect/Shared/Views/SettingsView/SettingsTabView.swift

//
//  SettingsTabView.swift
//  Feels (iOS)
//
//  Created by Trey Tartt on 12/13/25.
//

import SwiftUI
import StoreKit

enum SettingsTab: String, CaseIterable {
    case customize = "Customize"
    case settings = "Settings"
}

struct SettingsTabView: View {
    @State private var selectedTab: SettingsTab = .customize
    @State private var showWhyUpgrade = false
    @State private var showSubscriptionStore = false

    @EnvironmentObject var authManager: BiometricAuthManager
    @EnvironmentObject var iapManager: IAPManager

    @AppStorage(UserDefaultsStore.Keys.theme.rawValue, store: GroupUserDefaults.groupDefaults) private var theme: Theme = .system
    @AppStorage(UserDefaultsStore.Keys.textColor.rawValue, store: GroupUserDefaults.groupDefaults) private var textColor: Color = DefaultTextColor.textColor

    var body: some View {
        VStack(spacing: 0) {
            // Header
            Text("Settings")
                .font(.system(size: 28, weight: .bold, design: .rounded))
                .foregroundColor(textColor)
                .frame(maxWidth: .infinity, alignment: .leading)
                .padding(.horizontal, 16)
                .padding(.top, 8)

            // Upgrade Banner (only show if not subscribed)
            if !iapManager.isSubscribed {
                UpgradeBannerView(
                    showWhyUpgrade: $showWhyUpgrade,
                    showSubscriptionStore: $showSubscriptionStore,
                    trialExpirationDate: iapManager.trialExpirationDate
                )
                .padding(.horizontal, 16)
                .padding(.top, 12)
            }

            // Segmented control
            Picker("", selection: $selectedTab) {
                ForEach(SettingsTab.allCases, id: \.self) { tab in
                    Text(tab.rawValue).tag(tab)
                }
            }
            .pickerStyle(.segmented)
            .padding(.horizontal, 16)
            .padding(.top, 12)
            .padding(.bottom, 16)

            // Content based on selected tab
            if selectedTab == .customize {
                CustomizeContentView()
            } else {
                SettingsContentView()
                    .environmentObject(authManager)
            }
        }
        .background(
            theme.currentTheme.bg
                .edgesIgnoringSafeArea(.all)
        )
        .sheet(isPresented: $showWhyUpgrade) {
            WhyUpgradeView()
        }
        .sheet(isPresented: $showSubscriptionStore) {
            FeelsSubscriptionStoreView()
                .environmentObject(iapManager)
        }
    }
}

// MARK: - Upgrade Banner View
struct UpgradeBannerView: View {
    @Binding var showWhyUpgrade: Bool
    @Binding var showSubscriptionStore: Bool
    let trialExpirationDate: Date?

    @Environment(\.colorScheme) private var colorScheme
    @AppStorage(UserDefaultsStore.Keys.textColor.rawValue, store: GroupUserDefaults.groupDefaults) private var textColor: Color = DefaultTextColor.textColor

    var body: some View {
        VStack(spacing: 12) {
            // Countdown timer
            HStack(spacing: 6) {
                Image(systemName: "clock")
                    .font(.system(size: 14, weight: .medium))
                    .foregroundColor(.orange)

                if let expirationDate = trialExpirationDate {
                    Text("\(Text("Trial expires in ").font(.system(size: 14, weight: .medium)).foregroundColor(textColor.opacity(0.8)))\(Text(expirationDate, style: .relative).font(.system(size: 14, weight: .bold)).foregroundColor(.orange))")
                } else {
                    Text("Trial expired")
                        .font(.system(size: 14, weight: .medium))
                        .foregroundColor(.orange)
                }
            }

            // Buttons in HStack
            HStack(spacing: 12) {
                // Why Upgrade button
                Button {
                    showWhyUpgrade = true
                } label: {
                    Text("Why Upgrade?")
                        .font(.system(size: 14, weight: .semibold))
                        .foregroundColor(.accentColor)
                        .frame(maxWidth: .infinity)
                        .padding(.vertical, 10)
                        .background(
                            RoundedRectangle(cornerRadius: 10)
                                .stroke(Color.accentColor, lineWidth: 1.5)
                        )
                }

                // Subscribe button
                Button {
                    showSubscriptionStore = true
                } label: {
                    Text("Subscribe")
                        .font(.system(size: 14, weight: .semibold))
                        .foregroundColor(.white)
                        .frame(maxWidth: .infinity)
                        .padding(.vertical, 10)
                        .background(
                            RoundedRectangle(cornerRadius: 10)
                                .fill(Color.pink)
                        )
                }
            }
        }
        .padding(14)
        .background(
            RoundedRectangle(cornerRadius: 14)
                .fill(colorScheme == .dark ? Color(.systemGray6) : Color(.systemGray6).opacity(0.5))
        )
    }
}

// MARK: - Why Upgrade View
struct WhyUpgradeView: View {
    @Environment(\.dismiss) private var dismiss
    @Environment(\.colorScheme) private var colorScheme

    var body: some View {
        NavigationView {
            ScrollView {
                VStack(spacing: 24) {
                    // Header
                    VStack(spacing: 12) {
                        Image(systemName: "star.fill")
                            .font(.system(size: 50))
                            .foregroundStyle(
                                LinearGradient(
                                    colors: [.orange, .pink],
                                    startPoint: .topLeading,
                                    endPoint: .bottomTrailing
                                )
                            )

                        Text("Unlock Premium")
                            .font(.system(size: 28, weight: .bold))

                        Text("Get the most out of your mood tracking journey")
                            .font(.body)
                            .foregroundColor(.secondary)
                            .multilineTextAlignment(.center)
                    }
                    .padding(.top, 20)

                    // Benefits list
                    VStack(spacing: 16) {
                        PremiumBenefitRow(
                            icon: "calendar",
                            iconColor: .blue,
                            title: "Month View",
                            description: "See your mood patterns across entire months at a glance"
                        )

                        PremiumBenefitRow(
                            icon: "chart.bar.fill",
                            iconColor: .green,
                            title: "Year View",
                            description: "Track long-term trends and see how your mood evolves over time"
                        )

                        PremiumBenefitRow(
                            icon: "lightbulb.fill",
                            iconColor: .yellow,
                            title: "AI Insights",
                            description: "Get personalized insights and patterns discovered by AI"
                        )

                        PremiumBenefitRow(
                            icon: "note.text",
                            iconColor: .purple,
                            title: "Journal Notes",
                            description: "Add notes and context to your mood entries"
                        )

                        PremiumBenefitRow(
                            icon: "photo.fill",
                            iconColor: .pink,
                            title: "Photo Attachments",
                            description: "Capture moments with photos attached to entries"
                        )

                        PremiumBenefitRow(
                            icon: "heart.fill",
                            iconColor: .red,
                            title: "Health Integration",
                            description: "Correlate mood with steps, sleep, and exercise data"
                        )

                        PremiumBenefitRow(
                            icon: "square.and.arrow.up",
                            iconColor: .orange,
                            title: "Export Data",
                            description: "Export your data as CSV or beautiful PDF reports"
                        )

                        PremiumBenefitRow(
                            icon: "faceid",
                            iconColor: .gray,
                            title: "Privacy Lock",
                            description: "Protect your data with Face ID or Touch ID"
                        )
                    }
                    .padding(.horizontal, 20)
                }
                .padding(.bottom, 40)
            }
            .navigationBarTitleDisplayMode(.inline)
            .toolbar {
                ToolbarItem(placement: .navigationBarTrailing) {
                    Button("Done") {
                        dismiss()
                    }
                }
            }
        }
    }
}

// MARK: - Premium Benefit Row
struct PremiumBenefitRow: View {
    let icon: String
    let iconColor: Color
    let title: String
    let description: String

    @Environment(\.colorScheme) private var colorScheme

    var body: some View {
        HStack(alignment: .top, spacing: 14) {
            Image(systemName: icon)
                .font(.system(size: 22))
                .foregroundColor(iconColor)
                .frame(width: 44, height: 44)
                .background(
                    RoundedRectangle(cornerRadius: 10)
                        .fill(iconColor.opacity(0.15))
                )

            VStack(alignment: .leading, spacing: 4) {
                Text(title)
                    .font(.system(size: 16, weight: .semibold))

                Text(description)
                    .font(.system(size: 14))
                    .foregroundColor(.secondary)
            }

            Spacer()
        }
        .padding(14)
        .background(
            RoundedRectangle(cornerRadius: 12)
                .fill(colorScheme == .dark ? Color(.systemGray6) : .white)
        )
    }
}

struct SettingsTabView_Previews: PreviewProvider {
    static var previews: some View {
        SettingsTabView()
            .environmentObject(BiometricAuthManager())
            .environmentObject(IAPManager())
    }
}