fix(auth): resolve MFA post-activation login failures — tickets #38 #40 #41

#41 (critical): Replace plain Error throws in authorize() with CredentialsSignin
subclasses (MfaRequiredError / MfaRequiredSetupError / InvalidTotpError).
Auth.js v5 forwards CredentialsSignin.code to the client via SignInResponse.code;
plain throws become CallbackRouteError and the message is never visible.
Signin page now checks result.code ?? result.error for exact code matching.

#38: MfaPromptBanner converted to fully client-side component via
trpc.user.getMfaStatus.useQuery() — disappears immediately after MFA enable
without requiring page reload. Snooze key remains userId-scoped via useSession().
Server-side prisma.user.findUnique call removed from (app)/layout.tsx.

#40: NEXTAUTH_URL default fallback removed from docker-compose.yml.
The variable is now required (:?) — docker compose up fails with a descriptive
error if the value is missing, preventing silent localhost redirect bugs.

Tests: auth.test.ts (5), MfaPromptBanner.test.ts (7), reset-password.test.ts (6)
All new tests green. pnpm --filter @capakraken/web exec tsc --noEmit clean.

Co-Authored-By: claude-flow <ruv@ruv.net>
This commit is contained in:
2026-04-02 00:20:47 +02:00
parent 435c871e1f
commit e5ecea81c5
8 changed files with 341 additions and 459 deletions
+1 -13
View File
@@ -1,5 +1,4 @@
import { redirect } from "next/navigation";
import { prisma } from "@capakraken/db";
import { AppShell } from "~/components/layout/AppShell.js";
import { MfaPromptBanner } from "~/components/security/MfaPromptBanner.js";
import { auth } from "~/server/auth.js";
@@ -15,21 +14,10 @@ export default async function AppLayout({ children }: { children: React.ReactNod
const sessionUser = session.user as { id?: string; email?: string; role?: string } | undefined;
const userRole = sessionUser?.role ?? "USER";
const userId = sessionUser?.id;
// Show MFA prompt banner for privileged roles that haven't enabled TOTP yet
let showMfaPrompt = false;
if (userId && MFA_PROMPT_ROLES.has(userRole)) {
const user = await prisma.user.findUnique({
where: { id: userId },
select: { totpEnabled: true },
});
showMfaPrompt = user != null && !user.totpEnabled;
}
return (
<AppShell userRole={userRole}>
{showMfaPrompt && userId && <MfaPromptBanner userId={userId} />}
{MFA_PROMPT_ROLES.has(userRole) && <MfaPromptBanner />}
{children}
</AppShell>
);
+10 -9
View File
@@ -27,30 +27,31 @@ export default function SignInPage() {
});
if (result?.error) {
// Auth.js wraps authorize() errors in the error field
if (result.error.includes("MFA_REQUIRED_SETUP")) {
// Auth.js v5: CredentialsSignin subclasses forward their `code` via
// SignInResponse.code (and sometimes also as result.error).
// Check both fields for compatibility across beta versions.
const code = result.code ?? result.error;
if (code === "MFA_REQUIRED_SETUP") {
// User's role requires MFA but it hasn't been set up yet — redirect to setup
setLoading(false);
router.push("/account/security?mfa_required=1");
return;
}
if (result.error.includes("MFA_REQUIRED")) {
if (code === "MFA_REQUIRED") {
setMfaRequired(true);
setLoading(false);
// Focus the TOTP input after render
setTimeout(() => totpInputRef.current?.focus(), 100);
return;
}
if (result.error.includes("INVALID_TOTP")) {
if (code === "INVALID_TOTP") {
setError("Invalid verification code. Please try again.");
setTotp("");
setLoading(false);
return;
}
if (result.error.includes("Too many login attempts")) {
setError("Too many login attempts. Please try again later.");
} else {
setError("Invalid email or password");
}
setError("Invalid email or password");
// Reset MFA state on credential error
if (mfaRequired) {
setMfaRequired(false);