-
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
[core] fix: get toasters timeout Infinity to match behavior of timeout 0 #7059
base: develop
Are you sure you want to change the base?
Conversation
Generate changelog in
|
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.
Thanks for making this change and adding tests. Just a few minor comments
@@ -44,7 +44,8 @@ export const Toast2 = React.forwardRef<HTMLDivElement, ToastProps>((props, ref) | |||
const clearTimeout = React.useCallback(() => setIsTimeoutStarted(false), []); | |||
|
|||
// Per docs: "Providing a value less than or equal to 0 will disable the timeout (this is discouraged)." | |||
const isTimeoutEnabled = timeout != null && timeout > 0; | |||
// Per github, issue 6742: "timeout: Infinity should also behave the same as timeout: 0" |
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 think we can remove both these comments, they don't add anything that the code does not provide here.
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.
Also, lets update the docs for the timeout prop to mention the behavior of Infinity
.
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.
Thanks for the feedback! I've removed the comments and updated the timeout prop documentation to include the Infinity behavior. Let me know if you'd like me to make any other changes.
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.
One minor docs change below, thanks for making this contribution
@@ -47,7 +47,7 @@ export interface ToastProps extends Props, IntentProps { | |||
|
|||
/** | |||
* Milliseconds to wait before automatically dismissing toast. | |||
* Providing a value less than or equal to 0 will disable the timeout (this is discouraged). | |||
* Providing a value less than or equal to 0 or Infinity will disable the timeout (this is discouraged). |
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.
* Providing a value less than or equal to 0 or Infinity will disable the timeout (this is discouraged). | |
* Setting this to Infinity or a value less than or equal to 0 will disable the timeout (this is discouraged). |
Minor nit to make sure that this is clear that we're not referring to values less than infinity
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.
Great! Glad to help.
Fixes #6742
A toast with timeout: Infinity closes immediately.
See this sandbox https://codesandbox.io/p/sandbox/blueprint-toast-issue-forked-4t9r9t?file=%2Fsrc%2FApp.js%3A17%2C4.
However, a Toast with timeout: Infinity should disable the timeout, just like a Toast with timeout: 0.
Additionally, a test case for timeout: Infinity is needed.
The Issue
The error is in blueprint/packages/core/src/components/toast/toast2.tsx, specifically the line:
isTimeoutEnabled = timeout != null && timeout > 0;
Currently, when timeout = Infinity, then isTimeoutEnabled = True. When Infinity is passed as the timeout, due to useTimeout's functionality, the toast closes immediately with a 0 second delay.
This code needs to be fixed so when timeout = Infinity, then isTimeoutEnabled = False (i.e. the timeout is disabled).
Changes proposed in this pull request:
Three changes:
These changes produced correct functionality on my local computer.
Tests
Reviewers should focus on:
Screenshots