[aleRibeiro0209]

⚡ PowerGrid - Pull Request

• Bug fix
• Enhancement
• New feature
• Breaking change

Description

Fixes row action buttons disappearing after pagination (and any other Livewire
update, e.g. sort/search/filter) on Livewire 4.4.2+. The action column header
stays, but the buttons vanish from every row starting on page 2.

Root cause: in v6 the per-row actions are injected client-side.
dispatchActionsToJS() pushes the action HTML through $this->js('pgActions', …),
which the support-livewire-v4 script stores in a global window['pgActions_' + id].
Each row renders them with x-html="toHtml", and toHtml() reads that global.
Because the global is not an Alpine-reactive dependency, x-html is evaluated only
once — when Alpine initializes the morphed node. Livewire 4.4.2 ("Close asynchronous
morph timing gaps") reordered the morph so Alpine now evaluates toHtml() before
the $this->js('pgActions') effect refreshes the global. The stale global has no
entry for the new page's row ids, so toHtml() returns an empty string and the
buttons disappear.

Fix: re-render the actions once the fresh data lands, independent of the
morph / JS-effect ordering:

• support-livewire-v4.blade.php dispatches a pg:actions-updated window event
  right after refreshing window['pgActions_*'] / window['pgActionsHeader_*'].
• pgRenderActions gains a reactive renderTick counter, incremented by a
  pg:actions-updated listener (registered in init(), cleaned up in destroy()).
  toHtml() now reads renderTick, so Alpine re-evaluates the x-html binding as
  soon as the up-to-date action data is available.

Behavior is unchanged on the initial page load and on Livewire < 4.4.2 — the fix
only adds a re-render trigger that morph timing used to supply incidentally.

Example (unchanged usage, now correct across pages):

public function actions(Dish $row): array
{
    return [
        Button::add('edit')->slot('Edit')->dispatch('edit', ['rowId' => $row->id]),
        Button::add('delete')->slot('Delete')->dispatch('delete', ['rowId' => $row->id]),
    ];
}

Files changed:

• resources/js/components/pg-render-actions.js
• resources/views/components/support-livewire-v4.blade.php
• dist/powergrid.js (rebuilt bundle)

Verified with a Livewire 4.4.5 + Tailwind reproduction (120 rows / 10 per page):
action buttons went from 20 → 0 on page 2 before the fix, and 20 → 20 after.

Related Issue(s):

Closes #2141

Documentation

This PR requires Documentation update?

• Yes
• No
• I have already submitted a Documentation pull request.

[luanfreitasdev]

Thanks for the fix—you're on the right track for the Livewire 4.4.2+ bug.

I have one point that needs adjustment before merging:

1. Global event without instance scoping
   Currently, it fires globally, and every component on the page listens for this event. On pages with multiple tables, any grid update triggers an increment across all the others, causing unnecessary re-renders across instances.

Suggestion:

• Fire the event with an ID (or use an event name suffixed with the ID).
• In the listener, ignore events that do not match the current instance.

2. Lack of coverage for the multiple-grid scenario
   Since the fix relies on a global event/listener, it would be important to add a test (or reproduction case) with two PowerGrid components on the same page to validate that only the updated grid re-renders its actions.

With this adjustment, the solution will be robust for Livewire 3/4 in version 6.x.