//
//  SheetContainerView.swift
//  CasinoKit
//
//  A reusable container view for modal sheets with consistent styling.
//

import SwiftUI

/// A reusable container for modal sheets providing consistent casino-themed styling.
///
/// Usage:
/// ```swift
/// SheetContainerView(title: "Settings") {
///     // Your content here
/// } onDone: {
///     dismiss()
/// }
/// ```
///
/// With cancel button:
/// ```swift
/// SheetContainerView(
///     title: "Settings",
///     content: { ... },
///     onCancel: { dismiss() },
///     onDone: { save(); dismiss() }
/// )
/// ```
public struct SheetContainerView<Content: View>: View {
    let title: String
    @ViewBuilder let content: Content
    
    /// Optional cancel action (shows Cancel button on left if provided)
    var onCancel: (() -> Void)?
    
    /// Done action (always shown on right)
    let onDone: () -> Void
    
    /// Done button text (defaults to "Done")
    var doneButtonText: String
    
    /// Cancel button text (defaults to "Cancel")
    var cancelButtonText: String
    
    /// Creates a sheet container with the specified configuration.
    /// - Parameters:
    ///   - title: The navigation title for the sheet.
    ///   - content: The content to display inside the sheet.
    ///   - onCancel: Optional cancel action. If provided, shows a Cancel button.
    ///   - onDone: The action to perform when Done is tapped.
    ///   - doneButtonText: Custom text for the Done button.
    ///   - cancelButtonText: Custom text for the Cancel button.
    public init(
        title: String,
        @ViewBuilder content: () -> Content,
        onCancel: (() -> Void)? = nil,
        onDone: @escaping () -> Void,
        doneButtonText: String = "Done",
        cancelButtonText: String = "Cancel"
    ) {
        self.title = title
        self.content = content()
        self.onCancel = onCancel
        self.onDone = onDone
        self.doneButtonText = doneButtonText
        self.cancelButtonText = cancelButtonText
    }
    
    public var body: some View {
        NavigationStack {
            ZStack {
                // Consistent background
                Color.Sheet.background
                    .ignoresSafeArea()
                
                ScrollView {
                    VStack(spacing: CasinoDesign.Spacing.xxLarge) {
                        content
                    }
                    .padding(.vertical)
                }
            }
            .navigationTitle(title)
            .navigationBarTitleDisplayMode(.inline)
            .toolbarBackground(Color.Sheet.background, for: .navigationBar)
            .toolbarBackground(.visible, for: .navigationBar)
            .toolbarColorScheme(.dark, for: .navigationBar)
            .toolbar {
                if let onCancel {
                    ToolbarItem(placement: .topBarLeading) {
                        Button(cancelButtonText) {
                            onCancel()
                        }
                        .foregroundStyle(Color.Sheet.cancelText)
                    }
                }
                
                ToolbarItem(placement: .topBarTrailing) {
                    Button(doneButtonText) {
                        onDone()
                    }
                    .bold()
                    .foregroundStyle(Color.Sheet.accent)
                }
            }
        }
    }
}

/// A styled section for use within sheets with icon + title header.
///
/// Usage:
/// ```swift
/// SheetSection(title: "SETTINGS", icon: "gearshape") {
///     Toggle("Enable Feature", isOn: $isEnabled)
/// }
/// ```
public struct SheetSection<Content: View>: View {
    let title: String
    let icon: String
    @ViewBuilder let content: Content
    
    /// Creates a sheet section with an icon and title header.
    /// - Parameters:
    ///   - title: The section title (displayed uppercase).
    ///   - icon: The SF Symbol name for the icon.
    ///   - content: The content to display inside the section card.
    public init(
        title: String,
        icon: String,
        @ViewBuilder content: () -> Content
    ) {
        self.title = title
        self.icon = icon
        self.content = content()
    }
    
    public var body: some View {
        VStack(alignment: .leading, spacing: CasinoDesign.Spacing.medium) {
            // Header with icon
            HStack(spacing: CasinoDesign.Spacing.small) {
                Image(systemName: icon)
                    .font(.system(size: CasinoDesign.BaseFontSize.small, weight: .semibold))
                    .foregroundStyle(Color.Sheet.accent.opacity(CasinoDesign.Opacity.heavy))
                
                Text(title)
                    .font(.system(size: CasinoDesign.BaseFontSize.small, weight: .bold, design: .rounded))
                    .tracking(1)
                    .foregroundStyle(Color.Sheet.secondaryText)
            }
            .padding(.horizontal, CasinoDesign.Spacing.xSmall)
            
            // Content card
            VStack(spacing: 0) {
                content
            }
            .padding()
            .background(
                RoundedRectangle(cornerRadius: CasinoDesign.CornerRadius.large)
                    .fill(Color.Sheet.sectionFill)
            )
        }
        .padding(.horizontal)
    }
}

// MARK: - Preview

#Preview("Sheet with Cancel") {
    SheetContainerView(
        title: "Example Sheet",
        content: {
            SheetSection(title: "SECTION ONE", icon: "star.fill") {
                Text("Content here")
                    .foregroundStyle(.white)
            }
            
            SheetSection(title: "SECTION TWO", icon: "heart.fill") {
                Text("More content")
                    .foregroundStyle(.white)
            }
        },
        onCancel: { },
        onDone: { }
    )
}

#Preview("Sheet without Cancel") {
    SheetContainerView(title: "Statistics") {
        SheetSection(title: "SUMMARY", icon: "chart.pie.fill") {
            Text("Stats here")
                .foregroundStyle(.white)
        }
    } onDone: { }
}

