Filament Plugins

Purchase

Switch plugin

Activitylog Pro Auto Translator Media Library Manager Notifications Pro Onboarding Manager Pro Pulse Record Finder Pro Upload Pro

Getting started

Installation Usage Upgrade guide

Usage

After you added the plugin to your panel, you can visit the Pulse page in your panel. This page will have the same layout as the default Pulse, but only inside your Filament panel and styled to match with Filament's styling. The styling has been updated to fit in better with Filament's UI.

There are many configuration options available to customize the Pulse dashboard. I'll go through them below.

By default, Pulse offers the following cards:

  • Servers
  • Usage (application usage showing users)
  • Queues
  • Cache
  • Slow Queries
  • Filament Usage card (using custom recorder)
  • Exceptions
  • Slow Requests
  • Slow Jobs
  • Slow Outgoing Requests

Disabling cards

You can disable a Pulse card by calling its respective method and passing false to the enabled parameter:

php 
$plugin
    ->serversCard(enabled: false)
    ->usageCard(enabled: false)
    ->queuesCard(enabled: false)
    ->cacheCard(enabled: false)
    ->slowQueriesCard(enabled: false)
    ->filamentPagesCard(enabled: false)
    ->exceptionsCard(enabled: false)
    ->slowRequestsCard(enabled: false)
    ->slowJobsCard(enabled: false)
    ->slowOutgoingRequestsCard(enabled: false)

You can also pass a closure if you need to determine during run-time whether the card should be enabled or not:

php 
$plugin
    ->filamentPagesCard(enabled: fn () => auth()->user()->isDeveloper())

Re-ordering cards

You can re-order cards by passing an integer to the following methods. This works similar to other Filament methods like $navigationSort.

php 
$plugin
    ->serversCardSort(1)
    ->usageCardSort(2)
    ->queuesCardSort(3)
    ->cacheCardSort(4)
    ->slowQueriesCardSort(5)
    ->filamentPagesCardSort(6)
    ->exceptionsCardSort(7)
    ->slowRequestsCardSort(8)
    ->slowJobsCardSort(9)
    ->slowOutgoingRequestsCardSort(10)

Setting the column span is also available as the sort parameter on the generic method:

php 
$plugin
    ->serversCard(sort: 1)
    ->usageCard(sort: 2)
    // ...

Customizing headings

You can add custom headings to the cards by passing a new heading to its respective method. You can pass a both closure (if you need to use the translator) and a string.

php 
$plugin
    ->serversCardHeading('Servers')
    ->usageCardHeading('Application Usage')
    ->queuesCardHeading('Queues')
    ->cacheCardHeading('Cache')
    ->slowQueriesCardHeading('Slow Queries')
    ->filamentPagesCardHeading('Filament Usage')
    ->exceptionsCardHeading('Exceptions')
    ->slowRequestsCardHeading('Slow Requests')
    ->slowJobsCardHeading('Slow Jobs')
    ->slowOutgoingRequestsCardHeading('Slow Outgoing Requests')

Setting the title is also available as the title parameter on the generic method:

php 
$plugin
    ->serversCard(heading: 'Servers')
    ->usageCard(heading: 'Application Usage')
    // ...

Customizing icons

You can add custom icons to the cards by passing a new icon to its respective method:

php 
use Filament\Support\Icons\Heroicon;

$plugin
    ->serversCardIcon(Heroicon::OutlinedServerStack)
    ->usageCardIcon(Heroicon::OutlinedCursorArrowRays)
    ->queuesCardIcon(Heroicon::OutlinedQueueList)
    ->cacheCardIcon(Heroicon::OutlinedRocketLaunch)
    ->slowQueriesCardIcon(Heroicon::OutlinedCircleStack)
    ->filamentPagesCardIcon(Heroicon::OutlinedAdjustmentsHorizontal)
    ->exceptionsCardIcon(Heroicon::OutlinedBugAnt)
    ->slowRequestsCardIcon(Heroicon::OutlinedArrowsRightLeft)
    ->slowJobsCardIcon(Heroicon::OutlinedCommandLine)
    ->slowOutgoingRequestsCardIcon(Heroicon::OutlinedCloudArrowUp)

Setting the icon is also available as the icon parameter on the generic method:

php 
use Filament\Support\Icons\Heroicon;

$plugin
    ->serversCard(icon: Heroicon::OutlinedServerStack)
    ->usageCard(icon: Heroicon::OutlinedCursorArrowRays)
    // ...

Customizing the widths/heights (rows/columns)

Laravel Pulse allows you to customize the width and height of each card. By default, a page will have 12 columns. For each card you can define how many columns it should take horizontally:

php 
$plugin
    ->serversCardColumnSpanFull()
    ->usageCardColumnSpan(4)
    ->queuesCardColumnSpan(4)
    ->cacheCardColumnSpan(4)
    ->slowQueriesCardColumnSpan(8)
    ->filamentPagesCardColumnSpan(6)
    ->exceptionsCardColumnSpan(6)
    ->slowRequestsCardColumnSpan(6)
    ->slowJobsCardColumnSpan(6)
    ->slowOutgoingRequestsCardColumnSpan(6)

Setting the column span is also available as the third parameter on the generic method:

php 
$plugin
    ->serversCard(columnSpan: 1)
    ->usageCard(columnSpan: 2)
    // ...

For cards, you can also define how many rows it should take vertically. By default, all cards will take up one row. Two exceptions are the application usage card and the filament usage card, which both are tall cards and take up 2 rows:

php 
$plugin
    ->serversCardRowSpan(1)
    ->usageCardRowSpan(2)
    ->queuesCardRowSpan(1)
    ->cacheCardRowSpan(1)
    ->slowQueriesCardRowSpan(1)
    ->filamentPagesCardRowSpan(2)
    ->exceptionsCardRowSpan(1)
    ->slowRequestsCardRowSpan(1)
    ->slowJobsCardRowSpan(1)
    ->slowOutgoingRequestsCardRowSpan(1)

Setting the vertical row span is also available as the fourth parameter on the generic method:

php 
$plugin
    ->serversCard(rowSpan: 1)
    ->usageCard(rowSpan: 2)
    // ...

Registering custom cards

If you want to build your own custom Pulse cards and recorders, or display custom cards from external packages, you can use the registerCard() method.

For example, let's say that we want to register 404 monitoring using geowrgetudor/404-monitor:

php 
$plugin
    ->registerCard(livewire: \Geow\NotFoundMonitor\Livewire::class, sort: 10, columnSpan: 4, rowSpan: 1)

Customizing page navigation details

If you want to customize the navigation details of the Pulse page, you can configure it using the dedicated methods on the $plugin when configuring it:

php 
use Filament\Support\Icons\Heroicon;

$plugin
    ->navigationGroup('Monitoring')
    ->navigationSort(1)
    ->navigationLabel('Monitoring')
    ->navigationIcon(Heroicon::OutlinedSquaresPlus)
    ->navigationIcon(Heroicon::SquaresPlus)
    ->pageTitle('Monitoring')
    ->slug('monitoring')

Customizing the page class

If you want to customise or override other aspects of the page, you can create a new class in your project that extends the \RalphJSmit\Filament\Pulse\Pages\PulsePage page. In this class you can override everything you want to customize, like the title, navigation label or navigation group.

Finally, you should register the new page in Filament by using the ->registerPages() method:

php 
$plugin->registerPages([
    YourExtendedPulsePage::class,
])
© FilamentPlugins.com ✦ 2022 – 2026
Privacy ✦ Terms & Conditions
All rights reserved.