@usequark/quark-create-app 1.25.5 → 1.25.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@usequark/quark-create-app",
-  "version": "1.25.5",
+  "version": "1.25.6",
   "description": "CLI to scaffold new Quark projects with Next.js, Prisma, BullMQ, and Railway deployment",
   "keywords": [
     "quark",

package/templates/base-project/apps/web/src/app/api/csrf/route.js

@@ -6,21 +6,32 @@
 
 import { generateCsrfToken } from "@usequark/quark-core";
 import { NextResponse } from "next/server";
-import { auth } from "@/lib/auth";
 import { getCsrfCookieOptions } from "@/lib/csrf-cookie";
 
+/**
+ * Headers applied to every response.
+ *
+ * `no-store` is load-bearing, not hygiene. The body of this response *is* a
+ * write credential: paired with the cookie it sets, it authorises the holder's
+ * next mutating request. A shared cache that stored it could hand the token to
+ * a second caller, who would then be able to write as the first — so this
+ * response must never be cached, by the browser or anything between it and the
+ * client. `Vary: Cookie` keeps that true for a cache that keys on request
+ * headers rather than obeying `no-store` outright.
+ */
+const NO_STORE_HEADERS = {
+	"Cache-Control": "no-store, no-cache, must-revalidate",
+	Vary: "Cookie",
+};
+
 export async function GET(request) {
 	try {
-		const session = await auth();
-
-		if (!session) {
-			return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
-		}
-
-		// Generate CSRF token
 		const csrfToken = generateCsrfToken();
 
-		const response = NextResponse.json({ csrfToken });
+		const response = NextResponse.json(
+			{ csrfToken },
+			{ headers: NO_STORE_HEADERS },
+		);
 
 		// Store the token in a secure HTTP-only cookie so the server can
 		// validate it on subsequent state-changing requests.
@@ -34,7 +45,7 @@ export async function GET(request) {
 	} catch (_error) {
 		return NextResponse.json(
 			{ error: "Failed to generate CSRF token" },
-			{ status: 500 },
+			{ status: 500, headers: NO_STORE_HEADERS },
 		);
 	}
 }

package/templates/base-project/apps/web/src/app/auth/register/RegisterPageClient.js

@@ -1,5 +1,6 @@
 "use client";
 
+import { clearCsrfToken, getCsrfToken } from "@usequark/quark-core/csrf-client";
 import {
 	Button,
 	ErrorBanner,
@@ -98,16 +99,55 @@ function RegisterForm() {
 		setPasswordError("");
 		setLoading(true);
 
-		const res = await fetch("/api/auth/register", {
+		// The CSRF token has to be in hand before the write. `GET /api/csrf` sets
+		// the matching httpOnly cookie and returns the same value; the server
+		// compares the two, so a request that arrives without the cookie is
+		// rejected before the handler runs. This page is pre-authentication, which
+		// is why the endpoint mints tokens for callers with no session.
+		//
+		// Both the token fetch and the write can fail on the network, and this
+		// handler has already set `loading`. Without a catch, either one would
+		// leave the button spinning forever.
+		try {
+			const res = await postRegistration(await getCsrfToken());
+
+			// The cache refetches on a timer, which covers expiry. It cannot cover
+			// the server rotating the cookie underneath us — a sign-out, or anything
+			// else that clears cookies — and that surfaces as a rejected write with
+			// nothing visibly wrong. Drop the stale token and try once more; a
+			// second failure is a real failure and falls through to the banner.
+			if (res.status === 401) {
+				clearCsrfToken();
+				return await completeRegistration(
+					await postRegistration(await getCsrfToken()),
+				);
+			}
+
+			return await completeRegistration(res);
+		} catch {
+			setError("Could not reach the server. Try again.");
+			setLoading(false);
+		}
+	}
+
+	/** POST the form to /api/auth/register with the given token. */
+	async function postRegistration(csrfToken) {
+		return await fetch("/api/auth/register", {
 			method: "POST",
-			headers: { "Content-Type": "application/json" },
+			headers: {
+				"Content-Type": "application/json",
+				"X-CSRF-Token": csrfToken,
+			},
 			body: JSON.stringify({
 				email: email.trim(),
 				password,
 				name: name.trim() || undefined,
 			}),
 		});
+	}
 
+	/** Surface a failure, or sign the new account in. */
+	async function completeRegistration(res) {
 		if (!res.ok) {
 			const body = await res.json().catch(() => ({}));
 			setError(body.message || "Registration failed. Try again.");