bitstream/fuel-price
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: empty results state and validation error display on homepage

Browse Source
This commit is contained in:
Ovidiu U
2026-04-11 18:48:25 +01:00
parent 276f9bf612
commit 5fe9f9dc6d
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
resources/js/views/Home.vue
View File

@@ -108,13 +108,19 @@
<!-- Error -->
<div v-else-if="error" class="flex items-center gap-3 p-4 bg-white border border-zinc-300 rounded-xl text-status-bad">
<iconify-icon icon="lucide:circle-alert" style="font-size:1.25rem"></iconify-icon>
<span class="font-medium">{{ error.general?.[0] ?? 'Unable to load stations. Please try again.' }}</span>
<span class="font-medium">{{ Object.values(error).flat()[0] ?? 'Unable to load stations. Please try again.' }}</span>
</div>
<!-- Results -->
<template v-else>
<LeafletMap :stations="stations" :default-open="true" />
<StationList :stations="stations" :current-sort="sort" @sort="onSort" />
<div v-if="!stations.length" class="flex items-center gap-3 p-4 bg-white border border-zinc-300 rounded-xl text-zinc-500">
<iconify-icon icon="lucide:map-pin-off" style="font-size:1.25rem"></iconify-icon>
<span class="font-medium">No stations found near you. Try a different postcode or increase the radius.</span>
</div>
<template v-else>
<LeafletMap :stations="stations" :default-open="true" />
<StationList :stations="stations" :current-sort="sort" @sort="onSort" />
</template>
</template>
</div>