Detail Row expand/collapse does not work when triggered through an action button

[umar-zealtouch]

Livewire PowerGrid version

v6.6.2

Livewire version

v3.6.4

Laravel version

v10

Which PHP version are you using?

PHP 8.2

Which Theme are you using?

Bootstrap 5

Have you published the resource files and customized them? (php artisan vendor:publish)

Yes

What is the problem?

The Detail Row feature works correctly when expanding/collapsing by clicking the arrow icon. However, when attempting to expand/collapse a row from a custom action button, it does not work.

This issue also reproduces in the official demo code.

Code snippets

namespace App\Livewire\Examples\DetailTable;

use App\Models\User;
use Illuminate\Database\Eloquent\Builder;
use Illuminate\Support\Carbon;
use PowerComponents\LivewirePowerGrid\Button;
use PowerComponents\LivewirePowerGrid\Column;
use PowerComponents\LivewirePowerGrid\Facades\PowerGrid;
use PowerComponents\LivewirePowerGrid\Facades\Rule;
use PowerComponents\LivewirePowerGrid\PowerGridComponent;
use PowerComponents\LivewirePowerGrid\PowerGridFields;

final class DetailTable extends PowerGridComponent
{
    public string $tableName = 'detail-table';

    public function setUp(): array
    {
        return [
            PowerGrid::header()
                ->showToggleColumns()
                ->showSearchInput(),

            PowerGrid::footer()
                ->showPerPage()
                ->showRecordCount(),

            PowerGrid::detail()
                ->view('components.detail')
                ->showCollapseIcon()
                ->params(['name' => 'Luan']),
        ];
    }

    public function datasource(): ?Builder
    {
        return User::query();
    }

    public function fields(): PowerGridFields
    {
        return PowerGrid::fields()
            ->add('id')
            ->add('name')
            ->add('email')
            ->add('created_at')
            ->add('created_at_formatted', fn ($user) => Carbon::parse($user->created_at)->format('d/m/Y H:i:s'));
    }

    public function columns(): array
    {
        return [
            Column::make('ID', 'id'),

            Column::make('Name', 'name')
                ->sortable()
                ->searchable(),

            Column::make('Email', 'email')
                ->sortable()
                ->searchable(),

            Column::make('Created At', 'created_at_formatted', 'created_at')
                ->searchable()
                ->sortable(),

            Column::action('Action'),
        ];
    }

    public function actions($row): array
    {
        return [
            Button::add('detail')
                ->slot('Detail')
                ->class('btn btn-primary btn-sm')
                ->toggleDetail($row->id),
        ];
    }

    public function actionRules(): array
    {
        return [
            Rule::rows()
                ->when(fn ($user) => $user->id == 1)
                ->detailView('components.detail-rules', ['test' => 1]),
        ];
    }
} 

How do you expect it to work?

Clicking a custom action button should expand/collapse the Detail Row in the same way as clicking the arrow.

Please confirm (incomplete submissions will not be addressed)

• I have provided easy and step-by-step instructions to reproduce the bug.
• I have provided code samples as text and NOT images.
• I understand my bug report will be removed if I haven't met the criteria above.

[davidtim]

I have the same problem after update to version 6.6.2. I also notice that the there is no loading when click arrow down.

this is what my work around.

#[On('testing-edit')]
    public function testingEvent(string $rowId): void
    {
        $this->dispatch('pg-toggle-detail-' . $this->tableName . '-hidden-all');
        $this->dispatch('pg-toggle-detail-' . $this->tableName . '-' . $rowId, null);
    }
    public function actions(Person $row): array
    {
        return [
            Button::add('edit')
                ->id($row->id)
                ->slot('Edit')
                ->dispatch('testing-edit', ['rowId' => $row->id])
                ->class('pg-btn-white btn btn-primary')

        ];
    }

[MrYamous]

Last release provides a fix for this bug