import SwiftUI

struct SettingsView: View {
    @StateObject private var settings = AppSettings.shared

    var body: some View {
        VStack(alignment: .leading, spacing: 18) {
            VStack(alignment: .leading, spacing: 4) {
                Text("TokenLens 设置")
                    .font(.system(size: 22, weight: .bold, design: .rounded))
                Text("控制桌面辅助入口和菜单栏显示。")
                    .foregroundStyle(.secondary)
            }

            VStack(spacing: 12) {
                SettingsToggleRow(
                    title: "显示悬浮窗",
                    subtitle: "在桌面上显示总 Tokens 消耗，鼠标放上去展开详情。",
                    systemImage: "rectangle.on.rectangle",
                    isOn: $settings.showFloatingWindow
                )
                SettingsToggleRow(
                    title: "显示状态栏提示窗",
                    subtitle: "在 macOS 菜单栏显示当前总 Tokens 数量。",
                    systemImage: "menubar.rectangle",
                    isOn: $settings.showStatusBarIndicator
                )
                SettingsPickerRow(
                    title: "自动回收",
                    subtitle: "悬浮窗和状态栏详情展开后的自动收起时间。",
                    systemImage: "timer",
                    selection: $settings.autoCollapseSeconds,
                    options: AutoCollapseDelay.allCases.map { ($0.rawValue, $0.label) }
                )
                SettingsPickerRow(
                    title: "悬浮窗皮肤",
                    subtitle: "控制悬浮窗亮色、暗色或跟随系统主题。",
                    systemImage: "circle.lefthalf.filled",
                    selection: Binding(
                        get: { settings.floatingAppearance.rawValue },
                        set: { settings.floatingAppearance = FloatingAppearance(rawValue: $0) ?? .system }
                    ),
                    options: FloatingAppearance.allCases.map { ($0.rawValue, $0.rawValue) }
                )
            }
            Spacer()
        }
        .padding(26)
        .frame(width: 520, height: 430)
    }
}

private struct SettingsToggleRow: View {
    let title: String
    let subtitle: String
    let systemImage: String
    @Binding var isOn: Bool

    var body: some View {
        HStack(spacing: 12) {
            Image(systemName: systemImage)
                .font(.system(size: 18, weight: .semibold))
                .frame(width: 34, height: 34)
                .background(.thinMaterial, in: RoundedRectangle(cornerRadius: 10, style: .continuous))
            VStack(alignment: .leading, spacing: 3) {
                Text(title)
                    .font(.system(size: 14, weight: .semibold))
                Text(subtitle)
                    .font(.system(size: 12))
                    .foregroundStyle(.secondary)
            }
            Spacer()
            Toggle("", isOn: $isOn)
                .toggleStyle(.switch)
                .labelsHidden()
        }
        .padding(12)
        .background(.ultraThinMaterial, in: RoundedRectangle(cornerRadius: 14, style: .continuous))
    }
}

private struct SettingsPickerRow<Value: Hashable>: View {
    let title: String
    let subtitle: String
    let systemImage: String
    @Binding var selection: Value
    let options: [(Value, String)]

    var body: some View {
        HStack(spacing: 12) {
            Image(systemName: systemImage)
                .font(.system(size: 18, weight: .semibold))
                .frame(width: 34, height: 34)
                .background(.thinMaterial, in: RoundedRectangle(cornerRadius: 10, style: .continuous))
            VStack(alignment: .leading, spacing: 3) {
                Text(title)
                    .font(.system(size: 14, weight: .semibold))
                Text(subtitle)
                    .font(.system(size: 12))
                    .foregroundStyle(.secondary)
            }
            Spacer()
            Picker("", selection: $selection) {
                ForEach(options, id: \.0) { value, label in
                    Text(label).tag(value)
                }
            }
            .pickerStyle(.segmented)
            .frame(width: 190)
        }
        .padding(12)
        .background(.ultraThinMaterial, in: RoundedRectangle(cornerRadius: 14, style: .continuous))
    }
}
