import SwiftUI

/// A torn-calendar-page date badge: month header over a day number and
/// weekday, used to give note rows an at-a-glance date.
struct CalendarBadge: View {
    let date: Date
    @Environment(\.colorScheme) private var colorScheme

    var body: some View {
        VStack(spacing: 0) {
            Text(month)
                .font(.system(size: 8, weight: .semibold))
                .foregroundColor(.white)
                .frame(maxWidth: .infinity)
                .padding(.top, 6)
                .padding(.bottom, 2)
                .background(Color.accentColor)

            VStack(spacing: 1) {
                Text(dayNumber)
                    .font(.system(size: 16, weight: .bold))
                Text(dayOfWeek)
                    .font(.system(size: 7))
                    .foregroundColor(.secondary)
            }
            .frame(maxWidth: .infinity)
            .padding(.top, 3)
            .padding(.bottom, 5)
            .background(.quaternary)
        }
        .frame(width: 36, height: 44)
        .clipShape(RoundedRectangle(cornerRadius: 5))
        .overlay(
            RoundedRectangle(cornerRadius: 5)
                .strokeBorder(
                    colorScheme == .dark ? Color.white.opacity(0.1) : Color.clear,
                    lineWidth: 0.5
                )
        )
    }

    private var month: String {
        date.formatted(.dateTime.month(.abbreviated)).uppercased()
    }

    private var dayNumber: String {
        date.formatted(.dateTime.day())
    }

    private var dayOfWeek: String {
        date.formatted(.dateTime.weekday(.abbreviated)).uppercased()
    }
}