Add consistent API request logging and a themed 404 page, bump to 0.4.0

Every app/api route handler now goes through withRouteLogging, which logs
a correlated reqId/method/path/status/duration for each request and turns
any uncaught error into a logged stack trace plus a clean JSON 500 instead
of Next's default opaque failure. proxy.ts logs rejected auth attempts, and
instrumentation.ts's onRequestError catches anything that still escapes a
route handler. Also adds a minimal not-found page matching the app's card
styling.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

app/api/stats/devices/route.ts

@@ -1,9 +1,10 @@
 import { NextResponse } from "next/server";
 import { getDeviceCommandCounts, getDeviceUsageStats } from "@/lib/db/queries/stats";
+import { withRouteLogging } from "@/lib/api/with-route-logging";
 
-export async function GET() {
+export const GET = withRouteLogging("stats.devices", async () => {
   const [usage, commandCounts] = await Promise.all([getDeviceUsageStats(), getDeviceCommandCounts()]);
   const commandCountByDevice = new Map(commandCounts.map((c) => [c.deviceId, c.commandCount]));
   const devices = usage.map((d) => ({ ...d, commandCount: commandCountByDevice.get(d.deviceId) ?? 0 }));
   return NextResponse.json({ devices });
-}
+});

app/api/stats/recordings/route.ts

@@ -1,7 +1,8 @@
 import { NextResponse } from "next/server";
 import { getRecordingLibraryStats } from "@/lib/db/queries/stats";
+import { withRouteLogging } from "@/lib/api/with-route-logging";
 
-export async function GET() {
+export const GET = withRouteLogging("stats.recordings", async () => {
   const stats = await getRecordingLibraryStats();
   return NextResponse.json(stats);
-}
+});

app/api/stats/sessions/[id]/timeline/route.ts

@@ -1,9 +1,13 @@
 import { NextResponse } from "next/server";
 import { getSessionTimeline } from "@/lib/db/queries/stats";
+import { withRouteLogging } from "@/lib/api/with-route-logging";
 
-export async function GET(req: Request, { params }: { params: Promise<{ id: string }> }) {
-  const { id } = await params;
-  const bucketMs = Number(new URL(req.url).searchParams.get("bucketMs") ?? 1000);
-  const timeline = await getSessionTimeline(Number(id), bucketMs);
-  return NextResponse.json({ timeline });
-}
+export const GET = withRouteLogging(
+  "stats.session-timeline",
+  async (req: Request, { params }: { params: Promise<{ id: string }> }) => {
+    const { id } = await params;
+    const bucketMs = Number(new URL(req.url).searchParams.get("bucketMs") ?? 1000);
+    const timeline = await getSessionTimeline(Number(id), bucketMs);
+    return NextResponse.json({ timeline });
+  },
+);

app/api/stats/sessions/route.ts

@@ -1,7 +1,8 @@
 import { NextResponse } from "next/server";
 import { getSessionsSummary } from "@/lib/db/queries/stats";
+import { withRouteLogging } from "@/lib/api/with-route-logging";
 
-export async function GET() {
+export const GET = withRouteLogging("stats.sessions", async () => {
   const summary = await getSessionsSummary();
   return NextResponse.json(summary);
-}
+});