Today, we're showcasing a new way to create and edit documents, nested in a modal, while other documents are being edited. This new feature lays the foundation for a ton of significant UX improvements that will follow immediately.
Now, every relationship field has a little "+" icon next to the field, which allows you to create a new document to use as a relationship, within a modal, simultaneously as you are editing the parent document. This is huge for cases where you might be creating a post, and then need to create a new category to assign the post to, or similar.
It works seamlessly on desktop and mobile (still can't believe most headless CMS admin panels aren't responsive in 2022). It also works on any level of nested documents - you can have 10 documents open at a time if you want. That would be pretty crazy, but hey, it would work.
Speaking of that, there's a new admin React hook for use as well called useEditDepth which you can use to be able to discern between which level of edit depth your component is rendering in.
Over the last few months, we've been working on this feature and we're super excited about it. We soft-launched it a few weeks back, but now that it's tested and stable, we're going to dive in and talk about what it unlocks for Payload's future editing experience.
We're going to immediately get started implementing this new feature elsewhere, including the following spots:
Upload Field
Currently, creating a new upload within an upload field is done in a separately designed modal window, but we're going to flatten the experience and re-leverage our nested editing UX here.
Rich Text Uploads
Right now, there's no way to add a new upload directly from a rich text editor. You can select an existing upload, but can't add a new one. There's a great PR opened by community dev Sccttt (THANK YOU) which adds this as a feature, but we're going to take it one step further and flatten the UX by re-using our nested editing there, too.
Rich Text Relationships
Same as the above, soon, you'll be able to add a new relationship directly from the rich text editor to use within the Rich Text's relationship element.
Relationship "selected items"
You might want to be able to easily bounce over to a selected item in any given relationship field, make a quick change, and then come back to your main document. This is next up on our list and will be a huge editing UX improvement. We'll be adding a little "edit" icon to the "selected" relationship items, allowing you to move seamlessly between documents.
Like what we're doing? Give us a star on GitHub
We're trying to change the CMS status quo by delivering editors with a great experience, but first and foremost, giving developers a CMS that they don't absolutely despise working with. All of our new features are meant to be extensible and work simply and sanely.
Get up and running with one line
Getting started with Payload is easy—and free forever. Just fire up a new terminal window and run the following command: