MoonShine MoonShine
EN
← All plugins

Rush

🔥 Bestseller
Made by the authors of MoonShine
Supports dark mode
Multilingualism

Rush is a Laravel package that enables real-time event handling on web pages using WebSockets. The package integrates seamlessly with the MoonShine admin panel and offers convenient tools for instant notifications, collaborative form editing, dynamic fragment updates, and flexible HTML content management. Rush supports various WebSocket solutions, including Laravel Echo, Centrifugo, SocketIO, and custom implementations, making it a versatile tool for building interactive web applications.

Rating
5
Downloads
52
Version
-
Last updated
-
MoonShine version
v3, v2
Github stars
2
2000.00 ₽ 8000.00 ₽
  • Проверено MoonShine
  • Приоритетная тех. поддержка
MoonShine Software
Author
MoonShine Software
More from this author
MoonShine Permission

MoonShine Permission

MoonShine Permission - это пакет для системы управления правами доступа в админ-панели MoonShine v2.0+, который позволяет гибко настраивать разрешения для пользователей через встроенные трейты и модели, а также контролировать доступ к различным разделам админки.

5
6232 downloads
MoonShine Changelog

MoonShine Changelog

MoonShine Changelog - это пакет для MoonShine, который добавляет функционал отслеживания изменений в моделях, позволяя легко просматривать историю последних модификаций через специальный компонент в админ-панели.

5
9903 downloads
MoonShine two-factor authentication

MoonShine two-factor authentication

MoonShine Two-Factor Authentication - это пакет для MoonShine, который добавляет двухфакторную аутентификацию в админ-панель, позволяя повысить безопасность путем внедрения дополнительного уровня проверки при входе в систему.

5
2786 downloads

logo

Rush

Laravel required PHP required MoonShine required ru

ru

Table of Contents

About

Rush is a powerful package that enables real-time event handling on web pages using WebSockets. It seamlessly integrates with Laravel and MoonShine admin panel to provide a robust solution for notifications, collaborative form editing, and dynamic content updates.

Features

  • Real-time Notifications: Instantly receive and display notifications on the page.
  • Collaborative Form Editing: Display active users on editing forms and track their actions in real-time.
  • Dynamic Fragment Reload: Reload specific page fragments without a full page refresh.
  • Flexible WebSocket Support: Compatible with various WebSocket applications:
    • Laravel Echo (Pusher, Reverb)
    • Centrifugo
    • SocketIO
    • Custom solutions

Installation

  1. Install the package via Composer:

    composer require moonshine/rush
    composer require moonshine/rush

  2. Publish assets, configuration, and WebSocket application code samples:

    php artisan moonshine-rush:install
    php artisan moonshine-rush:install

  3. If you're using notifications from this package, replace MoonShineNotificationContract in your service provider:

    $this->app->bind(MoonShineNotificationContract::class, RushNotificationAdapter::class);
    $this->app->bind(MoonShineNotificationContract::class, RushNotificationAdapter::class);

  4. MoonShine Rush uses client-to-client message events, so if you're using Pusher, you need to enable Client Events in your application.

Usage

Notifications

In MoonShineLayout use HasRushNotification trait:

use MoonShine\Rush\Traits\HasRushNotification;
 
final class MoonShineLayout extends CompactLayout
{
    use HasRushNotification;
    //..
}
use MoonShine\Rush\Traits\HasRushNotification;
 
final class MoonShineLayout extends CompactLayout
{
    use HasRushNotification;
    //..
}

If you haven't posted MoonShineLayout yet, do so:

php artisan moonshine:publish
php artisan moonshine:publish

Select Layout. Write the newly published Layout in the moonshine configuration file.

//...
'layout' => \App\MoonShine\MoonShineLayout::class,
//...
'layout' => \App\MoonShine\MoonShineLayout::class,

Sending a message is done using the Rush::events()->notification():

Rush::events()->notification(
    message: 'Notification message',
    button: new NotificationButton('Нажми меня', 'https://moonshine.cutcode.dev'),
    ids: [1],
    color: Color::GREEN
);
Rush::events()->notification(
    message: 'Notification message',
    button: new NotificationButton('Нажми меня', 'https://moonshine.cutcode.dev'),
    ids: [1],
    color: Color::GREEN
);

LiveForm

To display active users on the form page, attach the HasRushForm trait to your resource:

use MoonShine\Rush\Traits\HasLiveForm;
 
class MyResource extends ModelResource
{
    use HasLiveForm;
 
    //...
}
use MoonShine\Rush\Traits\HasLiveForm;
 
class MyResource extends ModelResource
{
    use HasLiveForm;
 
    //...
}

FragmentReload

Enable fragment reloading on Alpine events:

Rush::components()->fragment([
    FlexibleRender::make("Test reload " . time()),
])
    ->name('metrics');
Rush::components()->fragment([
    FlexibleRender::make("Test reload " . time()),
])
    ->name('metrics');

Trigger a fragment reload from the server:

Rush::events()->fragmentReload('metrics');
Rush::events()->fragmentReload('metrics');

For private channels:

Rush::components()->fragment([
    FlexibleRender::make("Test reload " . time()),
])
    ->privateChannel()
    ->name('metrics');
 
// Sending event to a specific user
Rush::events()->fragmentReload('metrics', userId: 1);
Rush::components()->fragment([
    FlexibleRender::make("Test reload " . time()),
])
    ->privateChannel()
    ->name('metrics');
 
