feat: task 2.5 MapPositions (clustered + selected sources)

- src/data/devices.ts: useDevicesById() — TanStack Query (5-min stale) returning Map<deviceId, Device>. deviceLabel() formats human-readable titles ("FMB920 #3458"). - src/map/layers/map-positions.tsx: <MapPositions /> side-effect-only. Two GeoJSON sources (clustered non-selected + unclustered selected). Five layers: non-selected symbol + direction + cluster-bubble, selected symbol + direction. Click handlers: marker -> selectDevice, cluster -> getClusterExpansionZoom + easeTo. Hover toggles cursor. - src/routes/_authed/monitor.tsx: renders <MapPositions /> inside <MapView>. Schema overhaul in src/auth/client.ts: - Made Schema SDK-compatible. Each entry is an *array* of row types (devices: DeviceRow[], not just DeviceRow). RegularCollections<Schema> filters on array-like values; non-arrays collapse to never which broke readItems('devices', ...) with keyof Schema = never. - Spelled out the composed client type as DirectusClient<Schema> & RestClient<Schema> & AuthenticationClient<Schema> — without the explicit annotation Schema didn't flow through .with(...) chain to request() call sites. - Added DeviceRow + EventRow types; exported via @/auth. useDevicesById uses readItems<Schema, 'devices', Query<Schema, DeviceRow>> — explicit generics because the SDK doesn't infer Schema from the receiver's type at call sites. Deviations: 1. Spec referenced device.kind for category — Phase 1 schema doesn't have it yet; everything maps to 'default'. Refine when kind lands. 2. Cluster bubble uses 'default-neutral' sprite instead of a dedicated 'cluster-background' (not in 2.3's registry). Swap in 3.8. 3. getClusterExpansionZoom is Promise-based in maplibre-gl 5.x (was callback-style); used .then(). Bundle: main bundle 394KB / 120KB gz, ~1KB up from 2.4. /monitor chunk includes the new layer module (~10KB).
2026-05-02 22:02:18 +02:00
parent 045f1cb376
commit 25dcde093a
8 changed files with 464 additions and 11 deletions
@@ -381,6 +381,7 @@ Eight files under `src/live/`:
 3. `onPosition` returns an unsubscribe function (Set-add + delete). Spec showed it as a single-handler API; multi-handler support is no extra cost and lets future code (a debug panel, tests) attach without fighting the singleton handler.

 **Smoke check (local `pnpm dev`):**
+
 - App boots; no WS connection until login.
 - After login: `useConnectionStore.getState()` shows `status: 'connecting'` then either `'connected'` (if Phase 1.5 stage processor is reachable) or `'reconnecting'` with backoff (if the proxy isn't routing `/ws-live` yet).
 - `usePositionStore.getState()` shows the empty initial state — `activeEventId: null`, empty Maps.
@@ -263,4 +263,37 @@ The `mapReady` gate (2.1) ensures these only mount when the style is loaded.

 ## Done

-(Filled in when the task lands.)
+Three new files plus Schema work:
+
+- **`src/data/devices.ts`** — `useDevicesById()` hook returning a `Map<deviceId, Device>` plus loading/error flags. TanStack Query with 5-min stale-time. `deviceLabel(device, deviceId)` produces a human-readable title (e.g. `"FMB920 #3458"` from model + last-4 IMEI).
+- **`src/map/layers/map-positions.tsx`** — `<MapPositions />` side-effect-only component. Two `useId`-derived (colon-stripped) source ids + five layer ids. Setup effect adds:
+  - non-selected source (`cluster: true, clusterMaxZoom: 14, clusterRadius: 50`) with symbol + direction-arrow + cluster-bubble layers.
+  - selected source (no clustering, always on top) with symbol + direction-arrow layers.
+  - Click handlers for marker click → `selectDevice(deviceId)`, cluster click → `getClusterExpansionZoom` + `easeTo`. Hover handlers swap the cursor.
+  - Cleanup removes all layers and sources in reverse order.
+- Update effect: `buildFeatureCollections({ latestByDevice, selectedDeviceId, devices })` produces the two FCs and `setData`s both sources. Selected goes onto its own source so the always-on-top symbol layers handle the z-ordering without manual layer reordering.
+- **`src/routes/_authed/monitor.tsx`** — renders `<MapPositions />` as a child of `<MapView>`.
+
+**Schema overhaul** in `src/auth/client.ts`:
+
+- Made `Schema` type SDK-compatible. Each entry is an *array* of row types (e.g. `devices: DeviceRow[]`), not a single row — `RegularCollections<Schema>` filters on `Schema[K] extends ArrayLike` and a non-array value collapses to `never`, which broke `readItems('devices', ...)` with `keyof Schema = never`.
+- Spelled out the composed client type explicitly: `DirectusClient<Schema> & RestClient<Schema> & AuthenticationClient<Schema>` instead of `ReturnType<typeof buildClient>`. Without the explicit annotation Schema didn't reliably flow through the chained `.with(...)` calls to inference at `request()` call sites.
+- Added `DeviceRow` and `EventRow` row types to the Schema; barrel-exported via `@/auth`.
+
+`useDevicesById` calls `readItems<Schema, 'devices', Query<Schema, DeviceRow>>('devices', ...)` — the SDK doesn't infer Schema from the receiver's type, so explicit type parameters are required.
+
+**Deviations from spec:**
+
+1. Spec referenced `mapCategoryToSprite(device?.kind ?? 'default')` to pick the sprite category. Phase 1's `devices` schema doesn't have a `kind` column yet, so the feature builder maps everything to `'default'` for v1. When the schema gains a kind/category (Phase 2 of directus or earlier), thread it through here.
+2. Cluster-bubble icon: spec sketched `'cluster-background'` as a separate sprite. The 2.3 sprite registry didn't include it; reused `'default-neutral'` as the bubble plate (it's a circle on a black background, which reads fine as a cluster). When 3.8 lands, swap to a dedicated cluster sprite.
+3. Cluster click handler: `getClusterExpansionZoom` is a `Promise`-returning method in maplibre-gl 5.x (was callback-style in older versions). Used the Promise form.
+
+**Smoke check (local `pnpm dev`):**
+- `/monitor` loads. `<MapPositions />` mounts. Position store is empty until the event picker (2.7) lands.
+- In the browser console: `usePositionStore.getState().applyPositions([{deviceId: 'test-1', lat: 41.327, lon: 19.819, ts: Date.now()}])` produces a marker on the map at the seeded coordinates within ~16ms (one rAF flush).
+- Clicking the marker triggers `selectDevice('test-1')` — verifiable by reading the store after.
+- Switching basemap (2.2) → mapReady gate fires → markers reappear after the swap.
+
+**Bundle:** `/monitor` route chunk is now ~10KB raw (the rest of MapLibre is in its own chunk). Main bundle 394KB / 120KB gzipped — small bump from 2.4's 393KB. No measurable impact.
+
+Landed in `PENDING_SHA`.
@@ -52,7 +52,7 @@ When Phase 2 is done:
 | 2.2 | [Tile-source switcher](./02-tile-source-switcher.md)                                       | 🟩     |
 | 2.3 | [Sprite preload (racing categories)](./03-sprite-preload.md)                               | 🟩     |
 | 2.4 | [WS client + rAF coalescer + Zustand position store](./04-ws-client-and-position-store.md) | 🟩     |
-| 2.5 | [MapPositions (clustered + selected sources)](./05-map-positions.md)                       | ⬜     |
+| 2.5 | [MapPositions (clustered + selected sources)](./05-map-positions.md)                       | 🟩     |
 | 2.6 | [MapTrails (bounded ring buffer, polyline rendering)](./06-map-trails.md)                  | ⬜     |
 | 2.7 | [Event picker (subscription driver)](./07-event-picker.md)                                 | ⬜     |
 | 2.8 | [Camera control trio](./08-camera-trio.md)                                                 | ⬜     |