feat: Phase 2 - Laravel Reverb + real-time notifications

- Install laravel/reverb + laravel-echo + pusher-js
- Configure broadcasting to reverb in .env.example + .env
- Add Echo + Pusher client in resources/js/app.js
- Update all 14 notifications to implement ShouldBroadcast + broadcastOn()
- Update NotificationBell component to listen for real-time events
- Add Livewire.emit in notification-bell blade for JS-to-Livewire bridge

Tests: 101 passing (319 assertions)
This commit is contained in:
Javier Braña
2026-08-31 12:16:56 +02:00
parent 78d1dbf45a
commit 9222eefdf9
26 changed files with 1192 additions and 44 deletions
+14
View File
@@ -1,5 +1,19 @@
import './bootstrap';
import Echo from 'laravel-echo';
import Pusher from 'pusher-js';
window.Pusher = Pusher;
window.Echo = new Echo({
broadcaster: 'reverb',
key: import.meta.env.VITE_REVERB_APP_KEY,
wsHost: import.meta.env.VITE_REVERB_HOST,
wsPort: import.meta.env.VITE_REVERB_PORT,
wssPort: import.meta.env.VITE_REVERB_PORT,
forceTLS: (import.meta.env.VITE_REVERB_SCHEME ?? 'https') === 'https',
enabledTransports: ['ws', 'wss'],
});
import localforage from 'localforage';
// Generic function to queue any offline action
@@ -84,4 +84,18 @@
@endif
</div>
</div>
@push('scripts')
<script>
document.addEventListener('livewire:load', () => {
const userId = {{ auth()->id() ?? 'null' }};
if (userId && window.Echo) {
window.Echo.private(`user.${userId}`)
.notification((notification) => {
Livewire.emit('notification-received', notification.data.message ?? 'Nueva notificación');
});
}
});
</script>
@endpush
</div>