Todo sobre la nueva versión de FilamentPHP

Alex Six, parte del equipo de relaciones de FilamentPHP recientemente a publicado un post acerca de la nueva versión 4.x de FilamentPHP. Parece que todo el equipo esa muy emocionado (igual que yo) ya que esta nueva versión agrega un montón de características solicitadas por la comunidad de Laravel.

Hace 1 año y medio que se público la versión 3 de Filament, una versión que podríamos decir que lo cambio todo, agrego el concepto de paneles, se les dió más facilidad a la creación de plugins y extensión de funcionalidades, agrego una nueva manera de trabajar con iconos, agrego páginas predefinidas de autenticación y extendió el concepto de acciones, así como agregar una nueva características, los infolist.

La vara esta alta con el anuncio de esta nueva versión de FilamentPHP y estoy muy emocionado de probar la versión Beta que será lanzada el 10 de Junio de 2025.

Recursos anidados

El concepto es simple, recursos dentro de recursos, muchas veces tenemos relaciones que no pueden ser representadas con relation managers, los nested resources llegaron para representar este tipo de relaciones, ejemplo imagina que tienes un recurso de Cursos, cada curso tiene n lecciones, actualmente en FilamentPHP 3 tendrías que crear un recurso para cada uno, y conectarlo mediante filtros, con la llegada de los recursos será más fácil e intuitivo crear administradores para este tipo de ejemplos,

tu estructura de carpetas podría llegar a verse así

• Filament/
  • Resources/
    • CourseResource/
      • Pages/
        • ...
      • Resources/
        • LessonResource/
          • Pages/
            • ...
        • LessonResource.php
    • CourseResource.php

Esto abre un mundo de posibilidades y mejorará la estructura de nuestros proyectos enormemente.

Doble Factor de Autenticación

Conforme a avanzado internet también han avanzado las amenazas, es por eso que el equipo de FilamentPHP considera vital contar con Doble Factor de Autenticación. En la nueva versión podrás activar facilmente desde tu panel service provider. Podrás activarlo con Google Authenticator o mediante contraseña de un solo uso enviada desde correo:

use Filament\Panel;

public function panel(Panel $panel): Panel
{
    return $panel
        ->id('admin')
        ->requiresMultiFactorAuthentication();
}

Información estática

Dede hace tiempo la comunidad de Filament ha solicitado poder usar los resources para información estática, por ejemplo de un archivo json, csv o inclusive un array, habitualmente esto se hacía con Sushi/Sushi y funciona bastante bien, pero al parecer no tan bien en todas las situaciones.

En la nueva versión podrás usar el método records() para añadir tus propios registros en la tabla:

use Filament\Tables\Columns\IconColumn;
use Filament\Tables\Columns\TextColumn;
use Filament\Tables\Table;

public function table(Table $table): Table
{
    return $table
        ->records(fn (): array => [
            1 => [
                'title' => 'First item',
                'slug' => 'first-item',
                'is_featured' => true,
            ],
            2 => [
                'title' => 'Second item',
                'slug' => 'second-item',
                'is_featured' => false,
            ],
            3 => [
                'title' => 'Third item',
                'slug' => 'third-item',
                'is_featured' => true,
            ],
        ])
        ->columns([
            TextColumn::make('title'),
            TextColumn::make('slug'),
            IconColumn::make('is_featured')
                ->boolean(),
        ]);
}

Hay muchas implicaciones acerca de esta funcionalidad y hay mucho trabajo manual que se tiene que hacer, por ejemplo para definir el state de las columnas, filtrar, ordernar y buscar, al parecer tendrás que implementar las funcionalidades por tu cuenta.

Unificación de Esquemas y Acciones

Un cambio importante es la unificación de todos los componentes y utilidades de Filament\Forms y Filament\Infolists y esto debido a que son muy parecidos. No he encontrado mucha información acerca de esto, pero al parecer ahora podrás combinar componentes de ambos tipos.

En el código de la v4 parece que agregaron un nuevo tipo de componentes, los Schema donde se mezclaran los Filament\Forms y Filament\Infolists permitiendo añadir interfaces, botones, infolists, fields, de una manera sencilla.

Aquí se incluyen los Prime components los cuales son componentes primitivos útiles para añadir información a tus formularios, infolists o tablas, entre los componentes se encuentran:

• Text
• Icon
• Image
• Unordered list

Con la opción de crear tus propios componentes.

Un ejemplo de como utilizar estos prime components:

use Filament\Actions\Action;
use Filament\Schemas\Components\Image;
use Filament\Schemas\Components\Section;
use Filament\Schemas\Components\Text;
use Filament\Schemas\Components\UnorderedList;
use Filament\Support\Enums\FontWeight;
use Filament\Support\Enums\TextSize;

$schema
    ->components([
        Text::make('Scan this QR code with your authenticator app:')
            ->color('neutral'),
        Image::make(
            url: asset('images/qr.jpg'),
            alt: 'QR code to scan with an authenticator app',
        )
            ->imageHeight('12rem')
            ->alignCenter(),
        Section::make()
            ->schema([
                Text::make('Please save the following recovery codes in a safe place. They will only be shown once, but you\'ll need them if you lose access to your authenticator app:')
                    ->weight(FontWeight::Bold)
                    ->color('neutral'),
                UnorderedList::make(fn (): array => array_map(
                    fn (string $recoveryCode): Text => Text::make($recoveryCode)
                        ->copyable()
                        ->fontFamily(FontFamily::Mono)
                        ->size(TextSize::ExtraSmall)
                        ->color('neutral'),
                    ['tYRnCqNLUx-3QOLNKyDiV', 'cKok2eImKc-oWHHH4VhNe', 'C0ZstEcSSB-nrbyk2pv8z', '49EXLRQ8MI-FpWywpSDHE', 'TXjHnvkUrr-KuiVJENPmJ', 'BB574ookll-uI20yxP6oa', 'BbgScF2egu-VOfHrMtsCl', 'cO0dJYqmee-S9ubJHpRFR'],
                ))
                    ->size(TextSize::ExtraSmall),
            ])
            ->compact()
            ->secondary(),
    ])

Mejora en el rendimiento

El equipo de FilamentPHP ha trabajado arduamente para mejorar el rendimiento de la base de código del proyecto. Reduciendo y practicamente eliminando todos los cuellos de botella que encontraron.

Anuncian este cambio como una mejora MASIVA.

Anunciaran más adelante todos los detalles técnicos acerca de esta mejora, pero aseguran que una vez pruebes la versión 4, entenderás a lo que se refieren.

Fecha de lanzamiento

Se lanzará una versión Beta durante Laravel Live UK que se celebrá el 10 de Junio de 2025. Es importante que esta es una versión Beta, por lo que aún no se recomienda usar en producción, aunque el equipo de FilamentPHP trabaja con bastante velocidad y estoy seguro que tendremos una versión estable muy pronto.

Hasta el momento es todo lo que se ha anunciado, el código de la versión v4 ya esta disponible en GitHub y puedes darle un vistazo como lo hice yo para añadir los ejemplos que viste, sin embargo no quiero publicar todo lo que vi en el repositorio para dejar la sorpresa pública para el anuncio en Laravel Live UK, espero te haya servido esta publicación y estes igual de ansioso que yo por la nueva versión.