import SwiftUI
import SharedModels
import SwiftData

struct OnboardingView: View {
    @Environment(\.cloudModelContextProvider) private var cloudModelContextProvider
    @AppStorage("onboardingComplete") private var onboardingComplete = false
    @State private var currentPage = 0
    @State private var selectedLevel: VerbLevel = .basic

    private let levels = VerbLevel.allCases
    private var cloudModelContext: ModelContext { cloudModelContextProvider() }

    var body: some View {
        TabView(selection: $currentPage) {
            // Page 1: Welcome
            VStack(spacing: 24) {
                Spacer()

                Image(systemName: "character.book.closed.fill")
                    .font(.system(size: 80))
                    .foregroundStyle(.blue)

                Text("Welcome to Conjuga")
                    .font(.largeTitle)
                    .fontWeight(.bold)

                Text("Master Spanish verb conjugations\nwith spaced repetition.")
                    .font(.title3)
                    .foregroundStyle(.secondary)
                    .multilineTextAlignment(.center)

                Spacer()

                Button("Get Started") {
                    withAnimation {
                        currentPage = 1
                    }
                }
                .buttonStyle(.borderedProminent)
                .controlSize(.large)
                .padding(.bottom, 48)
            }
            .padding()
            .tag(0)

            // Page 2: Level selection
            VStack(spacing: 24) {
                Spacer()

                Text("Choose Your Level")
                    .font(.title)
                    .fontWeight(.bold)

                Text("You can change this later in Settings.")
                    .font(.subheadline)
                    .foregroundStyle(.secondary)

                VStack(spacing: 12) {
                    ForEach(levels, id: \.self) { level in
                        Button {
                            selectedLevel = level
                        } label: {
                            HStack {
                                Text(level.displayName)
                                    .font(.headline)
                                Spacer()
                                if selectedLevel == level {
                                    Image(systemName: "checkmark.circle.fill")
                                        .foregroundStyle(.blue)
                                }
                            }
                            .padding()
                            .background(selectedLevel == level ? Color.blue.opacity(0.1) : Color(.secondarySystemBackground))
                            .clipShape(RoundedRectangle(cornerRadius: 12))
                        }
                        .tint(.primary)
                    }
                }
                .padding(.horizontal)

                Spacer()

                Button("Continue") {
                    withAnimation {
                        currentPage = 2
                    }
                }
                .buttonStyle(.borderedProminent)
                .controlSize(.large)
                .padding(.bottom, 48)
            }
            .padding()
            .tag(1)

            // Page 3: Ready
            VStack(spacing: 24) {
                Spacer()

                Image(systemName: "checkmark.seal.fill")
                    .font(.system(size: 80))
                    .foregroundStyle(.green)

                Text("You're All Set!")
                    .font(.largeTitle)
                    .fontWeight(.bold)

                Text("Start practicing with the most common\nSpanish verbs at your level.")
                    .font(.title3)
                    .foregroundStyle(.secondary)
                    .multilineTextAlignment(.center)

                Spacer()

                Button("Start Practicing") {
                    completeOnboarding()
                }
                .buttonStyle(.borderedProminent)
                .controlSize(.large)
                .padding(.bottom, 48)
            }
            .padding()
            .tag(2)
        }
        .tabViewStyle(.page)
        .indexViewStyle(.page(backgroundDisplayMode: .always))
    }

    private func completeOnboarding() {
        let progress = ReviewStore.fetchOrCreateUserProgress(context: cloudModelContext)
        progress.selectedVerbLevels = [selectedLevel]
        if progress.enabledTenseIDs.isEmpty {
            progress.enabledTenseIDs = ReviewStore.defaultEnabledTenses()
        }
        try? cloudModelContext.save()
        onboardingComplete = true
    }
}

#Preview {
    OnboardingView()
        .modelContainer(for: UserProgress.self, inMemory: true)
}
