Everything about the Filament v4 Beta Release: Nested Resources, Multi-Factor Authentication, and Much More
4 min read

Everything about the Filament v4 Beta Release: Nested Resources, Multi-Factor Authentication, and Much More

728 words

The Filament team has announced exciting details about the upcoming Filament v4 Beta release, and it’s undoubtedly the most anticipated version to date. Filament v4 is the largest and most feature-packed release Filament has ever had, surpassing even the massive v3 that required over 100 minor versions.

Most Notable Features of Filament v4

Nested Resources

One of the longest-standing community requests is finally becoming reality. Nested resources allow you to operate on a Filament resource within the context of a parent resource.

Practical example: In a learning management system, you’d have a CourseResource for your Course model. Within a course, you’d also have many related Lesson objects. Previously in v3, you could only edit Lesson records through a modal within the CourseResource. Now, with v4, you can edit a Lesson in the context of its related Course, but on a full page.

Creating a nested resource is simple: use the make:filament-resource command as you would to create a normal resource, but add the –nested flag.

php artisan make:filament-resource LessonResource --nested

Built-in Multi-Factor Authentication (MFA)

Multi-factor authentication is considered almost a necessity in the modern era of application authentication, and Filament v4 includes it out of the box.

MFA Features:

  • App authentication: Compatible with Google Authenticator, Authy, or Microsoft Authenticator
  • Email authentication: Sending one-time codes to email
  • Automatic configuration: Just enable the system and Filament does the work for you
use Filament\Auth\MultiFactor\App\AppAuthentication;
use Filament\Auth\MultiFactor\Email\EmailAuthentication;

public function panel(Panel $panel): Panel
{
    return $panel
        ->multiFactorAuthentication([
            AppAuthentication::make(),
            EmailAuthentication::make()->codeExpiryMinutes(2),
        ], isRequired: true);
}

Tables with Static Data

Another revolutionary change: Filament tables can now take static data not backed by models and display it with all the same features you know and love.

Previously, the recommendation was to create a “Model” backed by Sushi, but this didn’t work in all situations. Now it’s as simple as passing an array of data to the records() method:

Table::make()
    ->records([
        ['name' => 'Juan', 'email' => 'juan@example.com'],
        ['name' => 'María', 'email' => 'maria@example.com'],
    ])
    ->columns([
        TextColumn::make('name'),
        TextColumn::make('email'),
    ]);

Performance and User Experience Improvements

Partial Rendering

With partial rendering in Filament v4, only the specific part of the form that needs updating is refreshed, providing a smoother and faster user experience.

Enhanced Heroicons

The new Heroicon enum class provides IDE autocomplete to help you quickly find the icon you need, no more magic strings. Each icon is available in solid and outlined variants.

use Filament\Support\Enums\Heroicon;

// Before
->icon('heroicon-o-star')

// Now
->icon(Heroicon::OutlinedStar)

Unified Schemas and Flexibility

Server-Driven UI Schema System

Schemas form the basis of Filament’s Server-Driven UI approach. They allow you to build user interfaces in PHP using structured configuration objects.

Available components:

  • Form fields
  • Infolist entries
  • Layout components
  • Core components like text and buttons

New Components

Code Editor: Allows users to write and edit code directly in the interface, supporting HTML, CSS, JavaScript, PHP, and JSON.

Slider Component: Allows users to select one or more numeric values by dragging a handle along a track, ideal for ranges, ratings, or percentages.

Table Repeaters: Display repeater items in a table layout using defined columns.

Global Timezone Configuration

The new FilamentTimezone facade allows you to set a default timezone for Filament globally, simplifying default configuration across multiple components like DateTimePicker, TextColumn, and TextEntry.

FilamentTimezone::set('Europe/Madrid');

Accessibility Improvements

Filament v4 takes accessibility seriously with:

  • Dynamic labels: Adjust based on schema depth
  • Color contrast management: Using OKLCH colors to meet WCAG guidelines
  • Container Queries: New CSS feature that allows elements to respond to their parent container’s size

Tailwind CSS v4 Support

Tailwind CSS v4 is a major update focused on performance, flexibility, and modern web standards, with a revamped configuration system and faster builds.

When Will It Be Available?

While the team hasn’t given an exact date, the beta is expected to be available “in the near future” according to the official announcement. The team has confirmed they’re working on final launch details.

Conclusion

Filament v4 promises to be a quantum leap in functionality and developer experience. With native nested resources, built-in multi-factor authentication, static data support in tables, and significant performance improvements, this version will further solidify Filament as the go-to tool for building admin panels in Laravel.

The combination of powerful new features with user experience improvements makes Filament v4 a must-have upgrade for any Laravel developer working with admin interfaces.

Are you excited about these new features? Share your thoughts on which Filament v4 feature you’re most looking forward to!

Comments

Latest Posts

7 min

1313 words

The Filament v4 Beta has officially arrived, and it’s undoubtedly the most ambitious and comprehensive update in this framework’s history. After exploring in detail all the new features, I can confidently say that this version represents a quantum leap in terms of performance, ease of use, and development capabilities.

In this comprehensive analysis, we’ll explore each of the new features in Filament v4, explaining not just what’s new, but also how these improvements can transform your workflow and your application possibilities.

11 min

2211 words

How many times have you started a Laravel project manually creating models, controllers, migrations, factories, form requests, and tests one by one? If you’re like most Laravel developers, you’ve probably wasted countless hours on these repetitive tasks that, while necessary, don’t add direct value to your application’s business logic.

Laravel Blueprint is completely changing this paradigm. This code generation tool, created by Jason McCreary (the same genius behind Laravel Shift), allows you to generate multiple Laravel components from a single, readable, and expressive YAML file. In this deep analysis, we’ll explore how Blueprint can transform your development workflow and why it’s gaining traction in the Laravel community.

1 min

106 words

Options Pattern in Golang

Option pattern is a functional programming pattern that is used to provide optional arguments to a function that can be used to modify its behavior.

How to create a simple event streaming in Laravel?

Event streams provide you with a way to send events to the client without having to reload the page. This is useful for things like updating the user interface in real-time changes are made to the database.

6 min

1149 words

Idempotency in Laravel: How to Avoid Duplicates in Your APIs with Elegance

In modern API development, one of the most critical challenges is ensuring that operations don’t execute multiple times accidentally. Imagine a user making a payment and, due to connectivity issues, clicking the “Pay” button multiple times. Without proper measures, you might process multiple payments for the same transaction. This is where idempotency comes into play.

What is Idempotency?

Idempotency is a mathematical concept applied to programming that guarantees that an operation produces the same result regardless of how many times it’s executed. In the context of APIs, it means you can make the same request multiple times without causing additional side effects.

2 min

392 words

Laravel, in addition to using multiple third-party packages, is also possible to use parts as components. All components are under the “Illuminate” namespace.

If there’s a really interesting and useful class, it’s Collection, which allows us to work with data arrays in a simple and “programmatic” way.

To have this class in our project, we only need the illuminate/support package which we can install with:

composer require illuminate/support:5.2.x-dev

To show some examples, we’ll use a small array with this data: