feat: v0.15.0 — ISS-002 hovering a plane or package in the side panels highlights it on the map

components/LeftPane.tsx

@@ -5,6 +5,7 @@ import type { PlaneState, StateSnapshot } from '@/lib/game/state';
 import { PLANE_TYPES } from '@/lib/game/catalog';
 import { formatCash, formatFuel, formatSimClock } from '@/lib/format';
 import { TIME_SCALES, scaleToSlider, sliderToScale } from '@/lib/timeScale';
+import type { HoverTarget } from './hoverTypes';
 
 interface LeftPaneProps {
   state: StateSnapshot | null;
@@ -12,6 +13,8 @@ interface LeftPaneProps {
   error: string | null;
   // The shell's single-poll refresh — called after a sim-control POST so the pane updates immediately.
   onRefresh: () => void;
+  // ISS-002 (v0.15.0): report fleet-row hovers to the shell so the map can highlight the plane.
+  onHover: (target: HoverTarget | null) => void;
 }
 
 // Discrete ladder slider (v0.9.2, values reworked in v0.14.0): position t ∈ [0,1] → nearest
@@ -42,7 +45,7 @@ export function pendingScaleConfirmed(pendingScale: number | null, serverTimeSca
   return pendingScale !== null && serverTimeScale === pendingScale;
 }
 
-export default function LeftPane({ state, loading, error, onRefresh }: LeftPaneProps) {
+export default function LeftPane({ state, loading, error, onRefresh, onHover }: LeftPaneProps) {
   const [busy, setBusy] = useState(false);
 
   // POST /api/sim, then refetch the full snapshot immediately so the pane reflects the new
@@ -189,7 +192,14 @@ export default function LeftPane({ state, loading, error, onRefresh }: LeftPaneP
             ) : (
               <ul data-testid="fleet-list" className="fleet-list">
                 {state.planes.map((p) => (
-                  <li key={p.id} data-testid={`plane-${p.id}`} className="plane-row">
+                  // ISS-002: hovering a fleet row highlights the plane on the map.
+                  <li
+                    key={p.id}
+                    data-testid={`plane-${p.id}`}
+                    className="plane-row"
+                    onMouseEnter={() => onHover({ kind: 'plane', id: p.id })}
+                    onMouseLeave={() => onHover(null)}
+                  >
                     <div className="plane-main">
                       <span className="plane-model">{PLANE_TYPES[p.model]?.name ?? p.model}</span>
                       <span className={`plane-status status-${p.status}`}>{p.status}</span>