Table action to open url in new tab (asynchronous)

Hi,

In my app, I have a ressource that represents servers, with a table action that allows the user to login to this server's control panel through a specially crafted url. I want the url to be opened in a new browser/tab/window.

The url is generated through an API that is quite slow. Generating the url for each server in a table is therefore unpractical. This is therefore not a solution:

Action::make('login')->url(function ($record) { return $record->loginUrl()})->openUrlInNewTab();

Action::make('login')->url(function ($record) { return $record->loginUrl()})->openUrlInNewTab();

In filament v2, I had resorted to a dirty trick:
- Create a custom action in the Resources/ServerResource/ListServer.php. This action generates the url and emits/dispatch a livewire event "openinnewtab" with the url as parameter
- Add a global livewire listener through a small js file included on all pages:

Livewire.on('openInNewTab', url => {
    window.open(url, '_blank');
})

Livewire.on('openInNewTab', url => {
    window.open(url, '_blank');
})

This worked well, but didn't look good. After upgrading to v3, I had to change the way the file is loaded (now using the FilamentAsset facade), and now the listener throws the error in the browser:

[Error] ReferenceError: Can't find variable: Livewire

This is probably due to a change in which the files are loaded, but it triggers me to find a better way of doing the whole thing. Has anyone any idea on how to have Filament call $record->loginUrl() asynchronously?

Thanks heaps,

Solution

Feels, hacky to me too, but sometimes that's just what we have to do.

Jump to solution

Filament•3y ago•

5 replies

fblaser

Table action to open url in new tab (asynchronous)

Action::make('login')->url(function ($record) { return $record->loginUrl()})->openUrlInNewTab();

Action::make('login')->url(function ($record) { return $record->loginUrl()})->openUrlInNewTab();

Livewire.on('openInNewTab', url => {
    window.open(url, '_blank');
})

Livewire.on('openInNewTab', url => {
    window.open(url, '_blank');
})

Solution

Feels, hacky to me too, but sometimes that's just what we have to do.

Jump to solution

Table action to open url in new tab (asynchronous)

Table action to open url in new tab (asynchronous)

Similar Threads

Similar Threads

Similar Threads