Upgrade to Livewire 4 (#1)

Copilot · limonte · web-flow · commit c5f8897e54e2 · 2026-01-18T23:50:14.000+02:00
* Initial plan

* Upgrade to Livewire 4.0.1

Co-authored-by: limonte &lt;6059356+limonte@users.noreply.github.com&gt;

---------

Co-authored-by: copilot-swe-agent[bot] &lt;198982749+Copilot@users.noreply.github.com&gt;
Co-authored-by: limonte &lt;6059356+limonte@users.noreply.github.com&gt;
diff --git a/.github/copilot-instructions.md b/.github/copilot-instructions.md
@@ -8,10 +8,10 @@ The Laravel Boost guidelines are specifically curated by Laravel maintainers for
 ## Foundational Context
 This application is a Laravel application and its main Laravel ecosystems package & versions are below. You are an expert with them all. Ensure you abide by these specific packages & versions.
 
-- php - 8.5.2
+- php - 8.4.16
 - laravel/framework (LARAVEL) - v12
 - laravel/prompts (PROMPTS) - v0
-- livewire/livewire (LIVEWIRE) - v3
+- livewire/livewire (LIVEWIRE) - v4
 - laravel/mcp (MCP) - v0
 - laravel/pint (PINT) - v1
 - laravel/sail (SAIL) - v1
@@ -219,41 +219,6 @@ protected function isAccessible(User $user, ?string $path = null): bool
     ->assertSeeLivewire(CreatePost::class);
 </code-snippet>
 
-=== livewire/v3 rules ===
-
-## Livewire 3
-
-### Key Changes From Livewire 2
-- These things changed in Livewire 3, but may not have been updated in this application. Verify this application's setup to ensure you conform with application conventions.
-    - Use `wire:model.live` for real-time updates, `wire:model` is now deferred by default.
-    - Components now use the `App\Livewire` namespace (not `App\Http\Livewire`).
-    - Use `$this->dispatch()` to dispatch events (not `emit` or `dispatchBrowserEvent`).
-    - Use the `components.layouts.app` view as the typical layout path (not `layouts.app`).
-
-### New Directives
-- `wire:show`, `wire:transition`, `wire:cloak`, `wire:offline`, `wire:target` are available for use. Use the documentation to find usage examples.
-
-### Alpine
-- Alpine is now included with Livewire; don't manually include Alpine.js.
-- Plugins included with Alpine: persist, intersect, collapse, and focus.
-
-### Lifecycle Hooks
-- You can listen for `livewire:init` to hook into Livewire initialization, and `fail.status === 419` for the page expiring:
-
-<code-snippet name="Livewire Init Hook Example" lang="js">
-document.addEventListener('livewire:init', function () {
-    Livewire.hook('request', ({ fail }) => {
-        if (fail && fail.status === 419) {
-            alert('Your session expired');
-        }
-    });
-
-    Livewire.hook('message.failed', (message, component) => {
-        console.error(message);
-    });
-});
-</code-snippet>
-
 === pint/core rules ===
 
 ## Laravel Pint Code Formatter
diff --git a/composer.json b/composer.json
@@ -12,7 +12,7 @@
         "php": "^8.2",
         "laravel/framework": "^12.0",
         "laravel/tinker": "^2.10.1",
-        "livewire/livewire": "^3.7",
+        "livewire/livewire": "^4.0",
         "sweetalert2/laravel": "^1.2"
     },
     "require-dev": {
diff --git a/composer.lock b/composer.lock
diff --git a/resources/views/welcome.blade.php b/resources/views/welcome.blade.php
@@ -1,11 +1,9 @@
 <!DOCTYPE html>
 <html>
     <head>
-        @livewireStyles
     </head>
     <body>
         <livewire:counter />
-        @livewireScripts
         @include('sweetalert2::index')
     </body>
 </html>
