Megaphone is a Laravel Livewire-based component that uses the power of Laravel’s built-in Notifications system to allow you to add a “Bell Icon Notification System” to your app. Megaphone also ships with an Admin form component that allows you to send out a notification to all your users at once. Perfect for announcing new features or planned maintenance!

Getting Started

Simply require the package via composer into your Laravel app.

composer require mbarlow/megaphone

Next, run these commands.

php artisan notifications:table
 
php artisan migrate 

Next, make sure your User model (or relevant alternative model) has the notifiable trait added as mentioned in the Laravel Documentation, and also add the HasMegaphone trait provided by Megaphone.

<?php
 
namespace App\Models;
 
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;
use MBarlow\Megaphone\HasMegaphone;
 
class User extends Authenticatable
{
    use Notifiable;
    use HasMegaphone
}

Lastly, publish the Megaphone assets. This should publish the Config file as well as the templates and stylesheets.

php artisan vendor:publish --provider="MBarlow\Megaphone\MegaphoneServiceProvider"

Using Megaphone

To get started using megaphone, drop in the Megaphone Livewire component into your template.

<livewire:megaphone></livewire:megaphone>

This will render a Bell Icon where the component has been placed. When clicked a static sidebar will appear on the right of the screen which will show all the existing and any new notifications to the user.

Sending Notifications

By default, Megaphone will only load notifications that have been registered within the Megaphone config file. Notifications shipped with Megaphone will be within config(‘megaphone. types’). This will be merged with the key values of config(‘megaphone.customTypes’) to create the list of supported notifications.

This means you can see use the Laravel Notification system for other parts of your system without them appearing in the Megaphone notifications list.

To send a Megaphone notification instantiate a new notification that extends MBarlow\Megaphone\Types\BaseAnnouncement. Megaphone ships with 3 as default, MBarlow\Megaphone\Types\General, MBarlow\Megaphone\Types\Important and MBarlow\Megaphone\Types\NewFeature.

$notification = new \MBarlow\Megaphone\Types\Important(
    'Expected Downtime!', // Notification Title
    'We are expecting some downtime today at around 15:00 UTC for some planned maintenance. Read more on a blog post!', // Notification Body
    'https://example.com/link', // Optional: URL. Megaphone will add a link to this URL within the Notification display.
    'Read More...' // Optional: Link Text. The text that will be shown on the link button.
);

Now, simply notify the required user of the notification as per the Laravel Documentation.

$user = \App\Models\User::find(1);

$user->notify($notification);

Custom Notifications

As mentioned, you can add your own notification types to Megaphone. In order to do this, first, create a new class within your application and make sure it extends MBarlow\Megaphone\Types\BaseAnnouncement, for example:

<?php

namespace App\Megaphone;

use MBarlow\Megaphone\Types\BaseAnnouncement;

class MyCustomNotification extends BaseAnnouncement
{
}

Next, you will need to create the view file for how Megaphone should render that notification. To get you started you can use the base template the General, Important and New Feature notifications use. So for example, create a new view within resources/views/megaphone/my-custom-notification.blade.php.

@include('megaphone::types.base', ['icon' => 'ICON SVG HERE'])

Simply, add a relevant SVG Icon for your notification within the blade including the parameters array, and you’re good to go.

Lastly, you need to tell Megaphone about this notification. Open up the Megaphone config file config/megaphone.php and find the customTypes attribute. This should be an associative array with the FQDN of the notification class as the key and the path to the view as the value. For example,

 /*
     * Custom notification types specific to your App
     */
    'customTypes' => [
        /*
            Associative array in the format of
            \Namespace\To\Notification::class => 'path.to.view',
         */
        \App\Megaphone\MyCustomNotification::class => 'megaphone.my-custom-notification', 
    ],

Now you can trigger the notification and a user will receive it via their Bell Icon.

$notification = new \App\Megaphone\MyCustomNotification(
    'Hello World',
    'This is a custom notification, hope you like our app!'
);

$user = \App\Models\User::find(1);

$user->notify($notification);

This package has a lot more and you can visit Github for more details about this package.