feat: extract fuel.map component and wire Leaflet to map-update browser event

app/Livewire/Public/Fuel/Map.php

@@ -0,0 +1,21 @@
+<?php
+
+namespace App\Livewire\Public\Fuel;
+
+use Illuminate\View\View;
+use Livewire\Attributes\On;
+use Livewire\Component;
+
+final class Map extends Component
+{
+    #[On('stations-found')]
+    public function handle(array $results, array $meta, int $radius = 5, ?array $prediction = null): void
+    {
+        $this->dispatch('map-update', results: $results, meta: $meta, radius: $radius);
+    }
+
+    public function render(): View
+    {
+        return view('livewire.public.fuel.map');
+    }
+}

resources/js/maps/station-map.js

@@ -65,11 +65,13 @@ export function stationMap(results, meta, radius) {
                 maxZoom: 19,
             }).addTo(this._map);
 
-            if (this.results && this.results.length > 0) {
+            window.addEventListener('map-update', (e) => {
+                this.results = e.detail.results;
+                this.meta    = e.detail.meta;
+                this.radius  = e.detail.radius;
                 this._plotMarkers();
-            }
+            });
 
-            this.$watch('results', () => this._plotMarkers());
             this.locateUser();
         },
 

resources/views/components/fuel/station-map.blade.php

@@ -1,6 +1,4 @@
-@props(['results' => []])
-
 <div
-    x-data="stationMap(@entangle('results'), @entangle('meta'), @entangle('radius'))"
+    x-data="stationMap([], {}, 5)"
-    class="h-56 w-full overflow-hidden border-y border-[#e5ded7] md:h-96"
+    class="h-56 w-full overflow-hidden border-y border-border md:h-96"
 ></div>

resources/views/livewire/public/fuel/map.blade.php

@@ -0,0 +1,3 @@
+<div class="mb-4" wire:ignore>
+    <x-fuel.station-map />
+</div>

tests/Feature/Livewire/Fuel/MapTest.php

@@ -0,0 +1,33 @@
+<?php
+
+use App\Livewire\Public\Fuel\Map;
+use Livewire\Livewire;
+
+it('renders the map component', function () {
+    Livewire::test(Map::class)
+        ->assertStatus(200);
+});
+
+it('dispatches map-update browser event when stations-found is received', function () {
+    Livewire::test(Map::class)
+        ->dispatch('stations-found',
+            results: [['name' => 'BP Garage']],
+            meta: ['lat' => 51.5, 'lng' => -0.1, 'count' => 1],
+            radius: 5,
+            prediction: null
+        )
+        ->assertDispatched('map-update');
+});
+
+it('passes radius in map-update payload', function () {
+    Livewire::test(Map::class)
+        ->dispatch('stations-found',
+            results: [],
+            meta: ['lat' => 51.5, 'lng' => -0.1, 'count' => 0],
+            radius: 10,
+            prediction: null
+        )
+        ->assertDispatched('map-update', fn ($event, $params) =>
+            $params['radius'] === 10
+        );
+});