wip

SportsTime/Features/Trip/Views/Wizard/Steps/GamePickerStep.swift

@@ -14,6 +14,8 @@ struct GamePickerStep: View {
     @Binding var selectedSports: Set<Sport>
     @Binding var selectedTeamIds: Set<String>
     @Binding var selectedGameIds: Set<String>
+    @Binding var startDate: Date
+    @Binding var endDate: Date
 
     @State private var showSportsPicker = false
     @State private var showTeamsPicker = false
@@ -68,10 +70,18 @@ struct GamePickerStep: View {
             // Selected Games Summary
             if !selectedGameIds.isEmpty {
                 selectedGamesSummary
+
+                // Date Range Section - shown when games are selected
+                dateRangeSection
             }
         }
         .padding(Theme.Spacing.lg)
         .background(Theme.cardBackground(colorScheme))
+        .onChange(of: selectedGameIds) { _, newValue in
+            Task {
+                await updateDateRangeForSelectedGames()
+            }
+        }
         .clipShape(RoundedRectangle(cornerRadius: Theme.CornerRadius.large))
         .overlay {
             RoundedRectangle(cornerRadius: Theme.CornerRadius.large)
@@ -221,6 +231,93 @@ struct GamePickerStep: View {
             summaryGames = Array(Set(games))
         }
     }
+
+    // MARK: - Date Range Section
+
+    private var dateRangeSection: some View {
+        VStack(alignment: .leading, spacing: Theme.Spacing.sm) {
+            HStack {
+                Image(systemName: "calendar")
+                    .foregroundStyle(Theme.warmOrange)
+                Text("Trip Date Range")
+                    .font(.subheadline)
+                    .fontWeight(.medium)
+                    .foregroundStyle(Theme.textPrimary(colorScheme))
+
+                Spacer()
+
+                // Show auto-calculated indicator
+                Text("Auto-adjusted")
+                    .font(.caption2)
+                    .foregroundStyle(Theme.textMuted(colorScheme))
+                    .padding(.horizontal, 8)
+                    .padding(.vertical, 4)
+                    .background(Theme.cardBackgroundElevated(colorScheme))
+                    .clipShape(Capsule())
+            }
+
+            DateRangePicker(startDate: $startDate, endDate: $endDate)
+
+            // Game date markers legend
+            if !summaryGames.isEmpty {
+                let selectedGamesWithDates = summaryGames.filter { selectedGameIds.contains($0.id) }
+                if !selectedGamesWithDates.isEmpty {
+                    VStack(alignment: .leading, spacing: 4) {
+                        Text("Game dates:")
+                            .font(.caption2)
+                            .foregroundStyle(Theme.textMuted(colorScheme))
+
+                        ForEach(selectedGamesWithDates.sorted { $0.game.dateTime < $1.game.dateTime }) { game in
+                            HStack(spacing: 6) {
+                                Circle()
+                                    .fill(game.game.sport.themeColor)
+                                    .frame(width: 6, height: 6)
+                                Text("\(game.matchupDescription) - \(game.game.dateTime, style: .date)")
+                                    .font(.caption2)
+                                    .foregroundStyle(Theme.textSecondary(colorScheme))
+                            }
+                        }
+                    }
+                    .padding(.top, Theme.Spacing.xs)
+                }
+            }
+        }
+        .padding(Theme.Spacing.md)
+        .background(Theme.cardBackgroundElevated(colorScheme))
+        .clipShape(RoundedRectangle(cornerRadius: Theme.CornerRadius.medium))
+    }
+
+    /// Updates the date range based on selected games
+    /// - Single game: 7-day span centered on game (position 4 of 7, so game is day 4)
+    /// - Multiple games: range from earliest to latest with 1-day buffer
+    private func updateDateRangeForSelectedGames() async {
+        let selectedGames = summaryGames.filter { selectedGameIds.contains($0.id) }
+
+        guard !selectedGames.isEmpty else { return }
+
+        let gameDates = selectedGames.map { $0.game.dateTime }.sorted()
+        let calendar = Calendar.current
+
+        await MainActor.run {
+            if gameDates.count == 1 {
+                // Single game: 7-day span centered on game
+                // Position 4 of 7 means: 3 days before, game day, 3 days after
+                let gameDate = gameDates[0]
+                let newStart = calendar.date(byAdding: .day, value: -3, to: gameDate) ?? gameDate
+                let newEnd = calendar.date(byAdding: .day, value: 3, to: gameDate) ?? gameDate
+                startDate = calendar.startOfDay(for: newStart)
+                endDate = calendar.startOfDay(for: newEnd)
+            } else {
+                // Multiple games: span from first to last with 1-day buffer
+                let firstGameDate = gameDates.first!
+                let lastGameDate = gameDates.last!
+                let newStart = calendar.date(byAdding: .day, value: -1, to: firstGameDate) ?? firstGameDate
+                let newEnd = calendar.date(byAdding: .day, value: 1, to: lastGameDate) ?? lastGameDate
+                startDate = calendar.startOfDay(for: newStart)
+                endDate = calendar.startOfDay(for: newEnd)
+            }
+        }
+    }
 }
 
 // MARK: - Sports Picker Sheet
@@ -265,6 +362,7 @@ private struct SportsPickerSheet: View {
                             }
                         }
                         .padding(.vertical, Theme.Spacing.xs)
+                        .contentShape(Rectangle())
                     }
                     .buttonStyle(.plain)
                 }
@@ -362,6 +460,7 @@ private struct TeamsPickerSheet: View {
                                     }
                                 }
                                 .padding(.vertical, Theme.Spacing.xs)
+                                .contentShape(Rectangle())
                             }
                             .buttonStyle(.plain)
                         }
@@ -465,6 +564,7 @@ private struct GamesPickerSheet: View {
                                             }
                                         }
                                         .padding(.vertical, Theme.Spacing.xs)
+                                        .contentShape(Rectangle())
                                     }
                                     .buttonStyle(.plain)
                                 }
@@ -517,7 +617,9 @@ private struct GamesPickerSheet: View {
     GamePickerStep(
         selectedSports: .constant([.mlb]),
         selectedTeamIds: .constant([]),
-        selectedGameIds: .constant([])
+        selectedGameIds: .constant([]),
+        startDate: .constant(Date()),
+        endDate: .constant(Date().addingTimeInterval(86400 * 7))
     )
     .padding()
     .themedBackground()