// ScrollJob v2 — Two-factor authentication // Appended to v2-auth.jsx via separate file so we don't risk breaking the // existing sign-in / sign-up exports. Both screens reuse V2AuthShell so // responsive behaviour matches V2SignInScreen. // 6-digit OTP code input row — auto-advance-vibe via successive filled cells. function OTPRow({ filled = 0 }) { return (
{Array.from({ length: 6 }).map((_, i) => { const isFilled = i < filled; const isActive = i === filled; return (
{isFilled ? ['8', '1', '2', '4', '0', ''][i] : isActive ? : ''}
); })}
); } function CaretBlink() { return ( ); } function VerifiedPulse() { return ( ); } // ─── A) 2FA SETUP ─────────────────────────────────────────────────────── function V2TwoFactorSetupScreen() { // Reuses V2AuthShell from v2-auth.jsx (already on window). return ( {/* QR code box */}
Ready to scan
{/* Monospace fallback code chip */}
JBSWY3DPEHPK3PXP

Scan with Google Authenticator, Authy, or 1Password. Then enter the 6-digit code below.

Verify & enable ); } // Right-hand panel content for 2FA setup — overrides V2AuthBenefits when // shown alongside V2TwoFactorSetupScreen. Because V2AuthShell hard-codes // V2AuthBenefits on the right, we wrap the screen in a second variant that // renders our two cards inline using a parallel layout container. function V2TwoFactorSetupScreenWithBackup() { return (
Need help? Contact us
{/* Left — setup form */}

Set up two-factor authentication

Add an extra layer of security to your sign-in.

Ready to scan
JBSWY3DPEHPK3PXP

Scan with Google Authenticator, Authy, or 1Password. Then enter the 6-digit code below.

Verify & enable
{/* Right — Why card only */}

Why turn it on?

    {[ 'Stops password reuse attacks', 'Required for employers managing >£1k of boost credits', 'Use any standard authenticator app — Google, Authy, 1Password', ].map((t) => (
  • {t}
    • ))}
); } // ─── B) 2FA CHALLENGE ─────────────────────────────────────────────────── function V2TwoFactorChallengeScreen() { return (

Enter your code

We sent a code via your authenticator app.

{/* 30-second countdown bar */}
18s
Verify

Lost access? Contact support

); } // Inline QR-code art — a stylised 25×25 grid that reads as a QR code at a // glance without us actually encoding anything. Deterministic pseudo-random // pattern with the three corner finder squares correctly placed. function QRCodeArt({ size = 196 }) { const N = 25; const cell = size / N; // Pre-baked deterministic bit pattern (mirrors a real-ish QR density) const pattern = (x, y) => ((x * 31 + y * 17 + (x ^ y)) & 7) > 3; const corners = (x, y) => ( (x < 7 && y < 7) || (x >= N - 7 && y < 7) || (x < 7 && y >= N - 7) ); const inFinder = (x, y, ox, oy) => { const dx = x - ox, dy = y - oy; return (dx >= 0 && dx < 7 && dy >= 0 && dy < 7); }; const finderFill = (x, y, ox, oy) => { const dx = x - ox, dy = y - oy; const ring = dx === 0 || dx === 6 || dy === 0 || dy === 6; const center = dx >= 2 && dx <= 4 && dy >= 2 && dy <= 4; return ring || center; }; const finders = [[0, 0], [N - 7, 0], [0, N - 7]]; const cells = []; for (let y = 0; y < N; y++) { for (let x = 0; x < N; x++) { let filled = false; let inAnyFinder = false; for (const [ox, oy] of finders) { if (inFinder(x, y, ox, oy)) { inAnyFinder = true; filled = finderFill(x, y, ox, oy); break; } } if (!inAnyFinder) filled = pattern(x, y); if (filled) cells.push(); } } return ( ); } Object.assign(window, { V2TwoFactorSetupScreen: V2TwoFactorSetupScreenWithBackup, V2TwoFactorChallengeScreen, });