feat: add button loader

resources/views/components/primary-button.blade.php

@@ -1,3 +1,3 @@
-<button {{ $attributes->merge(['type' => 'submit', 'class' => 'inline-flex items-center justify-center px-4 py-2 bg-nexi-red border border-transparent rounded-md font-bold text-xs text-white tracking-widest focus:bg-nexi-red active:bg-nexi-green focus:outline-none focus:ring-2 focus:ring-nexi-red focus:ring-offset-2 transition ease-in-out duration-150']) }}>
+<button {{ $attributes->merge(['type' => 'submit', 'class' => 'inline-flex items-center justify-center px-4 py-2 bg-nexi-red border border-transparent rounded-md font-bold text-xs text-white tracking-widest focus:outline-none focus:ring-2 focus:ring-nexi-red focus:ring-offset-2 transition ease-in-out duration-150']) }}>
     {{ $slot }}
 </button>

resources/views/livewire/pages/auth/confirm-password.blade.php

@@ -1,62 +0,0 @@
-<?php
-
-use App\Providers\RouteServiceProvider;
-use Illuminate\Validation\ValidationException;
-use Livewire\Attributes\Layout;
-use Livewire\Attributes\Rule;
-use Livewire\Volt\Component;
-
-new #[Layout('layouts.guest')] class extends Component
-{
-    #[Rule(['required', 'string'])]
-    public string $password = '';
-
-    public function confirmPassword(): void
-    {
-        $this->validate();
-
-        if (! auth()->guard('web')->validate([
-            'email' => auth()->user()->email,
-            'password' => $this->password,
-        ])) {
-            throw ValidationException::withMessages([
-                'password' => __('auth.password'),
-            ]);
-        }
-
-        session(['auth.password_confirmed_at' => time()]);
-
-        $this->redirect(
-            session('url.intended', RouteServiceProvider::HOME),
-            navigate: true
-        );
-    }
-}; ?>
-
-<div class="w-full sm:max-w-md mt-6 px-6 py-4 overflow-hidden">
-    <div class="mb-4 text-sm text-gray-600 dark:text-gray-400">
-        {{ __('This is a secure area of the application. Please confirm your password before continuing.') }}
-    </div>
-
-    <form wire:submit="confirmPassword">
-        <!-- Password -->
-        <div>
-            <x-input-label for="password" :value="__('Password')" />
-
-            <x-text-input wire:model="password"
-                          id="password"
-                          class="block mt-1 w-full"
-                          type="password"
-                          name="password"
-                          required autocomplete="current-password" />
-
-            <x-input-error :messages="$errors->get('password')" class="mt-2" />
-        </div>
-
-        <div class="flex justify-end mt-4">
-            <x-primary-button>
-                {{ __('Confirm') }}
-            </x-primary-button>
-        </div>
-    </form>
-</div>

resources/views/livewire/pages/auth/forgot-password.blade.php

@@ -1,58 +0,0 @@
-<?php
-
-use Illuminate\Support\Facades\Password;
-use Livewire\Attributes\Layout;
-use Livewire\Attributes\Rule;
-use Livewire\Volt\Component;
-
-new #[Layout('layouts.guest')] class extends Component
-{
-    #[Rule(['required', 'string', 'email'])]
-    public string $email = '';
-
-    public function sendPasswordResetLink(): void
-    {
-        $this->validate();
-
-        // We will send the password reset link to this user. Once we have attempted
-        // to send the link, we will examine the response then see the message we
-        // need to show to the user. Finally, we'll send out a proper response.
-        $status = Password::sendResetLink(
-            $this->only('email')
-        );
-
-        if ($status != Password::RESET_LINK_SENT) {
-            $this->addError('email', __($status));
-
-            return;
-        }
-
-        $this->reset('email');
-
-        session()->flash('status', __($status));
-    }
-}; ?>
-
-<div class="w-full sm:max-w-md mt-6 px-6 py-4 overflow-hidden">
-    <div class="mb-4 text-sm text-gray-600 dark:text-gray-400">
-        {{ __('Forgot your password? No problem. Just let us know your email address and we will email you a password reset link that will allow you to choose a new one.') }}
-    </div>
-
-    <!-- Session Status -->
-    <x-auth-session-status class="mb-4" :status="session('status')" />
-
-    <form wire:submit="sendPasswordResetLink">
-        <!-- Email Address -->
-        <div>
-            <x-input-label for="email" :value="__('Email')" />
-            <x-text-input wire:model="email" id="email" class="block mt-1 w-full" type="email" name="email" required autofocus />
-            <x-input-error :messages="$errors->get('email')" class="mt-2" />
-        </div>
-
-        <div class="flex items-center justify-end mt-4">
-            <x-primary-button>
-                {{ __('Email Password Reset Link') }}
-            </x-primary-button>
-        </div>
-    </form>
-</div>

