Alerts tab: disable option rows when their setting is off

FuelBoard/AlertsView.swift

@@ -145,18 +145,64 @@ struct AlertsView: View {
         )
     }
 
+    /// The radius currently selected, in the user's unit — shown by the disabled
+    /// row in place of the picker.
+    private var alertRadiusValueLabel: String {
+        switch alertChoice.wrappedValue {
+        case .followSearch:
+            return String(format: String(localized: "Follow search (%@)", comment: "Follow current station search distance option"), searchInUnitLabel)
+        case .fixed(let value):
+            return String(format: String(localized: "%lld %@", comment: "Distance label"), value, distanceUnit.label(for: Double(value)))
+        }
+    }
+
+    private var laDistanceValueLabel: String {
+        switch laChoice.wrappedValue {
+        case .followSearch:
+            return String(format: String(localized: "Follow search (%@)", comment: "Follow current station search distance option"), searchInUnitLabel)
+        case .fixed(let miles):
+            return distanceLabel(forMiles: miles)
+        }
+    }
+
+    /// An option row that belongs to a toggle. When the toggle is off the control
+    /// is replaced by a dimmed, static value row: `.disabled` is not enough here
+    /// because an inline-style picker in a List still expands its options when
+    /// tapped while disabled.
+    @ViewBuilder
+    private func optionRow<Content: View>(_ title: String,
+                                          value: String,
+                                          isEnabled: Bool,
+                                          @ViewBuilder picker: () -> Content) -> some View {
+        if isEnabled {
+            picker()
+        } else {
+            HStack {
+                Text(title)
+                Spacer()
+                Text(value)
+            }
+            .foregroundStyle(.tertiary)
+        }
+    }
+
     var body: some View {
         NavigationStack {
             List {
                 Section {
                     Toggle(String(localized: "Cheapest favourite", comment: "Favourite price-drop alert toggle"), isOn: $favouriteDropEnabled)
+                    optionRow(String(localized: "Fuel", comment: "Fuel picker title"),
+                              value: favouriteDropFuel.displayName,
+                              isEnabled: favouriteDropEnabled) {
                         Picker(String(localized: "Fuel", comment: "Fuel picker title"), selection: $favouriteDropFuel) {
                             ForEach(FuelType.allCases) { fuel in
                                 Text(fuel.displayName).tag(fuel)
                             }
                         }
+                    }
                     Button(String(localized: "Check now", comment: "Manual favourite price-drop check button"), action: onCheckFavouriteDropNow)
                         .disabled(!favouriteDropEnabled)
+                        .allowsHitTesting(favouriteDropEnabled)
                     Text(String(localized: "Get notified when a different favourite becomes the cheapest, or your cheapest favourite drops in price.", comment: "Favourite price alerts section description"))
                         .font(.footnote)
                         .foregroundStyle(.secondary)
@@ -166,11 +212,15 @@ struct AlertsView: View {
 
                 Section {
                     Toggle(String(localized: "Cheapest station", comment: "Proximity alert toggle"), isOn: $enabled)
+                    optionRow(String(localized: "Alert type", comment: "Proximity alert type picker title"),
+                              value: alertMode.displayName,
+                              isEnabled: enabled) {
                         Picker(String(localized: "Alert type", comment: "Proximity alert type picker title"), selection: $alertMode) {
                             ForEach(AlertMode.allCases.filter { mode in mode != .bestValue || bestValueConfigured }) { mode in
                                 Text(mode.displayName).tag(mode)
                             }
                         }
+                    }
                     if !bestValueConfigured {
                         Text(String(localized: "Set up Best Value first so Best Value alerts can account for your fill size, MPG and travel cost.", comment: "Best Value alert unavailable hint"))
                             .font(.footnote)
@@ -188,17 +238,25 @@ struct AlertsView: View {
                             .font(.footnote)
                             .foregroundStyle(.secondary)
                     }
+                    optionRow(String(localized: "Fuel", comment: "Fuel picker title"),
+                              value: fuel.displayName,
+                              isEnabled: enabled) {
                         Picker(String(localized: "Fuel", comment: "Fuel picker title"), selection: $fuel) {
                             ForEach(FuelType.allCases) { fuel in
                                 Text(fuel.displayName).tag(fuel)
                             }
                         }
+                    }
+                    optionRow(String(localized: "Radius", comment: "Alert radius picker title"),
+                              value: alertRadiusValueLabel,
+                              isEnabled: enabled) {
                         Picker(String(localized: "Radius", comment: "Alert radius picker title"), selection: alertChoice) {
                             Text(String(format: String(localized: "Follow search (%@)", comment: "Follow current station search distance option"), searchInUnitLabel)).tag(AlertRadiusChoice.followSearch)
                             ForEach(FuelStore.alertRadiusOptions, id: \.self) { value in
                                 Text(String(format: String(localized: "%lld %@", comment: "Distance label"), value, distanceUnit.label(for: Double(value)))).tag(AlertRadiusChoice.fixed(value))
                             }
                         }
+                    }
                     Text(alertRadiusDescription)
                         .font(.footnote)
                         .foregroundStyle(.secondary)
@@ -223,17 +281,25 @@ struct AlertsView: View {
 
                 Section {
                     Toggle(String(localized: "Cheapest station", comment: "Live Activity toggle"), isOn: $liveActivityEnabled)
+                    optionRow(String(localized: "Fuel", comment: "Fuel picker title"),
+                              value: liveActivityFuel.displayName,
+                              isEnabled: liveActivityEnabled) {
                         Picker(String(localized: "Fuel", comment: "Fuel picker title"), selection: $liveActivityFuel) {
                             ForEach(FuelType.allCases) { fuel in
                                 Text(fuel.displayName).tag(fuel)
                             }
                         }
+                    }
+                    optionRow(String(localized: "Distance", comment: "Distance picker title"),
+                              value: laDistanceValueLabel,
+                              isEnabled: liveActivityEnabled) {
                         Picker(String(localized: "Distance", comment: "Distance picker title"), selection: laChoice) {
                             Text(String(format: String(localized: "Follow search (%@)", comment: "Follow current station search distance option"), searchInUnitLabel)).tag(LADistanceChoice.followSearch)
                             ForEach(FuelStore.stationRadiusOptions, id: \.self) { miles in
                                 Text(distanceLabel(forMiles: miles)).tag(LADistanceChoice.fixed(miles))
                             }
                         }
+                    }
                     if liveActivityFollowsSearch {
                         Text(String(localized: "Uses the same distance as your station search.", comment: "Live Activity distance description, follow search"))
                             .font(.footnote)