search

Lundalogik / lime-elements

Provides reusable web components for Lime CRM
https://lundalogik.github.io/lime-elements/versions/latest
Other
38 stars 12 forks source link

fix(snackbar): improve UX of dismissible snackbar #2986

Closed LucyChyzhova closed 1 month ago

LucyChyzhova commented 1 month ago

fix: https://github.com/Lundalogik/lime-elements/issues/2978

Screenshot 2024-05-20 at 10 06 08

Review:

Browsers tested:

(Check any that applies, it's ok to leave boxes unchecked if testing something didn't seem relevant.)

Windows:

Linux:

macOS:

Mobile:

github-actions[bot] commented 1 month ago

Documentation has been published to https://lundalogik.github.io/lime-elements/versions/PR-2986/

lime-opensource commented 1 month ago

:tada: This PR is included in version 37.44.3 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

Kiarokh commented 1 month ago

Lucy I did a lot of refactoring in your PR for the Snackbar, divided it into several commit, and also improved styles. Got rid of the MDC styles. However, after a lot of thinking back and forth, I decided to keep the countdown timer animation on the dismiss button for now.

Because:

  1. I don’t think the user experiences the same thing now, since the button is moved to the top. I think the reason they experienced that they can “undo” some action was because the button was displayed in an irrelevant location. That location is always used to display “actions that users can take”, such as Undoing, or Moving forward. This was the confusing thing. Now we move the close button where all close buttons are conventionally located.
  2. We need to do a lot of refactoring if we wanna move the count down animation to the primary action button on the bottom-right corner of the snackbar. It takes time to do it right, which I don’t have right now.
    1. Even then, we don’t always have a primary action button. So sometimes we will end up not showing any countdown. I’d argue that this is still a useful information to display to the user (which was why we added it).
    2. We will have a persistent snackbar soon, which won’t have that countdown. This will help us differentiate between these two types. But also a persistent snackbar doesn’t need to have a primary action button.
    3. We also will need to add more actions (secondary actions) to the snackbar.
  3. We will soon work on notifications. I’m sure we will focus on the snackbar and its countless problems. There is so much I want to refactor in this component. So I think we need to wait with these kinds of changes.

Let’s live with the new position of the button and see how it feels. Maybe we think it’s fine now after all, or that we really need to change it. I just don’t wanna rush it.