'Save and Add New' button in CMS (4.0)

[IsaacInsoll]

Overview

Every single client I've ever had has loved this button in Silverstripe 3.x with BetterButtons.
BetterButtons is not currently working for silverstripe 4 and it seems excessive to add a whole module to get this one button.

I think better buttons is great and has so many other great features but just adding 'Save and add new' to the core CMS would make a lot of people happy.

Acceptance Criteria

• I can save the currently edited record and add a new one without going back to the list view
• If there are validation errors with the currently edited record, I get to review them and don't end up on the "new record" view
• The functionality works in ModelAdmin and any other GridField

Designs can be found in our Styleguide.

Notes

• Excludes choosing the type of record to create (that's a thing in some GridField modules)
• "Save and close" - it's unclear how beneficial this actually is. I'd rather ensure that views are loading fast, and that authors get in the habit of using browser features to navigate back (which many people know how to do via keyboard and gesture shortcuts already)
• Should work in default configurations, but can be opted out of
• Does not double up when betterbuttons is installed (might need a patch to that module?)

[chillu]

Yeah, I can see how batch addition could benefit from this. It's more mental overhead and visual clutter though. Eventually this should be less impactful by preloading the "add new" forms, and switching between the "list" and "add" modes more or less instantaneously, but that shiny new React+GraphQL world is still a fair bit off unfortunately.

@clarkepaul @newleeland what do you think?

[tractorcow]

I wouldn't mind adding it to the gridfielddetailform actions by default.

[clarkepaul]

I thought that Better Buttons had one or two actions which seemed like they should be in core. Its been a while since I've used it so how about we do a mini review to see in which contexts it makes sense the most.

[mr-macedawg]

I’d love to see a “Save and add” button. It’d make data entry significantly quicker.

[chillu]

@clarkepaul @newleeland any more thoughts on this? ("mini review")

[clarkepaul]

I've reserved some time next week to take a look at the module. At the moment I'm feeling pretty confident about its practicality and usefulness.

[sachajudd]

After reviewing the better buttons module we have come up with a few concepts.

"Next & Previous" and "New Record or Add" buttons. These would be placed on the right in the south toolbar:

Configurable "BetterButtonsGroups" (Customising the button collections) Using Bootstrap dropdown-toggle-split

For this change, the core "Save & Publish" buttons would need to be separated rather than be in a btn-group.

"Draft and Publish" frontend links: Using Bootstrap single dropdown-toggle

Complete south toolbar:

cc @unclecheese @clarkepaul @chillu

[IsaacInsoll]

This looks great and adds a level of efficiency and convenience I think all CMS users will love.

[chillu]

This looks awesome @sachajudd ⭐️

• There's a lot of "green" vying for user's attention in the south toolbar now.
• The green "plus" doesn't communicate "save and add new" to me, as a user I'd be worried if I lose my current changes when pressing this. Could likely be solved by a hover/focus with the name? Authors would likely remember this after seeing the hover for the first time.
• The "Preview" is new, right? Currently GridField doesn't have a built-in preview split view, and that would be it's own feature. But good to plan for the required real estate in the south toolbar here.
• How would this look like on mobile? I guess you'd hide the green plus, and rely on the "save" button group?
• Why only "save and add new", and not "publish and add new"? And if we add that, both buttons have a button group - a bit too much clutter? I don't see a way around this though. If we allow both modes, we have a problem with the green plus though - which one does it perform?

[sachajudd]

Cheers @chillu 🙂

In this concept, the "Add" green plus icon does not have the ability to "Save" as well.
Before:

After:

We should have a warning indicating to the user that they have unsaved changes before they navigate away. We thought the "save/publish and create new" action was better suited in the drop-down area.

The preview frontend links are a feature from Betterbuttons, from my understanding they can be configured to work with some GridField items.

We thought these designs would be useful for showing how these actions could be integrated into the CMS in a nicer way.

On mobile, we could keep Betterbuttongroups if configured and at a certain size not display Previous, Next or Add.

We did consider keeping the "Save" and "Publish" buttons together and having a dropdown on the right for both save and publish additional actions but we weren't convinced it made as much sense based on some feedback we recieved (open to your thoughts on this).

[chillu]

We did consider keeping the "Save" and "Publish" buttons together and having a dropdown on the right for both save and publish additional actions but we weren't convinced it made as much sense based on some feedback we recieved (open to your thoughts on this).

It minimises space use, which will be particularly important on mobile. Keep in mind that we've designed other things to show in the south toolbar, for example "this will publish other records" warnings (ask Jared for details). So spacings and multiple dropdown triggers need to be well considered. Also don't assume every language will have button labels that short, in German and French they tend to be a third longer.

So in your previous design, you've only got the dropdown trigger on the "save" button, but not the "publish" button - does that mean you decided not to allow "publish and close"?

[clarkepaul]

We took a broader look at the design, rather than just focusing on adding the "Save and add new" action as the issue is titled. We hope to find a way to provide flexibility for the UI to be able to handle additional actions what ever they may be.

We don't intend all of these actions to be turned on by default. If a developer wanted to turn on actions associated to the "save" or "publish" action we initially thought they could be in a dropdown off that button respectively. As a space saver of course we could combine all those additional variations of "save/publish" into a single dropdown if they exist.

We now have more complexity and options with the introduction of a publish action (we don't have any stats on which action(s) would be most useful):

• Save and close
• Save and add new
• Publish and close
• Publish and add new

We had initial feedback the dropdown on the combined actions looks like it is only associated to the publish action with that last design, although combining would minimise the impact on the UI.

I did have the feeling that "save and close" and "save and add new" might be more useful during the creation process where as publish needs a bit more care to ensure you have published the right information.

Also its worth noting that we haven't really saved on clicks by moving these action to the dropdown, it would be two clicks either way.

1. Click save/publish and then the back or add action
2. Click more options dropdown then an action within
   The perceived speed might seem faster with opt 2 as you don't need to wait for the saving of the record before triggering the next action.

With mobile we can also remove icons to increase space or put the save action into the dropdown along with the other save type actions (just a thought).

[clarkepaul]

Hopefully if these designs don't make their way to core then they might inspire the better buttons module to some alternative layout options eh @unclecheese :).

In BetterButtons the top right tabs get moved down in preference of the "next/prev/add" actions, we thought it was best to not get into that territory with this issue.

[chillu]

Thanks for looking at the bigger picture! Let's keep this card focused on the "save and add new" feature. I've separated out the prev/next/create button work: silverstripe/silverstripe-admin#436.

I agree that "publish and create new" would require a lot of confidence by the author in the effects of what they're doing. Which means a preview panel that we don't have at the moment for those GridField based views. In general, we should nudge devs to set up their model editing with "save" only functionality, and stick to a cascading publish from the owner record (e.g. save a block draft, then publish the entire page). That's a simpler model for authors, and reduces mental overhead to a certain extent on views like record editing (less action choices).

[chillu]

I've written some ACs for this in the issue description, and suggested excluding "save and close" for now, since the use case for that is a bit weaker than for "save and add new". Happy to hear more user research feedback on this!

[Rhym]

Is very nice I like it a lot.

[Rhym]

Any update on this, team?

[chillu]

Closing this as a duplicate of silverstripe/silverstripe-admin#436