Merge pull request #10066 from filamentphp/fix/toggle-column-flicker

fix: Toggle column flicker
filamentphp · Dec 4, 2023 · 8aab860 · 8aab860
2 parents 12853eb + bee8a8e
commit 8aab860
Showing 1 changed file with 12 additions and 3 deletions.
diff --git a/packages/tables/resources/views/columns/toggle-column.blade.php b/packages/tables/resources/views/columns/toggle-column.blade.php
@@ -35,15 +35,24 @@
                     return
                 }
 
-                state = ! state
+                const updatedState = ! state
+
+                // Only update the state if the toggle is being turned off,
+                // otherwise it will flicker on twice when Livewire replaces
+                // the element.
+                if (state) {
+                    state = false
+                }
 
                 isLoading = true
 
-                const response = await $wire.updateTableColumnState(@js($getName()), @js($recordKey), state)
+                const response = await $wire.updateTableColumnState(@js($getName()), @js($recordKey), updatedState)
 
                 error = response?.error ?? undefined
 
-                if (error) {
+                // The state is only updated on the frontend if the toggle is
+                // being turned off, so we only need to reset it then.
+                if ((! state) && error) {
                     state = ! state
                 }