fix(ui): show traffic analytics loading state on the button

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Andras Bacsai
2026-10-23 19:31:57 +02:00
co-authored by Claude Opus 5.5
parent 7de0e4cee8
commit 50243278fd
3 changed files with 9 additions and 11 deletions
@@ -44,6 +44,8 @@
$effectiveStep2ButtonText = ($skipPasswordConfirmation && $step2ButtonText === 'Continue') ? 'Confirm' : $step2ButtonText;
// Prefer a rich HTML button title when callers pass <x-slot:button-title> (ComponentSlot).
$resolvedButtonTitle = $buttonTitle instanceof ComponentSlot ? $buttonTitle : $buttonTitle;
// Show a loading state on the trigger button while the submit action runs (needs Livewire updates, so not with wire:ignore).
$triggerWireTarget = $ignoreWire || $dispatchAction ? '' : $submitAction;
@endphp
<div {{ $ignoreWire ? 'wire:ignore' : '' }} x-data="{
@@ -179,31 +181,31 @@
@endif
@elseif ($isErrorButton)
@if ($buttonFullWidth)
<x-forms.button class="w-full" isError @click="modalOpen=true">
<x-forms.button class="w-full" isError @click="modalOpen=true" wire:target="{{ $triggerWireTarget }}">
{{ $resolvedButtonTitle }}
</x-forms.button>
@else
<x-forms.button isError @click="modalOpen=true">
<x-forms.button isError @click="modalOpen=true" wire:target="{{ $triggerWireTarget }}">
{{ $resolvedButtonTitle }}
</x-forms.button>
@endif
@elseif($isHighlightedButton)
@if ($buttonFullWidth)
<x-forms.button @click="modalOpen=true" class="flex gap-2 w-full" isHighlighted wire:target>
<x-forms.button @click="modalOpen=true" class="flex gap-2 w-full" isHighlighted wire:target="{{ $triggerWireTarget }}">
{{ $resolvedButtonTitle }}
</x-forms.button>
@else
<x-forms.button @click="modalOpen=true" class="flex gap-2" isHighlighted wire:target>
<x-forms.button @click="modalOpen=true" class="flex gap-2" isHighlighted wire:target="{{ $triggerWireTarget }}">
{{ $resolvedButtonTitle }}
</x-forms.button>
@endif
@else
@if ($buttonFullWidth)
<x-forms.button @click="modalOpen=true" class="flex gap-2 w-full" wire:target>
<x-forms.button @click="modalOpen=true" class="flex gap-2 w-full" wire:target="{{ $triggerWireTarget }}">
{{ $resolvedButtonTitle }}
</x-forms.button>
@else
<x-forms.button @click="modalOpen=true" class="flex gap-2" wire:target>
<x-forms.button @click="modalOpen=true" class="flex gap-2" wire:target="{{ $triggerWireTarget }}">
{{ $resolvedButtonTitle }}
</x-forms.button>
@endif
@@ -10,8 +10,6 @@
<x-slot:actions>
@if ($isTrafficAnalyticsEnabled)
<div class="flex items-center gap-3">
<x-loading wire:loading.flex wire:target="toggleTrafficAnalytics"
text="Restarting Sentinel and proxy..." compact />
<x-modal-confirmation title="Disable traffic analytics?"
buttonTitle="Disable traffic analytics" submitAction="toggleTrafficAnalytics"
:actions="[
@@ -80,8 +78,6 @@
Enable traffic analytics
</x-forms.button>
@else
<x-loading wire:loading.flex wire:target="toggleTrafficAnalytics"
text="Restarting Sentinel and proxy..." compact />
<x-modal-confirmation title="Enable traffic analytics?"
buttonTitle="Enable traffic analytics" submitAction="toggleTrafficAnalytics"
:actions="[
@@ -56,7 +56,7 @@ it('warns about the application interruption before enabling traffic analytics',
Livewire::test(TrafficAnalyticsSettings::class, ['server' => $server])
->assertSee('Enable traffic analytics?')
->assertSee('Restarting Sentinel and proxy...')
->assertSeeHtml('wire:target="toggleTrafficAnalytics"')
->assertSee('Enabling traffic analytics will restart Sentinel and the proxy. Your applications will experience a brief interruption.');
});