Enhanced Error States and Nested Fields in Payload

We recently updated our user interface to include error states for nested fields, which now surfaces child fields with errors to the top-level parent fields. Now you to see all fields that need attention at a glance, making Payload’s powerful nested fields even better.

Improved design for clarity and consistency

We have revamped the way error states are displayed in the Payload Admin UI, ensuring a consistent and unified appearance across all fields. This not only elevates the overall aesthetic of the interface but also significantly improves legibility in both light and dark modes.

This is just one step we are taking to making Payload more accessible and easy for everyone to use.

See all of your errors from anywhere in the document

At the core of Payload's appeal lies its powerful field nesting capabilities. It enables you to group fields, apply custom conditions, and validations - a favorite choice for many users. However, as documents grow deeper with nested fields, it becomes crucial to spot any potential errors that might have been overlooked during updates.

With our latest Admin UI update, we now showcase error states for nested fields like tabs, arrays, groups, and collapsibles. This means no matter how deeply a field is nested, you can effortlessly spot all errors and promptly address them, ensuring your documents are error-free.

Want to give it a try? Just upgrade Payload to 1.11.2 or higher, or start a new project with npx create-payload-app to get these features.

And if you like nested fields as much as we do, you’ll love that we added the ability to generate composable types for your Blocks, Arrays, Groups, and named Tabs.