F
Filament•2mo ago
Jap

Reverb in Filament Tables

Instead of polling, How can i trigger an event to reload a specific table of a resource to reload ? I tried to register a script in AppServiceProvider and im having difficulty in getting the table component then refresh the component at the script. Is there is a better way to do this? Thanks.
Solution:
Got the solution instead of finding the table in the javascript i added listener in ListPage or any livewire component files for example: ``` class ListTransactions extends ListRecords { protected static string $resource = TransactionResource::class;...
Jump to solution
7 Replies
Matthew
Matthew•2mo ago
Pretty sure it can be done via livewire (You dont need reverb/websockets). Try the following: In your class file (where the table is): 
    #[On('event_name')]
    public function updatePostList($message): void
    {
        if ($message) {
            $this->resetTable();
        }
    }
    #[On('event_name')]
    public function updatePostList($message): void
    {
        if ($message) {
            $this->resetTable();
        }
    }
You can fire this event from anywhere 
  $this->dispatch('event_name', message: true);
  $this->dispatch('event_name', message: true);
Jap
JapOP•2mo ago
Thanks for that, but at this case i want other users table in that same page is reloaded that's why i am trying to use reverb/websockets.
Matthew
Matthew•2mo ago
Ohhhh, yeah, then indeed you would have to use websockets. Not sure how you do that though. My guess is you follow the guide on how to set up Reverb/websockets, and whenever you fire the event you run $this->resetTable()
Jap
JapOP•2mo ago
I made reverb running by using this line of code in AppServiceProvider: 
use Filament\Support\Assets\Js;
use Filament\Support\Facades\FilamentAsset;
use Illuminate\Support\Facades\Vite;

FilamentAsset::register([
    Js::make('reverb', Vite::asset('resources/js/reverb.js'))->module(),
])
use Filament\Support\Assets\Js;
use Filament\Support\Facades\FilamentAsset;
use Illuminate\Support\Facades\Vite;

FilamentAsset::register([
    Js::make('reverb', Vite::asset('resources/js/reverb.js'))->module(),
])
At reverb.js the problem was finding the table at echo channel like this: 
const table = //find the livewire table
if (table) {
     // Trigger the Livewire 'refresh' method
}
const table = //find the livewire table
if (table) {
     // Trigger the Livewire 'refresh' method
}
Matthew
Matthew•2mo ago
Assuming you have setup reverb correctly 
this.$wire.resetTable();
this.$wire.resetTable();
in JS
Jap
JapOP•2mo ago
Hmm, i think that will affect all tables in any page? Just want to trigger it on a specific table .
Solution
Jap
Jap•2mo ago
Got the solution instead of finding the table in the javascript i added listener in ListPage or any livewire component files for example: 
class ListTransactions extends ListRecords
{
    protected static string $resource = TransactionResource::class;

    protected $listeners = [
        'echo:channel-name,EventName' => '$refresh',
    ];
}
class ListTransactions extends ListRecords
{
    protected static string $resource = TransactionResource::class;

    protected $listeners = [
        'echo:channel-name,EventName' => '$refresh',
    ];
}
Then you can dispatch/broadcast events in actions like: 
use App\Events\EventName;
 Tables\Actions\RestoreAction::make()
                        ->after(function ($record) {
                            EventName::dispatch();
                        }),
use App\Events\EventName;
 Tables\Actions\RestoreAction::make()
                        ->after(function ($record) {
                            EventName::dispatch();
                        }),

Did you find this page helpful?