fix(activity): fix weekday headers, polishing

Author: pwltr

Bitkit/Components/Activity/DateRangeSelectorSheet.swift

@@ -4,13 +4,12 @@ import SwiftUI
 
 struct DateRangeSelectorSheetItem: SheetItem {
     let id: SheetID = .dateRangeSelector
-    let size: SheetSize = .medium
+    let size: SheetSize = .calendar
 }
 
 // MARK: - DateRangeSelectorSheet
 
 struct DateRangeSelectorSheet: View {
-    @EnvironmentObject private var sheets: SheetViewModel
     @Environment(\.calendar) var calendar
     @ObservedObject var viewModel: ActivityListViewModel
     @Binding var isPresented: Bool
@@ -41,14 +40,25 @@ struct DateRangeSelectorSheet: View {
     }
 
     private var daysInMonth: [Date?] {
-        guard let monthInterval = calendar.dateInterval(of: .month, for: displayedMonth),
-              let monthFirstWeek = calendar.dateInterval(of: .weekOfMonth, for: monthInterval.start)
-        else {
+        guard let monthInterval = calendar.dateInterval(of: .month, for: displayedMonth) else {
+            return []
+        }
+
+        // Get the first day of the month
+        let firstDayOfMonth = monthInterval.start
+
+        // Find the first day of the week that contains the first day of the month
+        // This ensures alignment with the weekday headers
+        let firstWeekday = calendar.component(.weekday, from: firstDayOfMonth)
+        let firstDayOfWeek = calendar.firstWeekday
+        let daysToSubtract = (firstWeekday - firstDayOfWeek + 7) % 7
+
+        guard let calendarStartDate = calendar.date(byAdding: .day, value: -daysToSubtract, to: firstDayOfMonth) else {
             return []
         }
 
         var days: [Date?] = []
-        var currentDate = monthFirstWeek.start
+        var currentDate = calendarStartDate
 
         while days.count < 42 { // 6 weeks max
             if calendar.isDate(currentDate, equalTo: displayedMonth, toGranularity: .month) {
@@ -74,37 +84,39 @@ struct DateRangeSelectorSheet: View {
                 VStack(alignment: .leading, spacing: 16) {
                     // Month navigation
                     HStack {
-                        Text(monthYearString)
-                            .font(.custom(Fonts.semiBold, size: 17))
-                            .foregroundColor(.white)
+                        BodyMSBText(monthYearString)
                         Spacer()
 
                         Button(action: previousMonth) {
-                            Image(systemName: "chevron.left")
+                            Image("chevron")
+                                .resizable()
                                 .foregroundColor(.brandAccent)
-                                .frame(width: 44, height: 44)
+                                .frame(width: 24, height: 24)
+                                .rotationEffect(.degrees(180))
+                                .frame(width: 44, height: 44) // Increase hit area
                         }
                         .padding(.leading, 8)
                         .accessibilityIdentifier("PrevMonth")
 
                         Button(action: nextMonth) {
-                            Image(systemName: "chevron.right")
+                            Image("chevron")
+                                .resizable()
                                 .foregroundColor(.brandAccent)
-                                .frame(width: 44, height: 44)
+                                .frame(width: 24, height: 24)
+                                .frame(width: 44, height: 44) // Increase hit area
                         }
                         .accessibilityIdentifier("NextMonth")
                     }
                     .padding(.horizontal, 16)
 
                     // Weekday headers
                     HStack(spacing: 0) {
-                        ForEach(calendar.shortWeekdaySymbols, id: \.self) { symbol in
-                            CaptionText(symbol.uppercased())
-                                .foregroundColor(.white64)
+                        ForEach(0 ..< 7, id: \.self) { index in
+                            let weekdayIndex = (index + calendar.firstWeekday - 1) % 7
+                            CaptionMText(calendar.shortWeekdaySymbols[weekdayIndex])
                                 .frame(maxWidth: .infinity)
                         }
                     }
-                    .padding(.horizontal, 16)
 
                     // Calendar grid
                     LazyVGrid(columns: Array(repeating: GridItem(.flexible(), spacing: 0), count: 7), spacing: 8) {
@@ -122,11 +134,10 @@ struct DateRangeSelectorSheet: View {
                                 .accessibilityIdentifier(calendar.isDateInToday(date) ? "Today" : "Day-\(calendar.component(.day, from: date))")
                             } else {
                                 Color.clear
-                                    .frame(height: 40)
+                                    .frame(height: 48)
                             }
                         }
                     }
-                    .padding(.horizontal, 16)
 
                     // Display selected range (fixed height to prevent layout jump)
                     VStack {
@@ -172,7 +183,6 @@ struct DateRangeSelectorSheet: View {
                         startDate = nil
                         endDate = nil
                         viewModel.clearDateRange()
-                        isPresented = false
                     }
                     .accessibilityIdentifier("CalendarClearButton")
 
@@ -278,9 +288,23 @@ struct CalendarDayView: View {
                     } else if isStartDate {
                         Circle()
                             .fill(Color.brand16)
+                        UnevenRoundedRectangle(
+                            topLeadingRadius: 44,
+                            bottomLeadingRadius: 44,
+                            bottomTrailingRadius: 0,
+                            topTrailingRadius: 0
+                        )
+                        .fill(Color.brand16)
                     } else if isEndDate {
                         Circle()
                             .fill(Color.brand16)
+                        UnevenRoundedRectangle(
+                            topLeadingRadius: 0,
+                            bottomLeadingRadius: 0,
+                            bottomTrailingRadius: 44,
+                            topTrailingRadius: 44
+                        )
+                        .fill(Color.brand16)
                     } else {
                         // Middle of range
                         Rectangle()
@@ -289,18 +313,16 @@ struct CalendarDayView: View {
                 }
 
                 // Day number
-                Text(dayNumber)
-                    .font(.custom(Fonts.regular, size: 16))
-                    .foregroundColor(isStartDate || isEndDate ? Color.brandAccent : Color.white)
+                BodyMSBText(dayNumber, textColor: isStartDate || isEndDate ? Color.brandAccent : Color.white)
 
                 // Today indicator
                 if isToday && !isSelected {
                     Circle()
-                        .stroke(Color.brandAccent, lineWidth: 1)
+                        .fill(Color.white10)
                 }
             }
         }
-        .frame(height: 40)
+        .frame(height: 48)
     }
 }
 

Bitkit/Views/Sheets/Sheet.swift

@@ -1,7 +1,7 @@
 import SwiftUI
 
 enum SheetSize {
-    case small, medium, large
+    case small, medium, large, calendar
 
     var height: CGFloat {
         let screenHeight = UIScreen.screenHeight
@@ -31,6 +31,16 @@ enum SheetSize {
                 return max(minHeight, largePreferredHeight)
             }
             return preferredHeight
+        case .calendar:
+            let minHeight: CGFloat = 600
+            // same as medium + 40px, to be just under search input
+            let preferredHeight = screenHeight - balanceSpacing + 40
+            if preferredHeight < minHeight {
+                // Use large sheet size when it's too small
+                let largePreferredHeight = screenHeight - headerSpacing
+                return max(minHeight, largePreferredHeight)
+            }
+            return preferredHeight
         case .large:
             let minHeight: CGFloat = 600
             // Only Header visible