F
Filament•5d ago
Mombei

Table on livewire component is involuntarily refreshing component on Action

I have a filament Table in a livewire component, with a simple Action: 
public function table(Table $table): Table {
        return $table
            ->query(/**/)
            ->columns([/**/])
            ->recordAction('myAction')
            ->recordUrl(null)
            ->actions([
                Action::make('myAction')
                    ->action(fn(Model $record) => 
                    /* Here I've tried a couple things */
                    $this->dispatch(new SomeEvent($record->id)))
                    /* or */
                    event(new SomeEvent($record->id))
            ])
            ->striped();
public function table(Table $table): Table {
        return $table
            ->query(/**/)
            ->columns([/**/])
            ->recordAction('myAction')
            ->recordUrl(null)
            ->actions([
                Action::make('myAction')
                    ->action(fn(Model $record) => 
                    /* Here I've tried a couple things */
                    $this->dispatch(new SomeEvent($record->id)))
                    /* or */
                    event(new SomeEvent($record->id))
            ])
            ->striped();
I need to dispatch an event to let another livewire component on the page, containing an Infolist, know that a row has been clicked and that it should display data relevant to that row. However, it seems that clicking on the row or the action button resets the component completely. I noticed this since the component starts out hidden, and is displayed when it receives an event that's dispatched from a job queued by a third livewire component on the page containing a Form. Clicking any row hides the Table again, suggesting it's refreshing its $hidden property. Maybe it's wrong from a design standpoint in the first place? I'm just really lost
Solution:
I don't know what kind of trigger the action fires that causes the component to refresh
It's a Livewire request. Livewire components rerender on requests...
Jump to solution
4 Replies
Dennis Koch
Dennis Koch•5d ago
Can you explain that $hidden part and/or show some code?
Mombei
MombeiOP•5d ago
In the component: 
    private $hidden;

    public function mount(): void {
        $this->hidden = true;
    }

    #[On('echo:somechannel,SomeEvent')]
    public function displaySelf() {
        $this->hidden = false;
    }
    private $hidden;

    public function mount(): void {
        $this->hidden = true;
    }

    #[On('echo:somechannel,SomeEvent')]
    public function displaySelf() {
        $this->hidden = false;
    }
In the view: 
<div @class([
    'hidden' => $this->hidden,
])>
    {{ $this->table }}
</div>
<div @class([
    'hidden' => $this->hidden,
])>
    {{ $this->table }}
</div>
I've currently managed to keep the component from refreshing by saving a property that's being used in the table query with the #[Url] attribute I don't know what kind of trigger the action fires that causes the component to refresh, but with this at least it looks like I'm firing the event I wanted to fire: 
  Action::make('myAction')
    ->action(function (Model $record) {
      event(new SomeEvent($record->id));
    })
  Action::make('myAction')
    ->action(function (Model $record) {
      event(new SomeEvent($record->id));
    })
Though I don't know if this syntax changed anything from the arrow function, or the [#Url] attribute is what's making it work, it's honestly a mess
Dennis Koch
Dennis Koch•5d ago
It's a private property. Those aren't sent to the frontend so it will be reset when the component is rerendered.
Solution
Dennis Koch
Dennis Koch•5d ago
I don't know what kind of trigger the action fires that causes the component to refresh
It's a Livewire request. Livewire components rerender on requests

Did you find this page helpful?