Skip to content
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(Toast): resume timers if no longer over toast region after a toast is removed #7681

Open
wants to merge 3 commits into
base: main
Choose a base branch
from

Conversation

reidbarber
Copy link
Member

@reidbarber reidbarber commented Jan 28, 2025

Closes #7024

✅ Pull Request Checklist:

  • Included link to corresponding React Spectrum GitHub Issue.
  • Added/updated unit tests and storybook for this change (for new code or code which already has tests).
  • Filled out test instructions.
  • Updated documentation (if it already exists for this component).
  • Looked at the Accessibility Practices for this feature - Aria Practices

📝 Test Instructions:

  1. In the Toast story with a timeout enabled, open two or more toasts
  2. Close the top one and keep your mouse where it is
  3. Confirm that the remaining toast(s) close after a few seconds due to the timeout. Previously they would not due to the timer not resuming, due to no pointerleave event being fired in this case.

🧢 Your Project:

@reidbarber reidbarber changed the title fix(Toast): check pointer position and resume toast timers if no longer over region fix(Toast): resume timers if no longer over toast region after a toast is removed Jan 28, 2025
@rspbot
Copy link

rspbot commented Jan 28, 2025

@reidbarber reidbarber changed the title fix(Toast): resume timers if no longer over toast region after a toast is removed WIP: fix(Toast): resume timers if no longer over toast region after a toast is removed Jan 28, 2025
@reidbarber reidbarber changed the title WIP: fix(Toast): resume timers if no longer over toast region after a toast is removed fix(Toast): resume timers if no longer over toast region after a toast is removed Jan 30, 2025
@rspbot
Copy link

rspbot commented Jan 30, 2025

Copy link
Member

@snowystinger snowystinger left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We should get a test for this

}
}
prevToastCount.current = currentCount;
}, [ref, state]);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
}, [ref, state]);
}, [ref, state.visibleToasts, state.resumeAll]);

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

eslint[react-hooks/exhaustive-deps] still wants state here 🤔

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

huh.... ok then i guess, that's so weird
could always pull them off the state object beforehand, the unfortunate part is that the state object will likely always be new, at least, until the react compiler can run on that file

return () => {
document.removeEventListener('pointermove', onPointerMove);
};
}, [state.visibleToasts.length]);
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
}, [state.visibleToasts.length]);
}, [state.visibleToasts]);

just in case there's some situation where one is removed and one is added at the same time?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Multiple auto-dismiss toasts
3 participants