Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Add reset button to all filter blocks (https://github.com/woocommerce/woocommerce-blocks/pull/8366)

This commit is contained in:
Roy Ho 2023-02-02 05:50:28 -08:00 committed by GitHub
parent e0c4052bfa
commit 0a6daae35f
4 changed files with 23 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
plugins/woocommerce-blocks/assets/js/base/components/price-slider/index.tsx
View File

@ -77,6 +77,10 @@ export interface PriceSliderProps {
* What step values the slider uses.
*/
step?: number;
/**
* Wheter we're in the editor or not.
*/
isEditor?: boolean;
}
const PriceSlider = ( {
@ -92,6 +96,7 @@ const PriceSlider = ( {
inlineInput = true,
isLoading = false,
isUpdating = false,
isEditor = false,
onSubmit = () => void 0,
}: PriceSliderProps ): JSX.Element => {
const minRange = useRef< HTMLInputElement >( null );
@ -473,23 +478,21 @@ const PriceSlider = ( {
) }
{
<div className="wc-block-components-price-slider__actions">
{ ! isUpdating &&
( minPrice !== minConstraint ||
maxPrice !== maxConstraint ) && (
<FilterResetButton
onClick={ () => {
onChange( [
minConstraint,
maxConstraint,
] );
debouncedUpdateQuery();
} }
screenReaderLabel={ __(
'Reset price filter',
'woo-gutenberg-products-block'
) }
/>
) }
{ ( isEditor ||
( ! isUpdating &&
( minPrice !== minConstraint ||
maxPrice !== maxConstraint ) ) ) && (
<FilterResetButton
onClick={ () => {
onChange( [ minConstraint, maxConstraint ] );
debouncedUpdateQuery();
} }
screenReaderLabel={ __(
'Reset price filter',
'woo-gutenberg-products-block'
) }
/>
) }
{ showFilterButton && (
<FilterSubmitButton
className="wc-block-price-filter__button wc-block-components-price-slider__button"

1
plugins/woocommerce-blocks/assets/js/blocks/price-filter/block.tsx
View File

@ -353,6 +353,7 @@ const PriceFilterBlock = ( {
onSubmit={ () => onSubmit( minPrice, maxPrice ) }
isLoading={ isLoading }
isUpdating={ isUpdating }
isEditor={ isEditor }
/>
</div>
</>

2
plugins/woocommerce-blocks/assets/js/blocks/rating-filter/block.tsx
View File

@ -489,7 +489,7 @@ const RatingFilterBlock = ( {
</div>
{
<div className="wc-block-rating-filter__actions">
{ checked.length > 0 && ! isLoading && (
{ ( checked.length > 0 || isEditor ) && ! isLoading && (
<FilterResetButton
onClick={ () => {
setChecked( [] );

2
plugins/woocommerce-blocks/assets/js/blocks/stock-filter/block.tsx
View File

@ -521,7 +521,7 @@ const StockStatusFilterBlock = ( {
</div>
{
<div className="wc-block-stock-filter__actions">
{ checked.length > 0 && ! isLoading && (
{ ( checked.length > 0 || isEditor ) && ! isLoading && (
<FilterResetButton
onClick={ () => {
setChecked( [] );