[UI v2] feat: Have UX related mutation callbacks be handled in the UX layer #16136
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
86f5d57 to
de7c909
Compare
de7c909 to
92b7271
Compare
devinvillarosa
commented
Nov 27, 2024
There was a problem hiding this comment.
By moving the toast as a callback to onSuccess caught the test to mock the delete endpoint
92b7271 to
a9a1a08
Compare
desertaxle
approved these changes
Nov 27, 2024
Comment on lines
547
to
551
| server.use( | ||
| http.delete("http://localhost:4200/api/variables/:id", () => { | ||
| return HttpResponse.json({ status: 204 }); | ||
| }), | ||
| ); |
There was a problem hiding this comment.
This is a general enough mock that I think adding it to ui-v2/tests/mocks/handlers.ts might make sense.
There was a problem hiding this comment.
Thanks! Updated in latest push
a9a1a08 to
d549842
Compare
… layer of seperation of concern
d549842 to
a35ae10
Compare
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.
What does this PR do and why?
This PR handles all UX related mutation callbacks to be handled on the UX layer.
useMutationis divided into 2 separate concerns: 1️⃣ Data, 2️⃣ UX.Upon success on the data layer, it is not guaranteed that the UX related callbacks will be invoked.
This is why after calling a defined
useMutation, there are callback options to pass, in which all UX related callbacks should be handled there.Here is a good article of how
useMutationis architected with seperation of concerns:https://tkdodo.eu/blog/mastering-mutations-in-react-query#some-callbacks-might-not-fire
Overall,
useMutationshould be designed with 2 considerations:1️⃣ When initially creating a
mutation, handle all data / cache related callbacks here2️⃣ When calling the
mutationin a UX component, handle the UX updates (eg: re-routing, toasts) thereChecklist
<link to issue>"mint.json.Related to #15512