//
//  FontSection.swift
//  TheNoiseClock
//
//  Created by Matt Bruce on 9/7/25.
//

import SwiftUI
import Bedrock

struct FontSection: View {
    @Binding var style: ClockStyle
    
    // Computed property for available weights based on selected font
    private var availableWeights: [Font.Weight] {
        if style.fontFamily == .system {
            return Font.Weight.allCases
        } else {
            return style.fontFamily.fontWeights
        }
    }
    
    // Computed property for sorted font families (System first, then alphabetical)
    private var sortedFontFamilies: [FontFamily] {
        let allFamilies = FontFamily.allCases
        let systemFamily = allFamilies.filter { $0 == .system }
        let otherFamilies = allFamilies.filter { $0 != .system }.sorted { $0.rawValue < $1.rawValue }
        return systemFamily + otherFamilies
    }
    
    var body: some View {
        VStack(alignment: .leading, spacing: Design.Spacing.small) {
            SettingsSectionHeader(
                title: "Font",
                systemImage: "textformat",
                accentColor: AppAccent.primary
            )

            SettingsCard(backgroundColor: AppSurface.card, borderColor: AppBorder.subtle) {
                VStack(alignment: .leading, spacing: Design.Spacing.medium) {
                    VStack(alignment: .leading, spacing: Design.Spacing.xxSmall) {
                        Text("Family")
                            .font(.subheadline.weight(.medium))
                            .foregroundStyle(AppTextColors.primary)

                        Picker("Family", selection: $style.fontFamily) {
                            ForEach(sortedFontFamilies, id: \.self) { family in
                                Text(family.rawValue).tag(family)
                            }
                        }
                        .pickerStyle(.menu)
                        .onChange(of: style.fontFamily) { _, newFamily in
                            if newFamily != .system {
                                style.fontDesign = .default
                            }

                            let weights = newFamily == .system ? Font.Weight.allCases : newFamily.fontWeights
                            if !weights.contains(style.fontWeight) {
                                style.fontWeight = weights.first ?? .regular
                            }
                        }
                    }

                    VStack(alignment: .leading, spacing: Design.Spacing.xxSmall) {
                        Text("Weight")
                            .font(.subheadline.weight(.medium))
                            .foregroundStyle(AppTextColors.primary)

                        Picker("Weight", selection: $style.fontWeight) {
                            ForEach(availableWeights, id: \.self) { weight in
                                Text(weight.rawValue).tag(weight)
                            }
                        }
                        .pickerStyle(.menu)
                    }

                    if style.fontFamily == .system {
                        VStack(alignment: .leading, spacing: Design.Spacing.xxSmall) {
                            Text("Design")
                                .font(.subheadline.weight(.medium))
                                .foregroundStyle(AppTextColors.primary)

                            Picker("Design", selection: $style.fontDesign) {
                                ForEach(Font.Design.allCases, id: \.self) { design in
                                    Text(design.rawValue).tag(design)
                                }
                            }
                            .pickerStyle(.menu)
                        }
                    }

                    HStack {
                        Text("Preview")
                            .font(.subheadline.weight(.medium))
                            .foregroundStyle(AppTextColors.secondary)
                        Spacer()
                        Text("12:34")
                            .font(FontUtils.createFont(name: style.fontFamily, weight: style.fontWeight, design: style.fontDesign, size: 24))
                            .foregroundStyle(AppTextColors.primary)
                    }
                }
            }
        }
    }
}
