Update Filter by Stock block #6883
Conversation
tjcafferkey
added
type: task
tjcafferkey
changed the title
|
The release ZIP for this PR is accessible via: |
|
Size Change: +612 B (0%) Total Size: 868 kB
ℹ️ View Unchanged
|
Script Dependencies ReportThe
This comment was automatically generated by the |
…ocommerce-blocks into update/filter-by-stock-ui
dinhtungdu
left a comment
dinhtungdu
left a comment
There was a problem hiding this comment.
@tjcafferkey The PR is testing great on my end. The main functionalities work as expected.
I found some minor issues detailed below, please take a look!
- There are some design updates that haven't been implemented in this PR:
-
The block name and description.
-
The product count now has the same color as the option label.
-
The checkbox size is 18x18px in the design. In my test for this PR, its size is actually 20x20px.
-
The focus outline for checkboxes is rounded, should we remove the radius to make it match the unfocused state style? cc @vivialice
Screenshot
-
- About the Reset button, there is a case the behavior can be improved IMO:
- Add the block to the shop page and Enable the Apply Filter button.
- On the shop page, check a stock option.
- See the page reloads.
- See the Reset and Apply buttons both appear because a filter is selected now.
- Click on the Reset button, the page won't reload, and the Active Filters block won't update.
- We have to click on the Apply button to reset the filter.
=> IMO, clicking the Reset button should always reset the filter, even if the Apply filter button is enabled. cc @vivialice
|
@dinhtungdu thanks for your review:
I have updated the block name, but the description seems as it should be?
This has been sorted now.
We have decided to use the
Hmm, I am not sure but I totally understand your point. I will leave this up to @vivialice to decide upon. @Aljullu I have addressed your feedback also, and the PR is updated with the new checkbox component. Good catch! I should have known one should have existed. |
Yes! 👍
Correct. I also had forgotten the whole page refreshes. I remember during one of the past iterations we spoke about loading states - has this been updated or accounted for if not? |
@vivialice If you mean the loading placeholders, this will be done in a separate pull request.
Thanks! I will update this behaviour now then |
…ess of whether the Apply Filters button is active or not.
dinhtungdu
left a comment
dinhtungdu
left a comment
There was a problem hiding this comment.
@tjcafferkey The update looks good, but I found a minor issue with the reset button. Other than that, this is LGTM!
Steps to reproduce:
- Enable the Apply filter button.
- On the front end, select a stock filter.
- Click on the reset button.
- See the filter doesn't reset.
|
Good catch @dinhtungdu Ive addressed that here 71ad0df |
dinhtungdu
left a comment
dinhtungdu
left a comment
There was a problem hiding this comment.
Thanks for the lighting fast update! 🚀
tarhi-saad
added
type: enhancement
Update the Filter by Stock UI to be inline with the new designs.
Fixes #6842
Accessibility
prefers-reduced-motionOther Checks
Screenshots
Testing
Automated Tests
User Facing Testing
WooCommerce Visibility
Performance Impact
Changelog