//
//  ClockDisplayContainer.swift
//  TheNoiseClock
//
//  Created by Matt Bruce on 9/8/25.
//

import SwiftUI
import Bedrock

/// Container component that handles the main clock display layout and scaling
struct ClockDisplayContainer: View {
    
    // MARK: - Properties
    let currentTime: Date
    let style: ClockStyle
    let isDisplayMode: Bool
    
    // MARK: - Body
    var body: some View {
        return GeometryReader { geometry in
            let isPortrait = geometry.size.height >= geometry.size.width
            let hasOverlay = style.showBattery || style.showDate
            let topSpacing = hasOverlay ? (isPortrait ? Design.Spacing.xxLarge : Design.Spacing.large) : 0
            
            VStack(spacing: 0) {
                // Top spacing to account for overlay
                if hasOverlay {
                    Spacer()
                        .frame(height: topSpacing)
                }
                
                // Time display - fills remaining space
                TimeDisplayView(
                    date: currentTime,
                    use24Hour: style.use24Hour,
                    showSeconds: style.showSeconds,
                    showAmPm: style.showAmPm,
                    digitColor: style.effectiveDigitColor,
                    glowIntensity: style.glowIntensity,
                    manualScale: style.digitScale,
                    stretched: style.stretched,
                    clockOpacity: style.clockOpacity,
                    fontFamily: style.fontFamily,
                    fontWeight: style.fontWeight,
                    fontDesign: style.fontDesign,
                    forceHorizontalMode: style.forceHorizontalMode,
                    isDisplayMode: isDisplayMode
                )
                .transition(.opacity)
                
                Spacer()
            }
            .animation(.smooth(duration: Design.Animation.standard), value: isDisplayMode)
        }
    }
}

// MARK: - Preview
#Preview {
    ClockDisplayContainer(
        currentTime: Date(),
        style: ClockStyle(),
        isDisplayMode: false
    )
    .frame(width: 400, height: 600)
    .background(Color.black)
}
