watch: fix snapshot sync and polish favourites UX

This commit is contained in:
FuelBoard Contributor
2026-08-31 07:48:20 +01:00
parent 486b8cff2e
commit 7a84364238
3 changed files with 132 additions and 76 deletions
+127 -70
View File
@@ -1,5 +1,6 @@
import SwiftUI
import Foundation
import WatchKit
private enum WatchFuelType: String, CaseIterable, Identifiable, Codable {
case e10
@@ -102,6 +103,8 @@ private struct WatchFavouriteRow: Identifiable {
let priceText: String
let distanceText: String?
let isCheapest: Bool
let latitude: Double
let longitude: Double
}
private enum WatchRefreshState {
@@ -283,14 +286,30 @@ struct ContentView: View {
@State private var distanceUnit: WatchDistanceUnit = WatchFuelCache.loadDistanceUnit()
@State private var priceStyle: WatchPriceStyle = WatchFuelCache.loadPriceStyle()
private var displayedFuels: [WatchFuelType] {
let fuels = Set(favourites.map(\.fuel))
let sorted = fuels.sorted { $0.sortRank < $1.sortRank }
return sorted.isEmpty ? [fuel] : sorted
}
private var hasAnyFavourites: Bool {
!favourites.isEmpty
}
var body: some View {
TabView(selection: $fuel) {
ForEach(WatchFuelType.allCases) { fuelCase in
fuelPage(for: fuelCase)
.tag(fuelCase)
Group {
if hasAnyFavourites {
TabView(selection: $fuel) {
ForEach(displayedFuels) { fuelCase in
fuelPage(for: fuelCase)
.tag(fuelCase)
}
}
.tabViewStyle(.verticalPage)
} else {
emptyStateView
}
}
.tabViewStyle(.verticalPage)
.onAppear {
reloadFromCache()
WatchSyncManager.shared.requestSnapshot()
@@ -301,6 +320,7 @@ struct ContentView: View {
.onChange(of: scenePhase) { _, newPhase in
if newPhase == .active {
reloadFromCache()
WatchSyncManager.shared.requestSnapshot()
}
}
}
@@ -317,8 +337,6 @@ struct ContentView: View {
if let cheapest {
cheapestCard(for: fuelCase, favourite: cheapest)
} else {
emptyCheapestCard(for: fuelCase)
}
statusRow
@@ -340,14 +358,8 @@ struct ContentView: View {
Text("Favourites")
.font(.headline)
if rows.isEmpty {
Text("No favourites for \(fuelCase.displayName.lowercased()) yet.")
.font(.caption)
.foregroundStyle(.secondary)
} else {
ForEach(rows) { row in
favouriteRow(row, fuel: fuelCase)
}
ForEach(rows) { row in
favouriteRow(row, fuel: fuelCase)
}
}
}
@@ -372,7 +384,9 @@ struct ContentView: View {
name: favourite.station.name,
priceText: priceText,
distanceText: distanceText,
isCheapest: favourite.id == cheapest?.id
isCheapest: favourite.id == cheapest?.id,
latitude: favourite.station.lat,
longitude: favourite.station.lng
)
}
}
@@ -392,44 +406,76 @@ struct ContentView: View {
}
}
private func cheapestCard(for fuel: WatchFuelType, favourite: WatchFavouriteEntry) -> some View {
VStack(alignment: .leading, spacing: 6) {
Text("Cheapest favourite")
.font(.caption2)
.foregroundStyle(.secondary)
Text(favourite.station.name)
.font(.headline)
.lineLimit(2)
HStack(alignment: .firstTextBaseline) {
Text(favourite.station.prices[fuel].map { WatchFuelCache.priceText($0, style: priceStyle) } ?? "")
.font(.title3)
.fontWeight(.bold)
Spacer()
if let location = lastLocation {
Text(distanceUnit.format(km: favourite.station.distanceKM(to: location)))
private var emptyStateView: some View {
ScrollView {
VStack(alignment: .leading, spacing: 12) {
HStack(alignment: .center, spacing: 8) {
Image(systemName: "fuelpump.fill")
.foregroundStyle(Color(red: 48/255.0, green: 209/255.0, blue: 88/255.0))
Text("FuelBoard")
.font(.headline)
Spacer()
}
statusRow
Button {
runCheckNow()
} label: {
HStack {
Image(systemName: refreshState.icon)
Text("Check now")
.fontWeight(.semibold)
}
.frame(maxWidth: .infinity)
}
.buttonStyle(.borderedProminent)
.tint(Color(red: 48/255.0, green: 209/255.0, blue: 88/255.0))
VStack(alignment: .leading, spacing: 6) {
Text("No favourites yet")
.font(.headline)
Text("Add favourites on iPhone and theyll appear here.")
.font(.caption)
.foregroundStyle(.secondary)
}
.padding(10)
.frame(maxWidth: .infinity, alignment: .leading)
.background(Color.white.opacity(0.06), in: RoundedRectangle(cornerRadius: 14, style: .continuous))
}
.padding(.horizontal, 10)
.padding(.vertical, 12)
}
.padding(10)
.frame(maxWidth: .infinity, alignment: .leading)
.background(fuel.color.opacity(0.15), in: RoundedRectangle(cornerRadius: 14, style: .continuous))
}
private func emptyCheapestCard(for fuel: WatchFuelType) -> some View {
VStack(alignment: .leading, spacing: 6) {
Text("Cheapest favourite")
.font(.caption2)
.foregroundStyle(.secondary)
Text("No favourite saved")
.font(.headline)
Text("Add favourites on iPhone to see them here.")
.font(.caption)
.foregroundStyle(.secondary)
private func cheapestCard(for fuel: WatchFuelType, favourite: WatchFavouriteEntry) -> some View {
Button {
openMaps(latitude: favourite.station.lat, longitude: favourite.station.lng)
} label: {
VStack(alignment: .leading, spacing: 6) {
Text("Cheapest favourite")
.font(.caption2)
.foregroundStyle(.secondary)
Text(favourite.station.name)
.font(.headline)
.lineLimit(2)
HStack(alignment: .firstTextBaseline) {
Text(favourite.station.prices[fuel].map { WatchFuelCache.priceText($0, style: priceStyle) } ?? "")
.font(.title3)
.fontWeight(.bold)
Spacer()
if let location = lastLocation {
Text(distanceUnit.format(km: favourite.station.distanceKM(to: location)))
.font(.caption)
.foregroundStyle(.secondary)
}
}
}
.padding(10)
.frame(maxWidth: .infinity, alignment: .leading)
.contentShape(RoundedRectangle(cornerRadius: 14, style: .continuous))
}
.padding(10)
.frame(maxWidth: .infinity, alignment: .leading)
.buttonStyle(.plain)
.background(fuel.color.opacity(0.15), in: RoundedRectangle(cornerRadius: 14, style: .continuous))
}
@@ -441,34 +487,40 @@ struct ContentView: View {
}
private func favouriteRow(_ favourite: WatchFavouriteRow, fuel: WatchFuelType) -> some View {
HStack(spacing: 8) {
VStack(alignment: .leading, spacing: 2) {
HStack(spacing: 4) {
Text(favourite.name)
.font(.caption)
.fontWeight(favourite.isCheapest ? .semibold : .regular)
.lineLimit(1)
if favourite.isCheapest {
Text("TOP")
.font(.system(size: 9, weight: .bold))
.padding(.horizontal, 4)
.padding(.vertical, 2)
.background(fuel.color.opacity(0.18), in: Capsule())
Button {
openMaps(latitude: favourite.latitude, longitude: favourite.longitude)
} label: {
HStack(spacing: 8) {
VStack(alignment: .leading, spacing: 2) {
HStack(spacing: 4) {
Text(favourite.name)
.font(.caption)
.fontWeight(favourite.isCheapest ? .semibold : .regular)
.lineLimit(1)
if favourite.isCheapest {
Text("TOP")
.font(.system(size: 9, weight: .bold))
.padding(.horizontal, 4)
.padding(.vertical, 2)
.background(fuel.color.opacity(0.18), in: Capsule())
}
}
if let distanceText = favourite.distanceText {
Text(distanceText)
.font(.caption2)
.foregroundStyle(.secondary)
}
}
if let distanceText = favourite.distanceText {
Text(distanceText)
.font(.caption2)
.foregroundStyle(.secondary)
}
Spacer()
Text(favourite.priceText)
.font(.callout.monospacedDigit())
.fontWeight(.semibold)
}
Spacer()
Text(favourite.priceText)
.font(.callout.monospacedDigit())
.fontWeight(.semibold)
.padding(.horizontal, 10)
.padding(.vertical, 8)
.contentShape(RoundedRectangle(cornerRadius: 12, style: .continuous))
}
.padding(.horizontal, 10)
.padding(.vertical, 8)
.buttonStyle(.plain)
.background(Color.white.opacity(0.06), in: RoundedRectangle(cornerRadius: 12, style: .continuous))
}
@@ -526,6 +578,11 @@ struct ContentView: View {
formatter.unitsStyle = .short
return formatter.localizedString(for: date, relativeTo: Date())
}
private func openMaps(latitude: Double, longitude: Double) {
guard let url = URL(string: "maps://?daddr=\(latitude),\(longitude)&t=d") else { return }
WKExtension.shared().openSystemURL(url)
}
}
#Preview {