Just like our applications, our dashboards rarely stay the same for very long. It's not uncommon that you add another metric, your client requests a different ordering for a table, or you need to create another version of a chart with a slightly different filter. Now in Custom Dashboards v1.7, all of these and more have seen powerful improvements!
In v1.7, you get new controls for your users building dashboards and more ways for developers to shape the overall experience. Let's take a look at some of our favorite additions from this update!
#Widget copying
Imagine this: you've configured the perfect widget for your dashboard. You've configured the chart, picked the right fields, and meticulously adjusted its layout to fit your needs perfectly. However, now you need that same chart for a different set of records. Prior to v1.7, starting from scratch to rebuild that widget would mean repeating a large portion of the work that you had already completed.
However, in v1.7, the Filament team has introduced the "Copy action" into Custom Dashboards. The Copy action allows you to, in a single click, duplicate any widget you have already built down to its exact configuration settings. Once copied, the duplicate widget is placed directly alongside the source widget, ready to be changed as needed without affecting the source in any way.
With the Copy action, an "All Orders" chart can quickly become a "Paid Orders" chart in seconds, no rebuild necessary.
Along with the Copy action change, the Filament team has also updated the widget configuration form to make naming clearer. This includes now providing auto-generated widget headings when a widget's heading is left blank, meaning you no longer need to come up with your own unique name for every widget you create.
#Useful dashboard table updates
The Custom Dashboards v1.7 release adds table controls that give your users the ability to see the right records and manipulate them intuitively.
First up, dashboard authors can now select a fixed number of rows per page to be preset into a dashboard table as well as giving one sortable table column a default ascending/descending sort order. That means you can now have tables that start with a particular ordering by default, allowing for easier creation of tables like "Recent Orders" where the newest orders are always at the top, or a "Highest Grossing Orders" where the records with the highest dollar amount are surfaced first.
Additionally, developers now also get more control over searching and sorting in dashboard tables as well. Now you can set attributes up to explicitly allow or disable table searching and sorting based on the columns that back them. For example, an accessor such as full_name can now use searchable(['first_name', 'last_name']) and sortable(['first_name', 'last_name']) rather than being treated as a single stored column.
By popular demand, the team has also included some nice quality-of-life features for styling badges in dashboard tables. Prior to v1.7, only enum-backed values could be styled as badges, but as of v1.7, you can style any attribute as a badge, enum or not! And as an added bonus, you can now opt out of badge styling for you enum-backed attributes as well.
And finally, text attributes can now also opt into HTML rendering with the html() method. These strings will pass through Filament's sanitizer, but remember that any untrusted content still deserves an extra level of care to prevent things like inline styles from making external requests to other domains.
#Chart focusing
Sometimes a chart just has too many groups of data to understand easily, so with v1.7 of Custom Dashboards, we have introduced focused chart views. For bar, pie, doughnut, and polar-area charts, you can now sort groups by name or metric value with a maximum number of groups to display. In practice, this lets you narrow down the data you see on a given chart to help tell a specific story to your dashboard viewers. For example, you could opt to take a bar chart that currently displays the total money spent on your application by group, sort by descending, limit the result to five groups, and have a quick and useful focused view of the highest value groups in your system.
It's important to note that this limit is applied after sorting, with all other groups outside the limit being completely omitted from the chart rather than being lumped into an "Other" category.
#Refreshing charts
As of v1.7, charts, stats, and tables can optionally refresh at configured intervals to ensure that your users are seeing relevant data on an interval that makes sense to what is being displayed. This polling is opt-in on a per-widget basis, so you can set up some widgets to refresh while others remain static.
#New widget data constraints
We all know that now every data source makes sense for every widget in your system. For example, a source that works well in a table might have nothing useful to group into a pie chart. This being the case, prior to v1.7, any data source could be used for any widget, leading to an overload of choices of which widget to use when there should practically be very little choice at all given the data shape.
Now you can limit a data source with $supportedWidgetTypes (or override the isWidgetTypeSupported() method when the decision needs to be dynamic. This gives dashboard authors a more relevant set of choices to prevent them from needing to wade through unusable options just to find the widget type that is right for their data.
#Dashboard tenant support
If your application's users are frequently switching between teams or organizations, you may want to allow each users to create dashboards for specific tenants instead of sharing them across all tenants. You can now opt into that behavior in your plugin configuration with the following small addition:
use Filament\CustomDashboardsPlugin\CustomDashboardsPlugin;
CustomDashboardsPlugin::make()
->scopeDashboardsToTenant();
Once this configuration is set, any new dashboard that is created is automatically associated with the current tenant in which it was created, and all dashboard queries, navigation, and routes are scoped accordingly.
There is one important upgrade step to call out here: when you enable tenant scoping for dashboards, any existing dashboards will not have tenant associations, so make sure you associate them correctly prior to enabling the option.
#Upgrading your projects
Many of these new features make use of new DB schema changes, so you will need to make sure that when upgrading your existing Custom Dashboards install that you run the following commands to publish and run the plugin's migrations after updating:
php artisan filament-cd:publish-migrations
php artisan migrate
If the migrations are not published and run, your app will continue to work but many of the new package features will not be available for users.
And that's a wrap on v1.7! We hope you enjoy the updates we've made to the plugin, and if you have any feedback for us, feel free to reach out on any of our socials or on Github.
