Attribute, Rating and Stock filters: Fix the dropdown indicator icon display (https://github.com/woocommerce/woocommerce-blocks/pull/8080)

* Filter blocks: Fix the dropdown indicator icon display for 'single option' mode. Closes woocommerce/woocommerce-blocks#8075

* Filter blocks: Fix the dropdown indicator for multiple items option. Closes woocommerce/woocommerce-blocks#7889
This commit is contained in:
Daniel Dudzic 2023-01-04 18:37:08 +01:00 committed by GitHub
parent 2933727878
commit 9214c99724
3 changed files with 15 additions and 3 deletions

View File

@ -527,6 +527,10 @@ const AttributeFilterBlock = ( {
return null;
}
const showChevron = multiple
? ! isLoading && checked.length < displayedOptions.length
: ! isLoading && checked.length === 0;
const heading = (
<TagName className="wc-block-attribute-filter__title">
{ blockAttributes.heading }
@ -666,7 +670,7 @@ const AttributeFilterBlock = ( {
),
} }
/>
{ multiple && (
{ showChevron && (
<Icon icon={ chevronDown } size={ 30 } />
) }
</>

View File

@ -166,6 +166,10 @@ const RatingFilterBlock = ( {
const multiple = blockAttributes.selectType !== 'single';
const showChevron = multiple
? ! isLoading && checked.length < displayedOptions.length
: ! isLoading && checked.length === 0;
const onSubmit = useCallback(
( checkedOptions ) => {
if ( isEditor ) {
@ -466,7 +470,7 @@ const RatingFilterBlock = ( {
),
} }
/>
{ multiple && (
{ showChevron && (
<Icon icon={ chevronDown } size={ 30 } />
) }
</>

View File

@ -426,6 +426,10 @@ const StockStatusFilterBlock = ( {
return null;
}
const showChevron = allowsMultipleOptions
? ! isLoading && checked.length < displayedOptions.length
: ! isLoading && checked.length === 0;
const heading = (
<TagName className="wc-block-stock-filter__title">
{ blockAttributes.heading }
@ -500,7 +504,7 @@ const StockStatusFilterBlock = ( {
),
} }
/>
{ allowsMultipleOptions && (
{ showChevron && (
<Icon icon={ chevronDown } size={ 30 } />
) }
</>