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.

Sign up for GitHub

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: Reduce the time messages display by half #47199

Closed
wants to merge 2 commits into from
Closed

Snackbar: Reduce the time messages display by half #47199

Changes from 1 commit
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
9db4d94
Reduce the snackbar display time by half, from 10 to 5 seconds.
apeatling Jan 16, 2023
5963980
Update to 6000ms.
apeatling Jan 17, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/components/src/snackbar/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ import Button from '../button';
import type { NoticeAction, SnackbarProps } from './types';
import type { WordPressComponentProps } from '../ui/context';

const NOTICE_TIMEOUT = 10000;
const NOTICE_TIMEOUT = 5000;
Copy link
Contributor

Choose a reason for hiding this comment

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

Often snackbar notices might have a link in them that can be interacted with, e.g. if you save a draft, you can click to view the preview:

image

Would globally reducing the timeout make it harder for these interactive ones, or snackbars that contain more descriptive info? I'm mostly thinking of trying to ensure that users have enough time to read the snackbar, then make a decision about whether to interact with it, and then move the mouse over to the button and click on it. Would introducing a configurable timeout value help, so we could potentially preserve the component's default value of 10s, but then define a shorter timeout in specific usage?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Ah yes, this is a good point! I don't think 5 seconds is long enough for interactive notices. I'd imagine also the reason they are 10 seconds. I think a configurable, or at least a context aware timeout is a better idea. 👍

Copy link
Member

Choose a reason for hiding this comment

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

One issue with making it configurable is that all of the timeouts will inevitably be inconsistent.

It does seem from looking into the history of this (#15594 (comment)) that 10s was fairly intentional:

Snackbar should disappear after a relatively longer period of time to allow people time to interact with them (10s) and should also be dismissable (even if via a non-visible action, like tapping on the snackbar itself) so as to ensure it doesn't get in users' way and allow for more choice.

Copy link
Contributor

Choose a reason for hiding this comment

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

How about 6 seconds as a starting point? I'd like to think that if the main purpose of the long delay is the "View preview" link in the snackbar, we can take that as a prompt to improve this area, which has a permanent link to it:

Screenshot 2023-01-17 at 09 40 32

Copy link
Contributor

Choose a reason for hiding this comment

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

Speaking of, that really needs a little love:

  • Legacy wp-admin focus style
  • Too-dark disabled-gray input
  • Inconsistent button sizes
  • Inconsistent padding
  • Just a lot, honestly, we can probably simplify drastically and reduce noise, borders, etc.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

@jasmussen I agree that sidebar view could improve, I'd actually be interested in working on that. The trouble is you don't see this when saving a draft of the post (when you get the View Preview snackbar). So it doesn't help in removing the need for it.


/**
* Custom hook which announces the message with the given politeness, if a
Expand Down