fixing the 2fa codes from regenerating before submitted

Author: tnylea

app/Actions/TwoFactorAuth/GenerateQrCodeAndSecretKey.php

@@ -20,30 +20,34 @@ class GenerateQrCodeAndSecretKey
      */
     public function __invoke($user): array
     {
-
-        $google2fa = new Google2FA;
-        $secret_key = $google2fa->generateSecretKey();
-
-        $this->companyName = 'Auth';
-        if (is_string(config('app.name'))) {
-            $this->companyName = config('app.name');
-        }
-
+        // Create a new Google2FA instance with explicit configuration
+        $google2fa = new Google2FA();
+        $google2fa->setOneTimePasswordLength(6);
+        
+        // Generate a standard 16-character secret key
+        $secret_key = $google2fa->generateSecretKey(16);
+        
+        // Set company name from config
+        $this->companyName = config('app.name', 'Laravel');
+        
+        // Generate the QR code URL
         $g2faUrl = $google2fa->getQRCodeUrl(
             $this->companyName,
-            (string) $user->email,
+            $user->email,
             $secret_key
         );
-
+        
+        // Create the QR code image
         $writer = new Writer(
             new ImageRenderer(
-                new RendererStyle(800),
+                new RendererStyle(400),
                 new SvgImageBackEnd()
             )
         );
-
+        
+        // Generate the QR code as a base64 encoded SVG
         $qrcode_image = base64_encode($writer->writeString($g2faUrl));
-
+        
         return [$qrcode_image, $secret_key];
 
     }

app/Actions/TwoFactorAuth/VerifyTwoFactorCode.php

@@ -15,7 +15,18 @@ class VerifyTwoFactorCode
      */
     public function __invoke(string $secret, string $code): bool
     {
+        // Clean the code (remove spaces and non-numeric characters)
+        $code = preg_replace('/[^0-9]/', '', $code);
+        
+        // Create a new Google2FA instance with explicit configuration
         $google2fa = new Google2FA();
-        return $google2fa->verifyKey($secret, $code);
+        $google2fa->setWindow(8); // Allow for some time drift
+        $google2fa->setOneTimePasswordLength(6); // Ensure 6-digit codes
+        
+        try {
+            return $google2fa->verify($code, $secret);
+        } catch (\Exception $e) {
+            return false;
+        }
     }
 }

app/Http/Controllers/Settings/TwoFactorAuthController.php

@@ -22,11 +22,12 @@ class TwoFactorAuthController extends Controller
      */
     public function edit(Request $request)
     {
-        $recoveryCodes = $request->user()->two_factor_secret ? json_decode(decrypt($request->user()->two_factor_recovery_codes)) : [];
+
+        
         return Inertia::render('settings/two-factor', [
-            'enabled' => !empty($request->user()->two_factor_secret),
-            'qrCode' => $request->user()->two_factor_secret ? true : false,
-            'recoveryCodes' => $recoveryCodes,
+            'enabled' => !is_null($request->user()->two_factor_secret),
+            'confirmed' => !is_null($request->user()->two_factor_confirmed_at),
+            'recoveryCodes' => $request->user()->two_factor_secret ? json_decode(decrypt($request->user()->two_factor_recovery_codes)) : [],
         ]);
     }
 
@@ -82,17 +83,21 @@ public function disable(Request $request)
     public function confirm(Request $request)
     {
         $request->validate([
-            'code' => 'required|string|min:6',
+            'code' => 'required|string',
         ]);
 
+        // Get the secret key from the user's record
         $secret = decrypt($request->user()->two_factor_secret);
+        
+        // Verify the code
         $valid = app(VerifyTwoFactorCode::class)($secret, $request->code);
 
         if ($valid) {
             app(ConfirmTwoFactorAuthentication::class)($request->user());
             return back()->with('status', 'two-factor-authentication-confirmed');
         }
 
+
         return back()->withErrors(['code' => 'The provided two-factor authentication code was invalid.']);
     }
 
@@ -107,9 +112,29 @@ public function qrCode(Request $request)
         if (empty($request->user()->two_factor_secret)) {
             return response('', 404);
         }
-
-        [$qrCode, $secret] = app(GenerateQrCodeAndSecretKey::class)($request->user());
-
+        
+        // Get the existing secret key instead of generating a new one
+        $secret = decrypt($request->user()->two_factor_secret);
+        
+        // Generate QR code based on the existing secret
+        $google2fa = new \PragmaRX\Google2FA\Google2FA();
+        $companyName = config('app.name', 'Laravel');
+        
+        $g2faUrl = $google2fa->getQRCodeUrl(
+            $companyName,
+            $request->user()->email,
+            $secret
+        );
+        
+        $writer = new \BaconQrCode\Writer(
+            new \BaconQrCode\Renderer\ImageRenderer(
+                new \BaconQrCode\Renderer\RendererStyle\RendererStyle(400),
+                new \BaconQrCode\Renderer\Image\SvgImageBackEnd()
+            )
+        );
+        
+        $qrCode = base64_encode($writer->writeString($g2faUrl));
+        
         return response()->json([
             'svg' => $qrCode,
             'secret' => $secret

resources/js/pages/settings/two-factor.tsx

@@ -24,13 +24,14 @@ const breadcrumbs: BreadcrumbItem[] = [
 
 interface TwoFactorProps {
     enabled: boolean;
+    confirmed: boolean;
     qrCode: boolean;
     recoveryCodes: string[];
 }
 
-export default function TwoFactor({ enabled: initialEnabled, qrCode, recoveryCodes }: TwoFactorProps) {
+export default function TwoFactor({ enabled: initialEnabled, confirmed: initialConfirmed, qrCode, recoveryCodes }: TwoFactorProps) {
     const [enabled, setEnabled] = useState(initialEnabled);
-    const [confirmed, setConfirmed] = useState(initialEnabled);
+    const [confirmed, setConfirmed] = useState(initialConfirmed);
     const [showModal, setShowModal] = useState(false);
     const [verifyStep, setVerifyStep] = useState(false);
     const [qrCodeSvg, setQrCodeSvg] = useState('');
@@ -54,6 +55,7 @@ export default function TwoFactor({ enabled: initialEnabled, qrCode, recoveryCod
             post(route('two-factor.enable'), {
                 preserveScroll: true,
                 onSuccess: async () => {
+                    // Only set enabled to true, but not confirmed yet
                     setEnabled(true);
                     const response = await fetch(route('two-factor.qr-code'));
                     const data = await response.json();
@@ -78,6 +80,12 @@ export default function TwoFactor({ enabled: initialEnabled, qrCode, recoveryCod
             return;
         }
 
+        // Make sure the code is properly formatted (no spaces, exactly 6 digits)
+        const formattedCode = data.code.replace(/\s+/g, '').trim();
+        
+        // Set the formatted code back to the form data
+        setData('code', formattedCode);
+        
         post(route('two-factor.confirm'), {
             preserveScroll: true,
             onSuccess: () => {