Add live transmitter position (status) alongside logged points

devices/<serial>/log messages now carry a "type": "log" or "status".
"log" persists a LocatePoint as before; "status" carries the same
position + telemetry shape but is broadcast live over the job's
realtime channel without touching locate_points — it's a current-
position update, not a recorded point.

The job map renders the latest status as a blue "you are here" marker
(with a soft accuracy-radius halo) that moves in place as new updates
arrive, separate from the colored polyline of logged points. Clicking
it shows the same detail readout as a logged point.

The simulator gained a message-type toggle (Log point / Status
update) so both paths can be exercised from /sim.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
ulhub
2026-07-15 14:52:53 +00:00
parent e91c91e037
commit 8c5de40c5d
8 changed files with 230 additions and 32 deletions

View File

@@ -1,11 +1,18 @@
import { useEffect, useRef } from 'react';
import type { MapPoint } from '../components/map/types';
import type { LiveStatus, MapPoint } from '../components/map/types';
// Subscribes to live points for a job over the backend WebSocket.
// Reconnects with capped exponential backoff; resubscribes on reconnect.
export function useJobStream(jobId: string | null, onPoints: (points: MapPoint[]) => void) {
const handlerRef = useRef(onPoints);
handlerRef.current = onPoints;
// Subscribes to live points + live position status for a job over the
// backend WebSocket. Reconnects with capped exponential backoff; resubscribes
// on reconnect.
export function useJobStream(
jobId: string | null,
onPoints: (points: MapPoint[]) => void,
onStatus?: (status: LiveStatus) => void,
) {
const pointsRef = useRef(onPoints);
pointsRef.current = onPoints;
const statusRef = useRef(onStatus);
statusRef.current = onStatus;
useEffect(() => {
if (!jobId) {
@@ -29,8 +36,13 @@ export function useJobStream(jobId: string | null, onPoints: (points: MapPoint[]
socket.onmessage = (event) => {
try {
const msg = JSON.parse(event.data);
if (msg.type === 'points' && msg.jobId === jobId) {
handlerRef.current(msg.points);
if (msg.jobId !== jobId) {
return;
}
if (msg.type === 'points') {
pointsRef.current(msg.points);
} else if (msg.type === 'status') {
statusRef.current?.(msg as LiveStatus);
}
} catch {
// ignore malformed frames