fix: handle DecryptException during 2FA and fix setup key copy button (#219) (#223)

- Catch DecryptException on two-factor-challenge route and redirect to
  login with a helpful error message instead of showing a 500 error
- Replace custom navigator.clipboard copy logic with Mary UI x-clipboard
  directive for the manual setup key (fixes copy on non-HTTPS contexts)

Author: David Courtey

bootstrap/app.php

@@ -55,5 +55,11 @@
         ]);
     })
     ->withExceptions(function (Exceptions $exceptions) {
-        //
+        $exceptions->renderable(function (\Illuminate\Contracts\Encryption\DecryptException $e, $request) {
+            if ($request->is('two-factor-challenge')) {
+                return redirect()->route('login')->withErrors([
+                    'email' => __('Your session or encryption key has changed. Please log in again. If this persists, your APP_KEY may have changed since two-factor authentication was set up.'),
+                ]);
+            }
+        });
     })->create();

resources/views/livewire/settings/two-factor.blade.php

@@ -123,43 +123,25 @@ class="btn-primary w-full"
                 <div class="space-y-4">
                     <div class="divider text-sm">{{ __('or, enter the code manually') }}</div>
 
-                    <div
-                        class="flex items-center space-x-2"
-                        x-data="{
-                            copied: false,
-                            async copy() {
-                                try {
-                                    await navigator.clipboard.writeText('{{ $manualSetupKey }}');
-                                    this.copied = true;
-                                    setTimeout(() => this.copied = false, 1500);
-                                } catch (e) {
-                                    console.warn('Could not copy to clipboard');
-                                }
-                            }
-                        }"
-                    >
-                        <div class="flex items-stretch w-full border rounded-xl border-base-300">
-                            @empty($manualSetupKey)
-                                <div class="flex items-center justify-center w-full p-3 bg-base-200">
-                                    <span class="loading loading-spinner loading-sm"></span>
-                                </div>
-                            @else
-                                <input
-                                    type="text"
-                                    readonly
-                                    value="{{ $manualSetupKey }}"
-                                    class="input input-bordered w-full border-0"
-                                />
-
-                                <button
-                                    @click="copy()"
-                                    class="btn btn-ghost px-3"
-                                >
-                                    <x-icon x-show="!copied" name="o-document-duplicate" class="w-5 h-5" />
-                                    <x-icon x-show="copied" name="o-check" class="w-5 h-5 text-success" />
-                                </button>
-                            @endempty
-                        </div>
+                    <div class="flex items-stretch w-full border rounded-xl border-base-300">
+                        @empty($manualSetupKey)
+                            <div class="flex items-center justify-center w-full p-3 bg-base-200">
+                                <span class="loading loading-spinner loading-sm"></span>
+                            </div>
+                        @else
+                            <input
+                                type="text"
+                                readonly
+                                value="{{ $manualSetupKey }}"
+                                class="input input-bordered w-full border-0"
+                            />
+
+                            <x-button
+                                icon="o-clipboard-document"
+                                class="btn-ghost px-3"
+                                x-clipboard="$wire.manualSetupKey"
+                            />
+                        @endempty
                     </div>
                 </div>
             @endif

tests/Feature/Auth/AuthenticationTest.php

@@ -92,6 +92,35 @@
     $this->assertGuest();
 });
 
+test('two factor challenge with invalid encryption key redirects to login', function () {
+    if (! Features::canManageTwoFactorAuthentication()) {
+        $this->markTestSkipped('Two-factor authentication is not enabled.');
+    }
+
+    Features::twoFactorAuthentication([
+        'confirm' => true,
+        'confirmPassword' => true,
+    ]);
+
+    $user = User::factory()->create();
+
+    // Login to trigger 2FA challenge
+    $this->post(route('login.store'), [
+        'email' => $user->email,
+        'password' => 'password',
+    ]);
+
+    // Corrupt the two_factor_secret to simulate an APP_KEY change
+    $user->update(['two_factor_secret' => 'corrupted-encrypted-value']);
+
+    $response = $this->post(route('two-factor.login.store'), [
+        'code' => '123456',
+    ]);
+
+    $response->assertRedirect(route('login'));
+    $response->assertSessionHasErrors('email');
+});
+
 test('login screen renders oauth provider button when enabled', function (string $provider, string $label) {
     User::factory()->create();