Filament•16mo ago

Issue with modal in actions

Hi, I'm building a table with a custom livewire component with table builder in a custom page. The problem is when I add a action in the table and i want to open a modal with a form to get data before exec the action. It doesn't open the modal. I link the Custom page and the visual-testing-baselines component files.

project-visual-tests...

VisualTestingBaselin...

visual-testing-basel...

Solution:

Returning all the fields and deleting the getTableQuery() function has already worked for me. ``` protected function getTableQuery(): Builder|Relation { if (!empty($this->project)) {...

Jump to solution

15 Replies

jals65OP•16mo ago

As you can see in the VisualTestingBaselines.php i'm adding the action by this way:

protected function getTableActions(): array
    {
        return [
            Action::make('duplicar')
                ->form([
                    TextInput::make('name')
                ])
                ->action(function ($record, $data,  VisualTestsServiceInterface $visualTestsService) {
                    Filament::notify('success', 'Baselines deleted');
                })
                ->requiresConfirmation()
        ];
    }

protected function getTableActions(): array
    {
        return [
            Action::make('duplicar')
                ->form([
                    TextInput::make('name')
                ])
                ->action(function ($record, $data,  VisualTestsServiceInterface $visualTestsService) {
                    Filament::notify('success', 'Baselines deleted');
                })
                ->requiresConfirmation()
        ];
    }

In other filament tables in the list record it works, but in a component in a custom page with table builder it doesn't works. Somebody can help me?

Vp•16mo ago

Hi, I've just check it out and it's working fine, my code is below

<?php

namespace App\Http\Livewire;

use App\Models\User as ModelsUser;
use Filament\Tables;
use Illuminate\Database\Eloquent\Builder;
use Livewire\Component;

class User extends Component implements Tables\Contracts\HasTable
{
    use Tables\Concerns\InteractsWithTable;

    protected function getTableQuery(): Builder
    {
        return ModelsUser::query();
    }

    protected function getTableColumns(): array
    {
        return [
            Tables\Columns\TextColumn::make('name'),
            Tables\Columns\TextColumn::make('email'),
        ];
    }

    protected function getTableActions(): array
    {
        return [
            Tables\Actions\Action::make('duplicar')
                ->action(function ($record, $data) {
                    dd($data);
                })
                ->requiresConfirmation(),
        ];
    }

    public function render()
    {
        return view('livewire.user');
    }
}

<?php

namespace App\Http\Livewire;

use App\Models\User as ModelsUser;
use Filament\Tables;
use Illuminate\Database\Eloquent\Builder;
use Livewire\Component;

class User extends Component implements Tables\Contracts\HasTable
{
    use Tables\Concerns\InteractsWithTable;

    protected function getTableQuery(): Builder
    {
        return ModelsUser::query();
    }

    protected function getTableColumns(): array
    {
        return [
            Tables\Columns\TextColumn::make('name'),
            Tables\Columns\TextColumn::make('email'),
        ];
    }

    protected function getTableActions(): array
    {
        return [
            Tables\Actions\Action::make('duplicar')
                ->action(function ($record, $data) {
                    dd($data);
                })
                ->requiresConfirmation(),
        ];
    }

    public function render()
    {
        return view('livewire.user');
    }
}

Ashk•16mo ago

You need to have <x-filament-actions::modals /> in your page component

jals65OP•16mo ago

That doesn't works.

Unable to locate a class or view for component [filament-actions::modals].

Unable to locate a class or view for component [filament-actions::modals].

The problem I see is as if the Actions themselves were broken. It must be due to a lack of some dependency or something because they are painted correctly but when I press they do nothing, as if the script that makes them work was missing. Even if I remove the modals, and leave only the action, it doesn't work, it doesn't execute the ->action()

Action::make('duplicar')
                ->action(function ($record, $data,  VisualTestsServiceInterface $visualTestsService) {
                    Filament::notify('success', 'Baselines deleted');
                })

Action::make('duplicar')
                ->action(function ($record, $data,  VisualTestsServiceInterface $visualTestsService) {
                    Filament::notify('success', 'Baselines deleted');
                })

Ashk•16mo ago

Are you using filament panel or you install table package without panel package ?

Ashk•16mo ago

If you use table outside of panel package, you should install https://filamentphp.com/docs/3.x/actions/installation

Installation - Actions - Filament

Ashk•16mo ago

Your error is clear, the component is missing Unable to locate a class or view for component [filament-actions::modals].

jals65OP•16mo ago

I'm in v2. Does that affect anything?

Ashk•16mo ago

ahhhhhhh probably, I don't know

jals65OP•16mo ago

I have this 2 packages: "filament/filament": "^2.0", "filament/forms": "^2.0",

awcodes•16mo ago

you shouldn't need both installed like that. 'filament/filament' installs all the packages.

jals65OP•16mo ago

Yes, I remove it. But the problem that I have with the actions in the custom table continues

jals65OP•16mo ago

I have debugged and I have seen that the action breaks here. vendor/filament/tables/src/Concerns/HasActions.php

jals65OP•16mo ago

I have solved the problem. The problem was caused because in the getTableQuery() I was not returning the key. That forced me to use the getTableRecordKey() function to set a new one. This meant that the actions could not take the Record.

Solution

jals65•16mo ago

Returning all the fields and deleting the getTableQuery() function has already worked for me.

protected function getTableQuery(): Builder|Relation
    {
        if (!empty($this->project)) {
            return VisualTestingBaseline::where(VisualTestingBaselineInterface::PROJECT, $this->project)->selectRaw('*, JSON_LENGTH(screenshots) AS num_screenshots');
        }

        return VisualTestingBaseline::query();
    }

protected function getTableQuery(): Builder|Relation
    {
        if (!empty($this->project)) {
            return VisualTestingBaseline::where(VisualTestingBaselineInterface::PROJECT, $this->project)->selectRaw('*, JSON_LENGTH(screenshots) AS num_screenshots');
        }

        return VisualTestingBaseline::query();
    }

Gaming

Programming

Issue with modal in actions