Fix timer completion modal not closing automatically

- Add modal names to Flux modals for programmatic control
- Use wire:model.self instead of wire:model for proper state sync
- Call $this->modal()->close() after setting showModal to false
- Apply fix to both timer completion and discard confirmation modals

Author: o-psi

app/Livewire/TimerCompletionModal.php

@@ -273,8 +273,9 @@ public function confirmStopTimer()
             $this->dispatch('refreshNavbarTimer');
             $this->dispatch('time-entry-updated');
 
-            // Close modal
+            // Close modal - use Flux modal close method for proper sync
             $this->closeModal();
+            $this->modal('timer-completion')->close();
 
         } catch (\Exception $e) {
             Flux::toast(
@@ -289,6 +290,7 @@ public function cancelTimer()
         // Keep timer running, just close modal
         $this->dispatch('timer:cancelled', timerId: $this->timerId);
         $this->closeModal();
+        $this->modal('timer-completion')->close();
     }
 
     public function discardTimer()
@@ -315,7 +317,9 @@ public function confirmDiscardTimer()
 
             // Close both modals
             $this->showDiscardConfirmation = false;
+            $this->modal('timer-discard')->close();
             $this->closeModal();
+            $this->modal('timer-completion')->close();
 
         } catch (\Exception $e) {
             Flux::toast(
@@ -329,6 +333,7 @@ public function confirmDiscardTimer()
     public function cancelDiscard()
     {
         $this->showDiscardConfirmation = false;
+        $this->modal('timer-discard')->close();
     }
 
     protected function closeModal()

resources/views/livewire/timer-completion-modal.blade.php

@@ -1,6 +1,6 @@
 <div>
     @if($showModal)
-        <flux:modal wire:model="showModal" title="Complete Timer Entry" class="max-w-2xl">
+        <flux:modal name="timer-completion" wire:model.self="showModal" title="Complete Timer Entry" class="max-w-2xl">
             <form wire:submit.prevent="confirmStopTimer">
                 <div class="space-y-4">
                     {{-- Timer Summary --}}
@@ -203,7 +203,7 @@ class="text-red-600 hover:text-red-700"
 
     {{-- Discard Confirmation Modal --}}
     @if($showDiscardConfirmation)
-        <flux:modal wire:model="showDiscardConfirmation" title="Discard Timer?" class="max-w-md">
+        <flux:modal name="timer-discard" wire:model.self="showDiscardConfirmation" title="Discard Timer?" class="max-w-md">
             <div class="space-y-4">
                 <div class="p-4 bg-amber-50 dark:bg-amber-900/20 border border-amber-200 dark:border-amber-700 rounded-lg">
                     <div class="flex items-start gap-3">