fuelboard/FuelBoard/FuelSavingsViews.swift

import SwiftUI

struct FuelSavingsAdjustmentView: View {
    @Binding var amount: FuelSavingsFillAmount

    @State private var unitChangeNotice: String?

    private var range: ClosedRange<Double> {
        FuelSavingsCalculator.fillAmountSliderRange(for: amount.unit)
    }

    private var step: Double {
        FuelSavingsCalculator.fillAmountSliderStep(for: amount.unit)
    }

    /// Read-out of the figure the slider is on. Deliberately NOT a text field:
    /// a typed figure could sit outside the slider's own bounds, leaving the
    /// control and the value it claimed to show disagreeing. Slider-only means
    /// what you see is the figure the estimate actually uses.
    private var valueText: String {
        switch amount.unit {
        case .pounds: return String(format: "£%.0f", amount.value)
        case .litres: return String(format: "%.0f L", amount.value)
        }
    }

    var body: some View {
        VStack(alignment: .leading, spacing: 10) {
            Text("How much are you filling up?")
                .font(.subheadline.weight(.semibold))
            Picker("Fill-up unit", selection: unitBinding) {
                ForEach(FuelSavingsFillUnit.allCases) { unit in
                    Text(unit.displayName).tag(unit)
                }
            }
            .pickerStyle(.segmented)
            HStack {
                Slider(value: sliderBinding, in: range, step: step)
                    .accessibilityLabel("Fill-up amount")
                    .accessibilityValue(valueText)
                Text(valueText)
                    .monospacedDigit()
                    .frame(width: 72, alignment: .trailing)
            }
            Text("Changes the estimate for this session only — your Settings default stays unchanged.")
                .font(.caption2)
                .foregroundStyle(.secondary)
            Text("£ compares the litres your budget buys at each station; Litres compares one fixed quantity.")
                .font(.caption2)
                .foregroundStyle(.secondary)
            if let unitChangeNotice {
                Text(unitChangeNotice)
                    .font(.caption2)
                    .foregroundStyle(.orange)
            }
        }
    }

    private var unitBinding: Binding<FuelSavingsFillUnit> {
        Binding(
            get: { amount.unit },
            set: { newUnit in
                guard newUnit != amount.unit else { return }
                // No one litre figure equals a budget at every candidate price.
                // A unit change starts a new, explicitly labelled comparison.
                amount = FuelSavingsCalculator.newComparisonAmount(afterSwitching: amount, to: newUnit)
                unitChangeNotice = "New comparison basis — adjust the \(newUnit.displayName) amount to your intended fill-up."
            }
        )
    }

    private var sliderBinding: Binding<Double> {
        Binding(
            get: { min(max(amount.value, range.lowerBound), range.upperBound) },
            set: { amount.value = min(max($0, range.lowerBound), range.upperBound) }
        )
    }
}

/// The colour-coded verdict capsule shared by the station listing rows, the
/// detail sheet and the compact summary.
///
/// An HStack with an explicit spacing, NOT a Label: given the width to spare,
/// a Label lays its icon and title out across the row and leaves a visible gap
/// between them (22pt in the listing row), which read as the text having
/// drifted away from its symbol. The icon is decorative here — the verdict is
/// in the text — so VoiceOver reads the capsule as one phrase.
struct FuelSavingsCapsule: View {
    let result: FuelSavingsResult
    var compact: Bool = true

    var body: some View {
        HStack(spacing: compact ? 3 : 5) {
            Image(systemName: Self.symbol(for: result.status))
                .accessibilityHidden(true)
            Text(result.capsuleHeadline())
                .lineLimit(1)
                // Measured on a 393pt screen: the capsule is handed ~101pt, of
                // which the icon, its spacing and the 8pt padding either side
                // take 32pt, leaving ~69pt for the text. "Closest station" needs
                // ~90pt at full size, so a 0.8 floor — 72pt — could not reach it
                // and the row showed "Closest stati…" instead. 0.7 leaves ~63pt,
                // which clears it at ~10pt type: scaled, never truncated.
                .minimumScaleFactor(0.7)
        }
        .font(compact ? .caption.weight(.semibold) : .headline)
        .foregroundStyle(Self.color(for: result.status))
        .padding(.horizontal, compact ? 8 : 12)
        .padding(.vertical, compact ? 4 : 7)
        .background(Capsule().fill(Self.color(for: result.status).opacity(0.15)))
    }

    /// Verdict colour: green save, red worse off, grey break even, blue
    /// baseline — the same green/amber/red family the price dot already uses.
    static func color(for status: FuelSavingsStatus) -> Color {
        switch status {
        case .worthTheDrive: return .green
        case .notWorthTheDrive: return .red
        case .breakEven: return .secondary
        case .baseline: return .blue
        }
    }

    static func symbol(for status: FuelSavingsStatus) -> String {
        switch status {
        case .worthTheDrive: return "checkmark.circle.fill"
        case .breakEven: return "equal.circle.fill"
        case .notWorthTheDrive: return "xmark.circle.fill"
        case .baseline: return "location.circle.fill"
        }
    }
}