Notification Bell

• Features
• Requirements
• Installation
  • 1. Install via Composer
  • 2. Publish and run the migration
  • 3. Publish the CSS asset
  • 4. Register the plugin in your Filament panel
• Sending Notifications
  • Real-time broadcast (optional)
• Configuration Reference
• Fluent Plugin API
• Customizing Views
• Light & Dark Mode
• Multi-language / i18n
  • Bundled locales
  • Publish lang files
  • Override a translation key
  • Add a new language
  • Force a specific locale
  • RTL support
• Changelog
• Contributing
• License

A drop-in, zero-config notification bell for your Filament v5 admin panel. Powered by Laravel Reverb (or Pusher) and Livewire v4, with full dark mode and RTL support out of the box.

#Features

• 🔔 Real-time bell icon in the Filament top bar
• ⚡ Powered by Laravel Reverb WebSockets (or Pusher as fallback)
• 🌙 Full dark mode support — auto-follows Filament panel theme, or force light/dark
• 🌐 Ships with 6 translations: English, Arabic, French, Spanish, German, Chinese Simplified
• 🔤 RTL layout auto-detected for Arabic, Farsi, Urdu
• 📥 Dropdown and slide-over panel modes
• ✅ Mark single or all notifications as read
• ♾️ Paginated "Load more" list
• 📡 Optional polling fallback
• 🧪 Full Pest test suite included
• 📦 Publishable config, views, CSS, language files, and migrations

#Requirements

#Installation

#1. Install via Composer

composer require benriadh1/filament-notification-bell

#2. Publish and run the migration

php artisan vendor:publish --tag="filament-notification-bell-migrations"
php artisan migrate

#3. Publish the CSS asset

php artisan vendor:publish --tag="filament-notification-bell-assets"

#4. Register the plugin in your Filament panel

In your Panel provider (e.g. app/Providers/Filament/AdminPanelProvider.php):

use Benriadh1\FilamentNotificationBell\FilamentNotificationBellPlugin;

public function panel(Panel $panel): Panel
{
    return $panel
        // ... your other panel config
        ->plugin(FilamentNotificationBellPlugin::make());
}

That's it! The bell will appear in the top bar automatically.

#Sending Notifications

Use Laravel's built-in notification system. The plugin reads from the notifications table automatically.

use Illuminate\Notifications\Notification;
use Illuminate\Notifications\Messages\DatabaseMessage;

class OrderShipped extends Notification
{
    public function via($notifiable): array
    {
        return ['database'];
    }

    public function toDatabase($notifiable): array
    {
        return [
            'title' => 'Order Shipped',
            'body'  => 'Your order #1234 has been shipped.',
            'url'   => route('orders.show', 1234),
            'type'  => 'success', // 'info' | 'success' | 'warning' | 'error'
        ];
    }
}

Then send it:

$user->notify(new OrderShipped());

#Real-time broadcast (optional)

If you want the bell to update in real time without page reload, add the HasNotificationBell trait to your User model and call notifyBell() after sending a notification:

use Benriadh1\FilamentNotificationBell\Concerns\HasNotificationBell;

class User extends Authenticatable
{
    use HasNotificationBell;
}

$user->notify(new OrderShipped());
$user->notifyBell(); // broadcasts the NotificationSent event via Reverb

#Configuration Reference

Publish the config:

php artisan vendor:publish --tag="filament-notification-bell-config"

#Fluent Plugin API

All options can be set fluently when registering the plugin:

FilamentNotificationBellPlugin::make()
    ->limit(30)
    ->slideOver()              // or ->dropdown() (default)
    ->withPolling(60)          // enable polling every 60 seconds
    ->locale('fr')             // force French locale
    ->rtl()                    // force RTL layout
    ->lightMode()              // or ->darkMode() or ->autoTheme() (default)
    ->usePusher()              // or ->useReverb() (default)

#Customizing Views

Publish the views to override them in your application:

php artisan vendor:publish --tag="filament-notification-bell-views"

Views will be copied to resources/views/vendor/filament-notification-bell/.

#Light & Dark Mode

By default (auto), the bell follows your Filament panel's dark mode setting — no extra configuration needed if your panel already uses ->darkMode().

Force light mode:

FilamentNotificationBellPlugin::make()->lightMode()

Force dark mode:

FilamentNotificationBellPlugin::make()->darkMode()

Auto (default) — respects Filament panel setting:

FilamentNotificationBellPlugin::make()->autoTheme()

#Multi-language / i18n

#Bundled locales

#Publish lang files

php artisan vendor:publish --tag="filament-notification-bell-lang"

#Override a translation key

After publishing, edit the file at lang/vendor/filament-notification-bell/en/notification-bell.php:

return [
    'title' => 'My Custom Title',
    // ...
];

#Add a new language

Create the file at:

resources/lang/vendor/filament-notification-bell/{locale}/notification-bell.php

For example, for French (fr):

// resources/lang/vendor/filament-notification-bell/it/notification-bell.php
return [
    'title'            => 'Notification',
    'mark_all_read'    => '',
    // ... all keys
];

#Force a specific locale

FilamentNotificationBellPlugin::make()->locale('fr')

#RTL support

RTL layout is automatically enabled for ar, fa, he, and ur. The dir="rtl" attribute and text-alignment classes are applied automatically. To add another locale or force RTL:

// In config/filament-notification-bell.php
'rtl_locales' => ['ar', 'fa', 'he', 'ur', 'ug'],

// Or via fluent plugin API
FilamentNotificationBellPlugin::make()->rtl()

#Changelog

See CHANGELOG.md for recent changes.

#Contributing

Contributions are welcome! Please open a pull request or issue on GitHub.

New translations are especially welcome — add a new language file and open a PR!

1. Fork the repository
2. Create your feature branch: git checkout -b feat/my-feature
3. Commit your changes: git commit -m "feat: add my feature"
4. Push: git push origin feat/my-feature
5. Open a Pull Request

#License

The MIT License (MIT). See LICENSE.md for more details.