milestone 9: react spa admin ui, frontend ci and embedded dist

web/src/lib/InlineError.tsx

@@ -0,0 +1,39 @@
+import { useEffect, useState } from "react";
+import { ApiError } from "@/lib/api";
+
+/** Inline mutation error per ruling 17: 400/409 messages verbatim, 429 with countdown. */
+export default function InlineError({ error }: { error: unknown }) {
+	const retryAfter = error instanceof ApiError && error.status === 429 ? (error.retryAfter ?? null) : null;
+	const [remaining, setRemaining] = useState<number | null>(retryAfter);
+
+	useEffect(() => {
+		setRemaining(retryAfter);
+		if (retryAfter === null) return;
+		const timer = setInterval(() => setRemaining((s) => (s === null || s <= 1 ? 0 : s - 1)), 1000);
+		return () => clearInterval(timer);
+	}, [error, retryAfter]);
+
+	if (error === null || error === undefined) return null;
+
+	let message: string;
+	if (error instanceof ApiError) {
+		if (error.status === 429) {
+			message =
+				remaining !== null && remaining > 0
+					? `Rate limited. Try again in ${remaining}s.`
+					: "Rate limited. Try again.";
+		} else if (error.status === 503) {
+			message = "The server is starting or degraded. Try again shortly.";
+		} else {
+			message = error.message;
+		}
+	} else {
+		message = "Could not reach the server.";
+	}
+
+	return (
+		<p role="alert" className="mt-2 text-sm text-red-600 dark:text-red-400">
+			{message}
+		</p>
+	);
+}