Filament Notifications and `wire:navigate`

Hi! Quick question, maybe someone had this issue before, can find anything about it. Here is what's up...

// in root layout /layouts/app.blade.php
<livewire:notifications />

// two routes using standard Livewire components
Route::get('/goals', ListGoals::class);
Route::get('/goals/{goal}', ViewGoal::class);

// List Goals component and the create action look like
class ListGoals extends Component implements HasForms, HasActions
{
    use InteractsWithActions;
    use InteractsWithForms;

    #[Computed]
    public function goals(): Collection
    {
        return auth()->user()->goals;
    }

    public function createAction(): CreateAction
    {
        return CreateAction::make()
            ->model(Goal::class)
            ->form(GoalForm::schema())
            ->mutateFormDataUsing(function (array $data) {
                $data['user_id'] = auth()->id();
                return $data;
            });
    }

    // ... 
}

// in root layout /layouts/app.blade.php
<livewire:notifications />

// two routes using standard Livewire components
Route::get('/goals', ListGoals::class);
Route::get('/goals/{goal}', ViewGoal::class);

// List Goals component and the create action look like
class ListGoals extends Component implements HasForms, HasActions
{
    use InteractsWithActions;
    use InteractsWithForms;

    #[Computed]
    public function goals(): Collection
    {
        return auth()->user()->goals;
    }

    public function createAction(): CreateAction
    {
        return CreateAction::make()
            ->model(Goal::class)
            ->form(GoalForm::schema())
            ->mutateFormDataUsing(function (array $data) {
                $data['user_id'] = auth()->id();
                return $data;
            });
    }

    // ... 
}

So when I use the action to create a goal, the notification shows correctly, the component re-renders the goals, I use a link to the view goal route that has wire:navigate on it...

<a href="{{ route('goals.show', $goal) }}" wire:navigate class="block">...</a>

<a href="{{ route('goals.show', $goal) }}" wire:navigate class="block">...</a>

When the view component renders, the notification disappears, then I would go back, and the same "Goal created" notification shows.

1 Reply

reppairOP•2mo ago

I've spent some more time on this experimenting... no luck

Gaming

Programming

Filament Notifications and `wire:navigate`