Skip to content

Add duration prop to Snackbar component #71154

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

Open
wants to merge 10 commits into
base: trunk
Choose a base branch
from

Conversation

badasswp
Copy link

@badasswp badasswp commented Aug 10, 2025

What?

Closes #71153

This PR adds a duration prop to the Snackbar component.

Why?

At the moment, the Snackbar component's NOTICE_TIMEOUT appears to be hard-coded which doesn't leave much room for users to be able to dictate how long it should be visible on the screen. We need a way to make this extensibly by introducing a duration prop, that gives users this flexibility they need so that they can adjust this as they choose.

How?

This PR introduces a duration prop, that gives users the flexibility they need to adjust this accordingly.

@badasswp badasswp requested a review from ajitbohra as a code owner August 10, 2025 04:15
Copy link

github-actions bot commented Aug 10, 2025

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: badasswp <[email protected]>
Co-authored-by: Infinite-Null <[email protected]>
Co-authored-by: tyxla <[email protected]>
Co-authored-by: mirka <[email protected]>
Co-authored-by: hanneslsm <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions github-actions bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Aug 10, 2025
Copy link

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @badasswp! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@badasswp badasswp requested a review from Infinite-Null August 10, 2025 18:19
@Mamaduka Mamaduka added [Type] Enhancement A suggestion for improvement. [Feature] Component System WordPress component system labels Aug 11, 2025
@Mamaduka Mamaduka requested review from a team and removed request for Infinite-Null August 11, 2025 05:34
Copy link
Member

@mirka mirka left a comment

Choose a reason for hiding this comment

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

Have we considered whether this setting should live at the Snackbar level or the SnackbarList level?

At a list level, I feel like a given notice should either be just "explicitly dismissed" or "temporary". Not "explicitly dismissed" or "temporary with arbitrary durations for each". Is there a use case for the latter?

The main consideration for me are the more "public" snackbar lists, where multiple third-party consumers could be dispatching notices to the same list via createNotice(). Right now I think we're safe because a duration option in createNotice() wouldn't be passed on to the underlying component. But if it were to be passed on, I think that could be suboptimal for consistency and user expectations.

On the other hand, if the duration were controlled by the owner of the SnackbarList, we won't have randomly different durations in a given list.

@hanneslsm
Copy link

hanneslsm commented Aug 12, 2025

I also fear that we're opening the gates for bad user experience, created by plugins. If a plugin developer needs to change the duration of the snackbar, maybe the snackbar is not the right medium to communicate the info to the user.

@badasswp
Copy link
Author

Have we considered whether this setting should live at the Snackbar level or the SnackbarList level?

At a list level, I feel like a given notice should either be just "explicitly dismissed" or "temporary". Not "explicitly dismissed" or "temporary with arbitrary durations for each". Is there a use case for the latter?

The main consideration for me are the more "public" snackbar lists, where multiple third-party consumers could be dispatching notices to the same list via createNotice(). Right now I think we're safe because a duration option in createNotice() wouldn't be passed on to the underlying component. But if it were to be passed on, I think that could be suboptimal for consistency and user expectations.

On the other hand, if the duration were controlled by the owner of the SnackbarList, we won't have randomly different durations in a given list.

@mirka At the moment, this PR proposes that this setting should live at the Snackbar level. It would be optional for users who wish to reduce/increase the time as they deem fit.

@badasswp badasswp requested a review from mirka August 13, 2025 16:16
@mirka
Copy link
Member

mirka commented Aug 13, 2025

It would be optional for users who wish to reduce/increase the time as they deem fit.

Yes, @hanneslsm and I are questioning whether this is a good idea to begin with, as it can lead to inconsistent UX. To the end user, it can feel like the snackbars are sticking around for random durations haphazardly.

What is the use case? For example, do you feel like the current default is too short or too long? Or do you want to increase the durations depending on the content? In that case, why couldn't that just be a explicitDismiss snackbar?

@badasswp
Copy link
Author

It would be optional for users who wish to reduce/increase the time as they deem fit.

Yes, @hanneslsm and I are questioning whether this is a good idea to begin with, as it can lead to inconsistent UX. To the end user, it can feel like the snackbars are sticking around for random durations haphazardly.

What is the use case? For example, do you feel like the current default is too short or too long? Or do you want to increase the durations depending on the content? In that case, why couldn't that just be a explicitDismiss snackbar?

@mirka I believe the idea is to place that capability into the hands of users. A user might feel 10s is too long for the kind of experience they want to have for a specific feature. Shouldn't we be making this option flexible enough for them to decide what's best for them?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Component System WordPress component system First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add duration prop to Snackbar component
6 participants