feat: v0.1.0 — scaffold + MapLibre map with EU airports

app/api/airports/route.ts

@@ -0,0 +1,5 @@
+import { airportsHandler } from '@/lib/airports';
+
+export async function GET() {
+  return airportsHandler();
+}

app/api/mlworker/[file]/route.ts

@@ -0,0 +1,20 @@
+import { promises as fs } from 'node:fs';
+import path from 'node:path';
+
+// Serves maplibre-gl dist files (worker + its relative imports) straight from
+// node_modules so they always match the installed version. MapLibre cannot derive
+// working URLs for these when bundled by Turbopack/webpack, and the worker script
+// uses a relative import ("./maplibre-gl-shared.mjs") that must resolve against
+// this same prefix.
+export async function GET(_req: Request, ctx: { params: Promise<{ file: string }> }) {
+  const { file } = await ctx.params;
+  if (!/^[\w.-]+\.mjs$/.test(file)) return new Response('not found', { status: 404 });
+  try {
+    const body = await fs.readFile(
+      path.join(process.cwd(), 'node_modules', 'maplibre-gl', 'dist', file),
+    );
+    return new Response(body, { headers: { 'content-type': 'text/javascript' } });
+  } catch {
+    return new Response('not found', { status: 404 });
+  }
+}

app/globals.css

@@ -0,0 +1,49 @@
+* {
+  box-sizing: border-box;
+}
+
+html,
+body {
+  margin: 0;
+  height: 100%;
+  font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
+}
+
+.map-wrap {
+  position: relative;
+  width: 100%;
+  height: 100%;
+}
+
+/* Higher specificity than maplibre-gl.css's .maplibregl-map{position:relative},
+   which MapLibre adds to the same element and would otherwise win on sheet order. */
+.map-wrap .map-container {
+  position: absolute;
+  inset: 0;
+}
+
+.app-header {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 10;
+  display: flex;
+  align-items: baseline;
+  gap: 12px;
+  padding: 8px 14px;
+  background: rgba(15, 23, 42, 0.75);
+  color: #f8fafc;
+  backdrop-filter: blur(4px);
+}
+
+.app-header h1 {
+  margin: 0;
+  font-size: 16px;
+  font-weight: 600;
+}
+
+[data-testid='airport-count'] {
+  font-size: 12px;
+  color: #cbd5e1;
+}

app/layout.tsx

@@ -0,0 +1,15 @@
+import type { Metadata } from 'next';
+import './globals.css';
+
+export const metadata: Metadata = {
+  title: 'Flight Ops',
+  description: 'Run a small airplane transport company in Europe.',
+};
+
+export default function RootLayout({ children }: { children: React.ReactNode }) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  );
+}

app/page.tsx

@@ -0,0 +1,9 @@
+'use client';
+
+import dynamic from 'next/dynamic';
+
+const Map = dynamic(() => import('@/components/Map'), { ssr: false });
+
+export default function Home() {
+  return <Map />;
+}