Add SaveBoundary to allow saving multiple things (e.g., forms) with a centralized save button
#1448
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
…) in a SaveRange This introduces a SaveRange (context) that can contain multiple areas that get saved together using a SaveRangeSaveButton. Any component can register itself in the SaveRange by providing a hasChanges boolean and a doSave method. This also adds a default implementation for FinalForm: - if FinalForm is rendered inside a SaveRange, it registers - else the FinalForm renders (like previously) a router Prompt Prompts are not needed for the inner components, instead SaveRange renders a single prompt containing all hasChanges from registered components. See products admin for an implementation example.
nsams
force-pushed
the
centralized-save-button
branch
from
f160558
to
8f4e833
Compare
|
I've had an idea about naming: How about |
nsams
changed the title
johnnyomair
reviewed
Dec 18, 2023
packages/admin/admin-stories/src/admin/save-range/SaveRange.tsx
Outdated
Show resolved
Hide resolved
packages/admin/admin/src/submissionBoundary/SubmissionBoundarySaveButton.tsx
Outdated
Show resolved
Hide resolved
packages/admin/admin/src/submissionBoundary/SubmissionBoundary.tsx
Outdated
Show resolved
Hide resolved
packages/admin/admin/src/submissionBoundary/SubmissionBoundary.tsx
Outdated
Show resolved
Hide resolved
Co-authored-by: Johannes Obermair <48853629+johnnyomair@users.noreply.github.com>
Co-authored-by: Johannes Obermair <48853629+johnnyomair@users.noreply.github.com>
nsams
commented
Dec 18, 2023
packages/admin/admin-stories/src/admin/save-range/SaveRange.tsx
Outdated
Show resolved
Hide resolved
nsams
force-pushed
the
centralized-save-button
branch
from
b01c5af
to
fc944ad
Compare
johnnyomair
reviewed
Jan 24, 2024
|
@nsams please fix the lint workflow. |
johnnyomair
changed the title
SaveBoundary to allow saving multiple things (e.g., forms) with a centralized save button
johnnyomair
approved these changes
Feb 12, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This introduces a SaveBoundary (context) that can contain multiple areas that get saved together using a SaveBoundarySaveButton.
Any component can register itself in the SaveBoundary by providing a hasChanges boolean and a doSave method. This also adds a default implementation for FinalForm:
Prompts are not needed for the inner components, instead SaveBoundary renders a single prompt containing all hasChanges from registered components.
See products admin for an implementation example.
Also changed in Demo Products: ProductsPage now contains Toolbar and Save Button for Detail Page. That way the form is now completely independent of where it is used and could also be put into an EditDialog.
Alternative:
A possible alternative would be to re-use the router Prompt component that also has a save action. But I decided for an additional implementation because:
see #1449 for additional usage of SubmissionBoundary