feat: add location-based search, redesign station cards, and implement URL state management
Some checks failed
linter / quality (push) Has been cancelled
tests / ci (8.3) (push) Has been cancelled
tests / ci (8.4) (push) Has been cancelled
tests / ci (8.5) (push) Has been cancelled

- Support geolocation search (lat/lng) as alternative to postcode with automatic fallback
- Redesign StationCard with expanded layout showing address, distance in miles, reliability status, directions link, and optional remove button
- Add directions integration with Google Maps including origin parameter support
- Persist search parameters (postcode/coords, fuel type, radius, sort) in URL query and hydrate on mount
- Implement compact map markers with inline directions link and click-to-zoom behavior
- Auto-trigger search when filters change (fuel type, radius, sort) if search already performed
- Add removable prop to StationCard for watchlist integration
- Display reliability status (Current/Stale/Outdated) with color-coded pricing
- Remove 2-mile radius option from search filters
This commit is contained in:
Ovidiu U
2026-04-20 15:51:02 +01:00
parent d29f3e6487
commit 7dc41ba9ee
5 changed files with 236 additions and 86 deletions

View File

@@ -34,6 +34,7 @@
v-for="station in reliable"
:key="station.station_id"
:lowest-price="lowestPrice"
:origin="origin"
:station="station"
/>
</section>
@@ -80,6 +81,7 @@
:key="station.station_id"
:station="station"
:lowest-price="lowestPrice"
:origin="origin"
/>
</div>
</div>
@@ -92,6 +94,7 @@ import StationCard from './StationCard.vue'
const props = defineProps({
stations: { type: Array, required: true },
currentSort: { type: String, default: 'reliable' },
origin: { type: Object, default: null },
})
const emit = defineEmits(['sort'])