Skip to content

Instantly share code, notes, and snippets.

@MACscr
Last active September 26, 2023 04:23
Show Gist options
  • Save MACscr/baaeeddbfe39c85840410c66257596ae to your computer and use it in GitHub Desktop.
Save MACscr/baaeeddbfe39c85840410c66257596ae to your computer and use it in GitHub Desktop.
Standalone Filament Table Tabs
# resources/views/components/filament-table-tabs.blade.php
@if (count($tabs = $this->getTabs()))
<div class="flex justify-center">
<x-filament::tabs>
@foreach ($tabs as $tabKey => $tab)
@php
$activeTab = strval($activeTab);
$tabKey = strval($tabKey);
@endphp
<x-filament::tabs.item
:wire:click="'$set(\'activeTab\', ' . (filled($tabKey) ? ('\'' . $tabKey . '\'') : 'null') . ')'"
:active="$activeTab === $tabKey"
:badge="$tab->getBadge()"
:icon="$tab->getIcon()"
:icon-color="$tab->getIconColor()"
:icon-position="$tab->getIconPosition()"
>
{{ $tab->getLabel() ?? $this->generateTabLabel($tabKey) }}
</x-filament::tabs.item>
@endforeach
</x-filament::tabs>
</div>
@endif
<?php
# App\Http\Livewire\Traits\FilamentTableTabs
namespace App\Http\Livewire\Traits;
trait FilamentTableTabs
{
public ?string $activeTab = null;
public function tableTabsMount(): void
{
if (blank($this->activeTab)) {
$this->activeTab = array_key_first($this->getTabs());
}
}
protected function modifyTabbedQuery($query): void
{
$tabs = $this->getTabs();
if (
filled($this->activeTab) &&
array_key_exists($this->activeTab, $tabs)
) {
$tabs[$this->activeTab]->modifyQuery($query);
}
}
public function updatedActiveTab(): void
{
$this->resetPage();
}
public function getTabs(): array
{
return [];
}
public function generateTabLabel(string $key): string
{
return (string) str($key)
->replace(['_', '-'], ' ')
->ucfirst();
}
}
# resources/views/livewire/users-table.blade.php
<div>
<div class="w-full space-y-6">
<x-filament-table-tabs :tabs="$this->getTabs()" :activeTab="$activeTab"/>
{{ $this->table }}
</div>
<x-filament-actions::modals/>
</div>
<?php
#######
use App\Http\Livewire\Traits\FilamentTableTabs;
# app/Http/Livewire/UsersTable.php
class UsersTable extends Component implements HasForms, HasTable
{
use FilamentTableTabs;
protected $queryString = [
'activeTab' => ['except' => 'all'],
];
public function mount(): void
{
$this->tableTabsMount();
}
public function getTabs(): array
{
return [
'all' => Tab::make(),
'active' => Tab::make()
->modifyQueryUsing(fn (Builder $query) => $query->whereNull('deactivated')),
'inactive' => Tab::make()
->modifyQueryUsing(fn (Builder $query) => $query->whereNotNull('deactivated')),
];
}
public function table(Table $table): Table
{
return $table
->query(User::query())
// Just add this monifier to your table()
->modifyQueryUsing(fn (Builder $query) => $this->modifyTabbedQuery($query))
.......
;
########
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment