Noerd Docu

Banners display important notifications at the top of the application. They can be static messages or dynamic components.

File Location

app-configs/banner.yml

Configuration

banners:
  - priority: 100
    type: danger
    message: "Important maintenance tonight!"
    dismissible: false

  - priority: 50
    type: warning
    component: banner.demo-expiry
    dismissible: true

  - priority: 10
    type: info
    message: "New features available!"
    dismissible: true

Property	Description
`priority`	Display order (higher = shown first)
`type`	Visual style: `danger`, `warning`, `info`, `success`
`message`	Static text message
`component`	Dynamic Livewire component (alternative to message)
`dismissible`	Allow users to close the banner

Type	Color	Use Case
`danger`	Red	Critical issues, system errors
`warning`	Yellow	Important notices, expiring features
`info`	Blue	General information, announcements
`success`	Green	Positive confirmations

Static vs Dynamic Banners

Static Banner: Use message for simple text.

- priority: 100
  type: danger
  message: "System maintenance at 2 AM"
  dismissible: false

Dynamic Banner: Use component for complex logic.

- priority: 50
  type: warning
  component: banner.demo-expiry
  dismissible: true

Creating a Dynamic Component

Components are placed in your module's views directory:

app-modules/{module}/resources/views/components/banner/{name}.blade.php

app-modules/liefertool/resources/views/components/banner/demo-expiry.blade.php

<?php

use Livewire\Component;
use Noerd\Helpers\TenantHelper;

new class extends Component {
    public string $message = '';

    public function mount(): void
    {
        $tenant = TenantHelper::getSelectedTenant();
        $daysRemaining = 0;

        if ($tenant && isset($tenant->demo_expires_at)) {
            $daysRemaining = now()->diffInDays($tenant->demo_expires_at, false);
            $daysRemaining = max(0, (int) $daysRemaining);
        }

        $this->message = __('noerd_banner_demo_expiry', ['days' => $daysRemaining]);
    }
}; ?>

<span>{{ $message }}</span>

Key Concepts

Priority: Determines display order when multiple banners are active
Component prefix: Use banner.{name} to reference components in the banner/ subdirectory
Dismissible banners: Users can close them; preference is stored per session
Non-dismissible banners: Always visible until removed from configuration

Examples

Maintenance Notice

banners:
  - priority: 100
    type: danger
    message: "Scheduled maintenance on Sunday, 2-4 AM"
    dismissible: false

Feature Announcement

banners:
  - priority: 10
    type: info
    message: "Try our new reporting feature!"
    dismissible: true

Trial Expiry Warning

banners:
  - priority: 50
    type: warning
    component: banner.demo-expiry
    dismissible: true

Banner System