From 4029d335a8671a29d578876d8f901696016d7404 Mon Sep 17 00:00:00 2001
From: Giuseppe <g.ialongo@egeatech.com>
Date: Mon, 5 Feb 2024 12:45:03 +0100
Subject: [PATCH] UPDATE: add loading for nav item when request in progress

---
 Resources/views/components/nav-item.blade.php | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/Resources/views/components/nav-item.blade.php b/Resources/views/components/nav-item.blade.php
index 0adac9fe..2296d96a 100644
--- a/Resources/views/components/nav-item.blade.php
+++ b/Resources/views/components/nav-item.blade.php
@@ -24,9 +24,12 @@
                 </button>
             @endif
 
-            <button type="button" @if (!$disableRecordEdit) wire:click="editItem('{{ $statePath }}')" @endif
+            <button type="button" @if (!$disableRecordEdit) wire:click="editItem('{{ $statePath }}')" wire:loading.attr="disabled" @endif
                 class="appearance-none px-3 py-2 text-left">
-                <span>{{ $item['label'] }}</span>
+                <div style="float:left;">
+                    <span>{{ $item['label'] }}</span>
+                    <div wire:loading wire:target="editItem('{{ $statePath }}')"> @svg('heroicon-o-arrow-path', 'w-3 h-3 text-blue-500 hover:text-blue-900 animate-spin') </div>
+                </div>
             </button>
 
             @if (count($item['children']) > 0)
@@ -51,19 +54,25 @@ class="appearance-none text-gray-500">
         ])>
 
             @if (!$disableNewChildRecordCreation)
-                <button x-init x-tooltip.raw.duration.0="{{ __('ui::filament-navigation.items.add-child') }}"
+                <button wire:loading.remove wire:target="addChild('{{ $statePath }}')" x-init x-tooltip.raw.duration.0="{{ __('ui::filament-navigation.items.add-child') }}"
                     type="button" wire:click="addChild('{{ $statePath }}')" class="p-1"
                     title="{{ __('ui::filament-navigation.items.add-child') }}">
                     @svg('heroicon-o-plus', 'w-3 h-3 text-gray-500 hover:text-gray-900')
                 </button>
+                <button wire:loading wire:target="addChild('{{ $statePath }}')" type="button" class="p-1">
+                    @svg('heroicon-o-arrow-path', 'w-3 h-3 text-blue-500 hover:text-blue-900 animate-spin')
+                </button>
             @endif
 
             @if (!$disableRecordDeletion)
-                <button x-init x-tooltip.raw.duration.0="{{ __('ui::filament-navigation.items.remove') }}"
+                <button wire:loading.remove wire:target="removeItem('{{ $statePath }}')" x-init x-tooltip.raw.duration.0="{{ __('ui::filament-navigation.items.remove') }}"
                     type="button" wire:click="removeItem('{{ $statePath }}')" class="p-1"
                     title="{{ __('ui::filament-navigation.items.remove') }}">
                     @svg('heroicon-o-trash', 'w-3 h-3 text-danger-500 hover:text-danger-900')
                 </button>
+                <button wire:loading wire:target="removeItem('{{ $statePath }}')" type="button" class="p-1">
+                    @svg('heroicon-o-arrow-path', 'w-3 h-3 text-blue-500 hover:text-blue-900 animate-spin')
+                </button>
             @endif
         </div>
     </div>