resources/views/livewire/pages/auth/login.blade.php

@@ -121,7 +121,7 @@ new #[Layout('layouts.guest')] class extends Component
                 </a>
             @endif
 
-            <x-primary-button class="ml-3">
+            <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50" class="ml-3">
                 {{ __('Log in') }}
             </x-primary-button>
         </div>

resources/views/livewire/pages/auth/reset-password.blade.php

@@ -90,7 +90,7 @@ new #[Layout('layouts.guest')] class extends Component
         </div>
 
         <div class="flex items-center justify-end mt-4">
-            <x-primary-button>
+            <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50">
                 {{ __('Reset Password') }}
             </x-primary-button>
         </div>

resources/views/livewire/pages/quote/list.blade.php

@@ -54,7 +54,7 @@ new #[Layout('layouts.guest')] class extends Component
                             <td class="relative w-8 pl-4 pr-3 text-sm sm:pl-6 border-t">
                                 <div class="flex flex-row space-x-2">
                                     <form wire:submit="request({{ $quote }})">
-                                        <x-primary-button class="bg-nexi-purple w-24">{{ __('Request') }}</x-primary-button>
+                                        <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50" class="bg-nexi-purple w-24">{{ __('Request') }}</x-primary-button>
                                     </form>
                                 </div>
                             </td>

resources/views/livewire/pages/quote/request.blade.php

@@ -35,6 +35,6 @@ new #[Layout('layouts.guest')] class extends Component
         ></x-text-input>
 
         <x-input-error :messages="$errors->get('quote')" class="mt-2"/>
-        <x-primary-button class="mt-4">{{ __('Request') }}</x-primary-button>
+        <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50" class="mt-4">{{ __('Request') }}</x-primary-button>
     </form>
 </div>

resources/views/livewire/pages/quote/requested.blade.php

@@ -70,10 +70,10 @@ new #[Layout('layouts.guest')] class extends Component
                             <td class="relative w-8 pl-4 pr-3 text-sm sm:pl-6 border-t">
                                 <div class="flex flex-row space-x-2">
                                     <form wire:submit="approve({{ $quote }})">
-                                        <x-primary-button class="bg-nexi-green w-24">{{ __('Approve') }}</x-primary-button>
+                                        <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50" class="bg-nexi-green w-24">{{ __('Approve') }}</x-primary-button>
                                     </form>
                                     <form wire:submit="reject({{ $quote }})">
-                                        <x-primary-button class="bg-nexi-red w-24">{{ __('Reject') }}</x-primary-button>
+                                        <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50" class="bg-nexi-red w-24">{{ __('Reject') }}</x-primary-button>
                                     </form>
                                 </div>
                             </td>

resources/views/livewire/profile/update-password-form.blade.php

@@ -65,7 +65,7 @@ new class extends Component
         </div>
 
         <div class="flex items-center gap-4">
-            <x-primary-button>{{ __('Save') }}</x-primary-button>
+            <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50">{{ __('Save') }}</x-primary-button>
 
             <x-action-message class="mr-3" on="password-updated">
                 {{ __('Saved.') }}

resources/views/livewire/profile/update-profile-information-form.blade.php

@@ -72,7 +72,7 @@ new class extends Component
         </div>
 
         <div class="flex items-center gap-4">
-            <x-primary-button>{{ __('Save') }}</x-primary-button>
+            <x-primary-button wire:loading.attr="disabled" wire:loading.class="opacity-50">{{ __('Save') }}</x-primary-button>
 
             <x-action-message class="mr-3" on="profile-updated">
                 {{ __('Saved.') }}

routes/web.php

@@ -29,9 +29,6 @@ Route::middleware('guest')->group(function () {
     Volt::route('login', 'pages.auth.login')
         ->name('login');
 
-    Volt::route('forgot-password', 'pages.auth.forgot-password')
-        ->name('password.request');
-
     Volt::route('reset-password/{token}', 'pages.auth.reset-password')
         ->name('password.reset');
 });