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:
parent
2933727878
commit
9214c99724
|
@ -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 } />
|
||||
) }
|
||||
</>
|
||||
|
|
|
@ -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 } />
|
||||
) }
|
||||
</>
|
||||
|
|
|
@ -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 } />
|
||||
) }
|
||||
</>
|
||||
|
|
Loading…
Reference in New Issue