feat: v0.3.1 — show app version in header (sourced from package.json)

components/Map.tsx

@@ -3,6 +3,7 @@
 import { useEffect, useRef, useState } from 'react';
 import * as maplibregl from 'maplibre-gl';
 import 'maplibre-gl/dist/maplibre-gl.css';
+import pkg from '../package.json';
 
 const EUROPE_CENTER: [number, number] = [10, 52];
 const INITIAL_ZOOM = 4;
@@ -93,6 +94,7 @@ export default function Map() {
     <div className="map-wrap">
       <header data-testid="app-header" className="app-header">
         <h1>Flight Ops</h1>
+        <small>v{pkg.version}</small>
         <span data-testid="airport-count">
           {airportCount === null ? 'loading airports…' : `${airportCount} EU airports`}
         </span>

components/version.test.ts

@@ -0,0 +1,16 @@
+import { readFileSync } from 'node:fs';
+import pkg from '../package.json';
+import { describe, expect, it } from 'vitest';
+
+const mapSource = readFileSync(new URL('./Map.tsx', import.meta.url), 'utf8');
+
+describe('app version display', () => {
+  it('package.json carries a valid semver version (single source of truth)', () => {
+    expect(pkg.version).toMatch(/^\d+\.\d+\.\d+$/);
+  });
+
+  it('the header sources the version from package.json instead of hardcoding it', () => {
+    expect(mapSource).toContain("from '../package.json'");
+    expect(mapSource).toContain('v{pkg.version}');
+  });
+});