From 4faf7191e0069b4c7128463a8e3039f16d2c489d Mon Sep 17 00:00:00 2001
From: Venelin Kochev <venelinkochev@gmail.com>
Date: Fri, 24 Apr 2026 19:57:57 +0300
Subject: [PATCH] Manage send-test loading with Alpine

Add an Alpine "sending" state and switch the send-test button from Livewire loading directives to Alpine handlers. The button now sets sending=true, calls $wire.sendTest(...).finally(() => sending=false), and is disabled via x-bind while sending. Loading/sent UI toggles were converted from wire:loading/wire:target to x-show and the existing notifications-test-sent window event remains for the queued message. This provides immediate client-side feedback and prevents duplicate clicks during the test-send operation.
---
 .../views/livewire/settings/notifications.blade.php   | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/resources/views/livewire/settings/notifications.blade.php b/resources/views/livewire/settings/notifications.blade.php
index 596779a..99eaf75 100644
--- a/resources/views/livewire/settings/notifications.blade.php
+++ b/resources/views/livewire/settings/notifications.blade.php
@@ -46,19 +46,18 @@ class="btn btn-ghost btn-sm">
                                     @endif
 
                                     @if ($channel->is_active && $channel->isConfigured())
-                                        <div x-data="{ sent: false }"
+                                        <div x-data="{ sent: false, sending: false }"
                                              x-on:notifications-test-sent.window="if ($event.detail.channelId === {{ $channel->id }}) { sent = true; setTimeout(() => sent = false, 2500); }"
                                              class="flex items-center gap-2">
                                             <span x-show="sent" x-transition.opacity class="text-sm text-success" style="display:none">
                                                 {{ __('Test queued') }}
                                             </span>
                                             <button type="button"
-                                                    wire:click="sendTest({{ $channel->id }})"
-                                                    wire:loading.attr="disabled"
-                                                    wire:target="sendTest({{ $channel->id }})"
+                                                    x-on:click="sending = true; $wire.sendTest({{ $channel->id }}).finally(() => sending = false)"
+                                                    x-bind:disabled="sending"
                                                     class="btn btn-outline btn-sm">
-                                                <span wire:loading.remove wire:target="sendTest({{ $channel->id }})">{{ __('Send test') }}</span>
-                                                <span wire:loading wire:target="sendTest({{ $channel->id }})">{{ __('Sending…') }}</span>
+                                                <span x-show="! sending">{{ __('Send test') }}</span>
+                                                <span x-show="sending" style="display:none">{{ __('Sending…') }}</span>
                                             </button>
                                         </div>
                                     @endif