// Sending event to a specific user
Rush::events()->fragmentReload('metrics', userId: 1);

HtmlReload

If you need to change the html code inside a block, for example <div id="container><p>HTML</p></div>, you can use HtmlReload.

public function htmlReload(string $selector, string $html, HtmlReloadAction $action = HtmlReloadAction::INNER_HTML): void
public function htmlReload(string $selector, string $html, HtmlReloadAction $action = HtmlReloadAction::INNER_HTML): void

First, you need to enable listening on the page by adding a new component.

use MoonShine\Rush\Services\Rush;
 
Rush::components()->htmlReload()
use MoonShine\Rush\Services\Rush;
 
Rush::components()->htmlReload()

Now we can update the container:

Rush::events()->htmlReload('#container', '<p>New Html</p>');
Rush::events()->htmlReload('#container', '<p>New Html</p>');

JsEvent

You can send any Js event using Rush:

use MoonShine\Rush\Services\Rush;
 
Rush::events()->js([
    AlpineJs::event(JsEvent::FRAGMENT_UPDATED, 'js-fragment'),
    AlpineJs::event(JsEvent::TABLE_ROW_UPDATED, 'index-table-item-resource-16'),
    AlpineJs::event(JsEvent::TABLE_UPDATED, 'index-table-item-resource', ['_delay' => 2000]),
]);
use MoonShine\Rush\Services\Rush;
 
Rush::events()->js([
    AlpineJs::event(JsEvent::FRAGMENT_UPDATED, 'js-fragment'),
    AlpineJs::event(JsEvent::TABLE_ROW_UPDATED, 'index-table-item-resource-16'),
    AlpineJs::event(JsEvent::TABLE_UPDATED, 'index-table-item-resource', ['_delay' => 2000]),
]);

The Rush::events()->js() method also accepts string type:

Rush::events()->js(AlpineJs::event(JsEvent::FRAGMENT_UPDATED, 'js-fragment'));
Rush::events()->js(AlpineJs::event(JsEvent::FRAGMENT_UPDATED, 'js-fragment'));

To send js events, you need to enable listening on the page by adding a new component:

use MoonShine\Rush\Services\Rush;
 
Rush::components()->jsEvent()
use MoonShine\Rush\Services\Rush;
 
Rush::components()->jsEvent()

Compatibility table

Rush v1.x Rush v2.x
✅ MoonShine v2.x ✅ MoonShine v3.x

Configuration

The configuration file is located at config/moonshine_rush.php. Key options include:

  • prefix: Prefix for all channels
  • notifications_channel: Prefix for notification channels
  • live_form_channel: Prefix for form channels
  • fragment_reload_channel: Prefix for fragment reload channels
  • html_reload: Prefix for html reload channels

Connection

Frontend

Initialize the connection after the moonshine:init event:

document.addEventListener("moonshine:init", () => {
  // Your initialization code here
})
document.addEventListener("moonshine:init", () => {
  // Your initialization code here
})

Pass all channel events to the MoonShine.onCallback('onMoonShineWS') function:

// Echo example
MoonShine.onCallback('onMoonShineWS', function(channel, onRush) {
    window.Echo.private(channel)
        .listen('.moonshine.ws.event', (e) => {
            onRush(e)
        }).subscribed(() => {
            document.dispatchEvent(new CustomEvent('rush-subscribe:' + channel))
        })
})
// Echo example
MoonShine.onCallback('onMoonShineWS', function(channel, onRush) {
    window.Echo.private(channel)
        .listen('.moonshine.ws.event', (e) => {
            onRush(e)
        }).subscribed(() => {
            document.dispatchEvent(new CustomEvent('rush-subscribe:' + channel))
        })
})

Trigger the moonshine:rush event after connecting:

window.Echo.connector.pusher.connection.bind('connected', () => {
    document.dispatchEvent(new CustomEvent('moonshine:rush'))
})
window.Echo.connector.pusher.connection.bind('connected', () => {
    document.dispatchEvent(new CustomEvent('moonshine:rush'))
})

Trigger the rush-subscribe event after subscribing:

//...
subscribed(() => {
  document.dispatchEvent(new CustomEvent('rush-subscribe:' + channel))
})
//...
subscribed(() => {
  document.dispatchEvent(new CustomEvent('rush-subscribe:' + channel))
})

Backend

Implement the RushBroadcastContract interface for server-side event sending:

final class SocketIO implements RushBroadcastContract
{
    public function send(string $channel, RushData $rushData): void {
        // Your implementation here
    }
}
final class SocketIO implements RushBroadcastContract
{
    public function send(string $channel, RushData $rushData): void {
        // Your implementation here
    }
}

Bind the implementation in your service provider:

$this->app->bind(RushBroadcastContract::class, SocketIO::class);
$this->app->bind(RushBroadcastContract::class, SocketIO::class);

License

Rush is a commercial software product distributed under a paid license. To use the package, you must purchase a license.

Purchasing a license

  1. Visit the official website moonshine-laravel.com.
  2. Make a payment through the available methods on the site.
  3. After successful payment, you will receive a personal license key.

Terms of Use

  • The license is issued for one developer.
  • The license gives the right to use the Rush package in commercial and non-commercial projects.
  • Distribution or resale of the license key to third parties is strictly prohibited.
  • Technical support and updates are provided in accordance with the terms of the purchased license.

For all questions related to licensing, please contact support: info@cutcode.dev

GitHub
YouTube YouTube
Telegram Telegram
Discord Discord