You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
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
The text was updated successfully, but these errors were encountered:
Context
The snackbar component uses the
message: string
prop to determine what to display and theisVisible: 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 asmessage
goes back to the default messaging. (like the AccessCodeTable used to)isVisible
switching from true to false triggers the hiding animation, if themessage
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
tomessage: string | null
and get rid of theisVisible
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 givenmessage
prop isnull
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
The text was updated successfully, but these errors were encountered: