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

Snackbar can display wrong message during hiding animation #653

Open
louis-pre opened this issue Jul 25, 2024 · 0 comments
Open

Snackbar can display wrong message during hiding animation #653

louis-pre opened this issue Jul 25, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@louis-pre
Copy link
Contributor

Context

The snackbar component uses the message: string prop to determine what to display and the isVisible: boolean prop to determine if it should be visible.
Some components that use the Snackbar component coupled these two props so that isVisible becomes false at the same time as message goes back to the default messaging. (like the AccessCodeTable used to)

isVisible switching from true to false triggers the hiding animation, if the message prop changes to the default message at the same time then the default message gets displayed for the duration of the hiding animation.

Potential solution

The snackbar does not need that many props imo, we could change message: string to message: string | null and get rid of the isVisible prop.

The parent component would simply set the message to whatever it wants to display then nullify it when it wants to hide it. The snackbar would keep its own messageToDisplay: string state that does not get updated when the given message prop is null

We would need to make sure that setting the message to null then to a non-null value in quick succession properly aborts the hiding animation

@louis-pre louis-pre added the bug Something isn't working label Jul 25, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

1 participant