Create a reusable Table Listing Livewire Component

Hi all,

I'm trying to create a reusable Filament Table using Livewire. I want to have this component 'TableListing' where I will pass it from my controller to a Livewire Component with parameters such as:
- The Form schema
- The Table columns
- The Model to query/update

So far i managed to do all that by calling something like

<livewire:table-listing :model="$jobModel" :columns="$jobColumns" :form="$jobForm" />

<livewire:table-listing :model="$jobModel" :columns="$jobColumns" :form="$jobForm" />

The listing works and the actions (on each row) work.
What does not work is the

headerActions

headerActions

where i have this:

                Tables\Actions\CreateAction::make()
                    ->model($this->model::class)
                    ->form($this->form)
                    ->slideOver()
                    ->color('info'),

                Tables\Actions\CreateAction::make()
                    ->model($this->model::class)
                    ->form($this->form)
                    ->slideOver()
                    ->color('info'),

The error comes AFTER i click on that header action. The error I get is invoked by the last line about the columns - which mind you it is working during the table listing rendering.

    public function table(Table $table): Table
    {
        return $table
            ->query($this->model::query())
            ->columns($this->columns)

    public function table(Table $table): Table
    {
        return $table
            ->query($this->model::query())
            ->columns($this->columns)

The exact error is:

Filament\Tables\Table::columns(): Argument #1 ($components) must be of type array, null given, called in [...]/laravel-base/app/Livewire/TableListing.php on line 37

Filament\Tables\Table::columns(): Argument #1 ($components) must be of type array, null given, called in [...]/laravel-base/app/Livewire/TableListing.php on line 37

So it seems that once the headerAction is clicked, a rerender is causing the

$this->columns

$this->columns

to be set to null. Also please keep in mind that I defined these variables as private as it seems passing these as public were not even being rendered :

    public $model;
    private $columns;
    private $form;

    public $model;
    private $columns;
    private $form;

Any ideas on this ? Thank you!

Create a reusable Table Listing Livewire Component

<livewire:table-listing :model="$jobModel" :columns="$jobColumns" :form="$jobForm" />

<livewire:table-listing :model="$jobModel" :columns="$jobColumns" :form="$jobForm" />

The listing works and the actions (on each row) work.
What does not work is the

headerActions

headerActions

where i have this:

                Tables\Actions\CreateAction::make()
                    ->model($this->model::class)
                    ->form($this->form)
                    ->slideOver()
                    ->color('info'),

                Tables\Actions\CreateAction::make()
                    ->model($this->model::class)
                    ->form($this->form)
                    ->slideOver()
                    ->color('info'),

The error comes AFTER i click on that header action. The error I get is invoked by the last line about the columns - which mind you it is working during the table listing rendering.

    public function table(Table $table): Table
    {
        return $table
            ->query($this->model::query())
            ->columns($this->columns)

    public function table(Table $table): Table
    {
        return $table
            ->query($this->model::query())
            ->columns($this->columns)

The exact error is:

Filament\Tables\Table::columns(): Argument #1 ($components) must be of type array, null given, called in [...]/laravel-base/app/Livewire/TableListing.php on line 37

Filament\Tables\Table::columns(): Argument #1 ($components) must be of type array, null given, called in [...]/laravel-base/app/Livewire/TableListing.php on line 37

So it seems that once the headerAction is clicked, a rerender is causing the

$this->columns

$this->columns

to be set to null. Also please keep in mind that I defined these variables as private as it seems passing these as public were not even being rendered :

    public $model;
    private $columns;
    private $form;

    public $model;
    private $columns;
    private $form;

Any ideas on this ? Thank you!

Create a reusable Table Listing Livewire Component

Similar Threads

Create a reusable Table Listing Livewire Component

Similar Threads

Similar Threads

Similar Threads