README

Filament Environment Indicator

Never confuse your tabs with different Filament environments again.

Installation via Composer

composer require pxlrbt/filament-environment-indicator

Usage

To use this plugin register it in your panel configuration:

use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;

$panel
    ->plugins([
        EnvironmentIndicatorPlugin::make(),
    ]);

Configuration

Out of the box, this plugin adds a colored border to the top of the admin panel and a badge next to the search bar.

You can customize any behaviour via the plugin object.

Customizing the view

Use php artisan vendor:publish --tag="filament-environment-indicator-views" to publish the view to the resources/views/vendor/filament-environment-indicator folder. After this you can customize it as you wish!

Visibility

By default, the package checks whether you have Spatie permissions plugin installed and checks for a role called super_admin. You can further customize whether the indicators should be shown.

use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;

$panel->plugins([
    EnvironmentIndicatorPlugin::make()
        ->visible(fn () => auth()->user()?->can('see_indicator'))
]);

Environment

By default, the environment is resolved from app()->environment() (i.e. the APP_ENV value). You can override it with a static string or a closure:

use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;

$panel->plugins([
    EnvironmentIndicatorPlugin::make()
        ->environment(fn () => config('app.custom_env', app()->environment()))
]);

This affects the badge label, as well as the default color, badge visibility, and border visibility which all key off the environment value.

Colors

You can overwrite the default colors if you want your own colors or need to add more. The ->color()method accepts any Filament's Color object or a closure that returns a color object.

use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;
use Filament\Support\Colors\Color;

$panel->plugins([
    EnvironmentIndicatorPlugin::make()
        ->color(fn () => match (app()->environment()) {
            'production' => null,
            'staging' => Color::Orange,
            default => Color::Blue,
        })
]);

Indicators

By default, both indicators are displayed on non-production environments. You can turn them off separately.

use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;
use Filament\Support\Colors\Color;

$panel->plugins([
    EnvironmentIndicatorPlugin::make()
        ->showBadge(false)
        ->showBorder(true)            
]);

Badge position

By default, badge position is \Filament\View\PanelsRenderHook::GLOBAL_SEARCH_BEFORE.

use Filament\View\PanelsRenderHook;
use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;

$panel->plugins([
    EnvironmentIndicatorPlugin::make()
        ->badgePosition(PanelsRenderHook::TOPBAR_LOGO_BEFORE)
]);

Git Branch

You can enable the display of the current git branch in the badge via ->showGitBranch(). This requires the exec() function to be enabled in your PHP configuration.

use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;
use Filament\Support\Colors\Color;

$panel->plugins([
    EnvironmentIndicatorPlugin::make()
        ->showGitBranch()                    
]);

Debug Mode Warning

You can enable a debug mode warning for every environment or just for production by using ->showDebugModeWarning()/->showDebugModeWarningInProduction()

use pxlrbt\FilamentEnvironmentIndicator\EnvironmentIndicatorPlugin;
use Filament\Support\Colors\Color;

$panel->plugins([
    EnvironmentIndicatorPlugin::make()
        ->showDebugModeWarningInProduction()            
]);

Contributing

If you want to contribute to this packages, you may want to test it in a real Filament project:

• Fork this repository to your GitHub account.
• Create a Filament app locally.
• Clone your fork in your Filament app's root directory.
• In the /filament-environment-indicator directory, create a branch for your fix, e.g. fix/error-message.

Install the packages in your app's composer.json:

"require": {
    "pxlrbt/filament-environment-indicator": "dev-fix/error-message as main-dev",
},
"repositories": [
    {
        "type": "path",
        "url": "filament-environment-indicator"
    }
]

Now, run composer update.

Credits

• Dennis Koch
• All Contributors