Show leg distance in km on job list and on-board contracts (ISS-095, v0.48.0)

components/LeftPane.tsx

@@ -5,7 +5,7 @@ import type { GeoJsonFeatureCollection } from '@/lib/airports';
 import type { PlaneState, StateSnapshot } from '@/lib/game/state';
 import { PLANE_TYPES } from '@/lib/game/catalog';
 import { abandonPenalty } from '@/lib/game/penalty';
-import { formatCash, formatDeadlineRelative, formatFuel, formatSimClock, formatSpecialLabel } from '@/lib/format';
+import { formatCash, formatDeadlineRelative, formatFuel, formatKm, formatSimClock, formatSpecialLabel } from '@/lib/format';
 import { TIME_SCALES, scaleToSlider, sliderToScale } from '@/lib/timeScale';
 import { useGameAction } from '@/lib/useGameAction';
 import { useSimClock } from '@/lib/useSimClock';
@@ -441,6 +441,8 @@ export default function LeftPane({ state, loading, error, onRefresh, applySnapsh
                               <span data-testid={`onboard-route-${pkg.id}`} className="contract-route">
                                 {pkg.originIcao} → {pkg.destIcao}
                               </span>
+                              {/* v0.48.0 (ISS-095): leg distance after the route, e.g. "EGCC → GMME 554km". */}
+                              <span data-testid={`onboard-distance-${pkg.id}`}>{formatKm(pkg.distanceKm)}</span>
                               {/* v0.37.0 (ISS-073): special-status badge — rendered only when the package has one. */}
                               {pkg.special && (
                                 <span data-testid={`package-special-${pkg.id}`} className="special-badge">

components/RightPane.tsx

@@ -4,7 +4,7 @@ import { useState } from 'react';
 import type { PackageState, PlaneState, StateSnapshot } from '@/lib/game/state';
 import { MAX_PLANE_DISCOUNT, PLANE_DISCOUNT_PER_REP, PLANE_TYPES, repRate, SELL_FRACTION } from '@/lib/game/catalog';
 import { maxRangeKm } from '@/lib/sim/movement';
-import { formatCargo, formatCash, formatDeadlineRelative, formatSpecialLabel } from '@/lib/format';
+import { formatCargo, formatCash, formatDeadlineRelative, formatKm, formatSpecialLabel } from '@/lib/format';
 import { useGameAction } from '@/lib/useGameAction';
 import type { HoverTarget } from './hoverTypes';
 
@@ -234,6 +234,8 @@ export default function RightPane({ state, loading, applySnapshot, onHover, onEr
                   </div>
                   <div className="contract-sub">
                     <span data-testid={`open-package-reward-${pkg.id}`}>{formatCash(pkg.reward)}</span>
+                    {/* v0.48.0 (ISS-095): leg distance after the reward, e.g. "€37,408.00 215km". */}
+                    <span data-testid={`open-package-distance-${pkg.id}`}>{formatKm(pkg.distanceKm)}</span>
                     {/* ISS-066 (v0.35.0): cargo shows as type + tonnage ("Mail 10.0t"), not "type × count". */}
                     <span data-testid={`open-package-cargo-${pkg.id}`}>{formatCargo(pkg.cargoType, pkg.weightKg)}</span>
                     <span data-testid={`open-package-deadline-${pkg.id}`}>

components/right-pane.test.ts

@@ -42,6 +42,7 @@ function pkg(over: Partial<PackageState> & Pick<PackageState, 'id'>): PackageSta
     cargoCount: 4,
     weightKg: 1_000,
     special: null, // v0.37.0 (ISS-073) — no special status by default in fixtures
+    distanceKm: 1839, // v0.48.0 (ISS-095) — EDDF→LEMD great-circle distance
     deadlineSimTime: 1_000_000,
     status: 'open',
     planeId: null,