-
Notifications
You must be signed in to change notification settings - Fork 2.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(OverlayToaster): Don't dismiss excess toasts when updating a toast while maxToasts is set #7048
Conversation
…t while maxToasts prop is set
Generate changelog in
|
fix(OverlayToaster): Don't dismiss excess toasts when updating a toast while maxToasts prop is setBuild artifact links for this commit: documentation | landing | table | demoThis is an automated comment from the deploy-preview CircleCI job. |
Add generated changelog entriesBuild artifact links for this commit: documentation | landing | table | demoThis is an automated comment from the deploy-preview CircleCI job. |
return true; | ||
} | ||
|
||
private updateToastsInState(getNewToasts: (toasts: ToastOptions[]) => ToastOptions[]) { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I've noticed that the current abstraction with this function taking another function as an argument is making the code a bit harder for me to follow. It seems a bit premature to abstract it in this way.
Would it be possible to simplify by pulling the check for updating an existing toast to the top and using it directly in the conditional for dismissing? e.g.
public show(props: ToastProps, key?: string) {
const options = this.createToastOptions(props, key);
const isUpdatingExistingToast = key != null && !this.isNewToastKey(key);
if (this.props.maxToasts && !isUpdatingExistingToast) {
// check if active number of toasts are at the maxToasts limit
this.dismissIfAtLimit();
}
this.setState(prevState => {
const toasts = isUpdatingExistingToast
? // update a specific toast
prevState.toasts.map(t => (t.key === key ? options : t))
: // prepend a new toast
[options, ...prevState.toasts];
return { toasts, toastRefs: this.getToastRefs(toasts) };
});
return options.key;
}
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I agree that its a bit premature in the context of this PR, but with my FLUP change for queuing, it becomes more needed as we're doing these state updates in a couple of places where its not so easy to refactor. If you're down, lets leave this as is and maybe in the context of the other PR we can reevaluate?
CRBuild artifact links for this commit: documentation | landing | table | demoThis is an automated comment from the deploy-preview CircleCI job. |
Checklist
Changes proposed in this pull request:
Something of a niche case, but noticed it while iterating on a different toaster issue and wanted to quickly fix it. This issue occurs if there are a number of toasts on the screen equal to the
maxToasts
prop. Previously, if you updated one of those toasts, a toast would be dismissed unnecessarily (which could be bad if its meant to be an indefinitely present toast). Now, if a toast is updated, we don't do the max toasts check since the number of toasts hasn't changed.This PR also contains some changes that will help with further refactors to the overlay toaster component.