V4 Custom Page with Custom Data Table

Hey all,

I'm working on a project where I'm trying to use the V4 beta of Filament to display a table based on API data. I'm running into some issues where it looks to be trying to load relations from the response collection even though the items are not models and its not associated with a resource.

Here is my custom page / table implementation:

<?php

declare(strict_types=1);

namespace App\Filament\Pages;

use App\Actions\People\ListPeople as ListPeopleAction;
use BackedEnum;
use Filament\Pages\Page;
use Filament\Support\Icons\Heroicon;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Concerns\InteractsWithTable;
use Filament\Tables\Contracts\HasTable;
use Filament\Tables\Table;
use Illuminate\Support\Collection;

class ListPeople extends Page implements HasTable
{
    use InteractsWithTable;

    protected string $view = 'filament.pages.list-people';

    protected static ?string $slug = 'people';

    protected static string|null|BackedEnum $navigationIcon = Heroicon::OutlinedUsers;

    protected static ?string $navigationLabel = 'People';

    protected static ?string $title = 'People';

    public function table(Table $table): Table
    {
        return $table
            ->records(function (
                int $page,
                int $recordsPerPage,
            ): Collection {
                return ListPeopleAction::make()->handle(
                    asUser: auth()->user(),
                    page: $page,
                    recordsPerPage: $recordsPerPage,
                )->collect('data.people')
                    ->pluck('person', 'person.uuid');
            })
            ->columns([
                TextColumn::make('uuid'),
                TextColumn::make('first_name'),
                TextColumn::make('last_name'),
                TextColumn::make('email'),
                TextColumn::make('phone'),
                TextColumn::make('created_at'),
            ]);
    }
}

<?php

declare(strict_types=1);

namespace App\Filament\Pages;

use App\Actions\People\ListPeople as ListPeopleAction;
use BackedEnum;
use Filament\Pages\Page;
use Filament\Support\Icons\Heroicon;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Concerns\InteractsWithTable;
use Filament\Tables\Contracts\HasTable;
use Filament\Tables\Table;
use Illuminate\Support\Collection;

class ListPeople extends Page implements HasTable
{
    use InteractsWithTable;

    protected string $view = 'filament.pages.list-people';

    protected static ?string $slug = 'people';

    protected static string|null|BackedEnum $navigationIcon = Heroicon::OutlinedUsers;

    protected static ?string $navigationLabel = 'People';

    protected static ?string $title = 'People';

    public function table(Table $table): Table
    {
        return $table
            ->records(function (
                int $page,
                int $recordsPerPage,
            ): Collection {
                return ListPeopleAction::make()->handle(
                    asUser: auth()->user(),
                    page: $page,
                    recordsPerPage: $recordsPerPage,
                )->collect('data.people')
                    ->pluck('person', 'person.uuid');
            })
            ->columns([
                TextColumn::make('uuid'),
                TextColumn::make('first_name'),
                TextColumn::make('last_name'),
                TextColumn::make('email'),
                TextColumn::make('phone'),
                TextColumn::make('created_at'),
            ]);
    }
}

<?php

declare(strict_types=1);

namespace App\Filament\Pages;

use App\Actions\People\ListPeople as ListPeopleAction;
use BackedEnum;
use Filament\Pages\Page;
use Filament\Support\Icons\Heroicon;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Concerns\InteractsWithTable;
use Filament\Tables\Contracts\HasTable;
use Filament\Tables\Table;
use Illuminate\Support\Collection;

class ListPeople extends Page implements HasTable
{
    use InteractsWithTable;

    protected string $view = 'filament.pages.list-people';

    protected static ?string $slug = 'people';

    protected static string|null|BackedEnum $navigationIcon = Heroicon::OutlinedUsers;

    protected static ?string $navigationLabel = 'People';

    protected static ?string $title = 'People';

    public function table(Table $table): Table
    {
        return $table
            ->records(function (
                int $page,
                int $recordsPerPage,
            ): Collection {
                return ListPeopleAction::make()->handle(
                    asUser: auth()->user(),
                    page: $page,
                    recordsPerPage: $recordsPerPage,
                )->collect('data.people')
                    ->pluck('person', 'person.uuid');
            })
            ->columns([
                TextColumn::make('uuid'),
                TextColumn::make('first_name'),
                TextColumn::make('last_name'),
                TextColumn::make('email'),
                TextColumn::make('phone'),
                TextColumn::make('created_at'),
            ]);
    }
}

<?php

declare(strict_types=1);

namespace App\Filament\Pages;

use App\Actions\People\ListPeople as ListPeopleAction;
use BackedEnum;
use Filament\Pages\Page;
use Filament\Support\Icons\Heroicon;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Concerns\InteractsWithTable;
use Filament\Tables\Contracts\HasTable;
use Filament\Tables\Table;
use Illuminate\Support\Collection;

class ListPeople extends Page implements HasTable
{
    use InteractsWithTable;

    protected string $view = 'filament.pages.list-people';

    protected static ?string $slug = 'people';

    protected static string|null|BackedEnum $navigationIcon = Heroicon::OutlinedUsers;

    protected static ?string $navigationLabel = 'People';

    protected static ?string $title = 'People';

    public function table(Table $table): Table
    {
        return $table
            ->records(function (
                int $page,
                int $recordsPerPage,
            ): Collection {
                return ListPeopleAction::make()->handle(
                    asUser: auth()->user(),
                    page: $page,
                    recordsPerPage: $recordsPerPage,
                )->collect('data.people')
                    ->pluck('person', 'person.uuid');
            })
            ->columns([
                TextColumn::make('uuid'),
                TextColumn::make('first_name'),
                TextColumn::make('last_name'),
                TextColumn::make('email'),
                TextColumn::make('phone'),
                TextColumn::make('created_at'),
            ]);
    }
}

Solution

Actually I just figured this out... if any field that is returned is null, it tries to find it via a relationship. My workaround for this is to set the state to an empty string.

Jump to solution

V4 Custom Page with Custom Data Table

Similar Threads

Similar Threads

Similar Threads