Skip to content
This repository has been archived by the owner on Feb 23, 2024. It is now read-only.

Commit

Permalink
Add/attributes filter count display toggle (#9833)
Browse files Browse the repository at this point in the history
* Default show product counts to false for filter by attributes block

* Default show product counts to false for filter by stock block

* Default show product counts to false for filter by rating block

* Refactor deprecation

* Refactor deprecation

* Refactor deprecation
  • Loading branch information
roykho authored Jun 22, 2023
1 parent 6d3c789 commit 132839d
Show file tree
Hide file tree
Showing 9 changed files with 196 additions and 52 deletions.
2 changes: 1 addition & 1 deletion assets/js/blocks/attribute-filter/block.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@
},
"showCounts": {
"type": "boolean",
"default": true
"default": false
},
"queryType": {
"type": "string",
Expand Down
80 changes: 80 additions & 0 deletions assets/js/blocks/attribute-filter/deprecated.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,80 @@
/**
* External dependencies
*/
import { useBlockProps } from '@wordpress/block-editor';
import { isFeaturePluginBuild } from '@woocommerce/block-settings';
import classNames from 'classnames';

/**
* Internal dependencies
*/
import type { BlockAttributes } from './types';
import { blockAttributes } from './attributes';
import metadata from './block.json';

const v1 = {
supports: {
...metadata.supports,
...( isFeaturePluginBuild() && {
__experimentalBorder: {
radius: false,
color: true,
width: false,
},
} ),
},
attributes: {
...metadata.attributes,
showCounts: {
type: 'boolean',
default: true,
},
...blockAttributes,
},
save: ( { attributes }: { attributes: BlockAttributes } ) => {
const {
className,
showCounts,
queryType,
attributeId,
heading,
headingLevel,
displayStyle,
showFilterButton,
selectType,
} = attributes;
const data: Record< string, unknown > = {
'data-attribute-id': attributeId,
'data-show-counts': showCounts,
'data-query-type': queryType,
'data-heading': heading,
'data-heading-level': headingLevel,
};
if ( displayStyle !== 'list' ) {
data[ 'data-display-style' ] = displayStyle;
}
if ( showFilterButton ) {
data[ 'data-show-filter-button' ] = showFilterButton;
}
if ( selectType === 'single' ) {
data[ 'data-select-type' ] = selectType;
}
return (
<div
{ ...useBlockProps.save( {
className: classNames( 'is-loading', className ),
} ) }
{ ...data }
>
<span
aria-hidden
className="wc-block-product-attribute-filter__placeholder"
/>
</div>
);
},
};

const deprecated = [ v1 ];

export default deprecated;
32 changes: 4 additions & 28 deletions assets/js/blocks/attribute-filter/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import edit from './edit';
import type { BlockAttributes } from './types';
import { blockAttributes } from './attributes';
import metadata from './block.json';
import deprecated from './deprecated';

registerBlockType( metadata, {
icon: {
Expand Down Expand Up @@ -41,39 +42,13 @@ registerBlockType( metadata, {
edit,
// Save the props to post content.
save( { attributes }: { attributes: BlockAttributes } ) {
const {
className,
showCounts,
queryType,
attributeId,
heading,
headingLevel,
displayStyle,
showFilterButton,
selectType,
} = attributes;
const data: Record< string, unknown > = {
'data-attribute-id': attributeId,
'data-show-counts': showCounts,
'data-query-type': queryType,
'data-heading': heading,
'data-heading-level': headingLevel,
};
if ( displayStyle !== 'list' ) {
data[ 'data-display-style' ] = displayStyle;
}
if ( showFilterButton ) {
data[ 'data-show-filter-button' ] = showFilterButton;
}
if ( selectType === 'single' ) {
data[ 'data-select-type' ] = selectType;
}
const { className } = attributes;

return (
<div
{ ...useBlockProps.save( {
className: classNames( 'is-loading', className ),
} ) }
{ ...data }
>
<span
aria-hidden
Expand All @@ -82,4 +57,5 @@ registerBlockType( metadata, {
</div>
);
},
deprecated,
} );
2 changes: 1 addition & 1 deletion assets/js/blocks/rating-filter/block.json
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
},
"showCounts": {
"type": "boolean",
"default": true
"default": false
},
"displayStyle": {
"type": "string",
Expand Down
44 changes: 44 additions & 0 deletions assets/js/blocks/rating-filter/deprecated.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
/**
* External dependencies
*/
import classNames from 'classnames';
import { useBlockProps } from '@wordpress/block-editor';

/**
* Internal dependencies
*/
import metadata from './block.json';
import type { Attributes } from './types';

const v1 = {
attributes: {
...metadata.attributes,
showCounts: {
type: 'boolean',
default: true,
},
},
save: ( { attributes }: { attributes: Attributes } ) => {
const { className, showCounts } = attributes;
const data: Record< string, unknown > = {
'data-show-counts': showCounts,
};
return (
<div
{ ...useBlockProps.save( {
className: classNames( 'is-loading', className ),
} ) }
{ ...data }
>
<span
aria-hidden
className="wc-block-product-rating-filter__placeholder"
/>
</div>
);
},
};

const deprecated = [ v1 ];

export default deprecated;
9 changes: 4 additions & 5 deletions assets/js/blocks/rating-filter/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { useBlockProps } from '@wordpress/block-editor';
import edit from './edit';
import metadata from './block.json';
import type { Attributes } from './types';
import deprecated from './deprecated';

registerBlockType( metadata, {
icon: {
Expand All @@ -28,16 +29,13 @@ registerBlockType( metadata, {
edit,
// Save the props to post content.
save( { attributes }: { attributes: Attributes } ) {
const { className, showCounts } = attributes;
const data: Record< string, unknown > = {
'data-show-counts': showCounts,
};
const { className } = attributes;

return (
<div
{ ...useBlockProps.save( {
className: classNames( 'is-loading', className ),
} ) }
{ ...data }
>
<span
aria-hidden
Expand All @@ -46,4 +44,5 @@ registerBlockType( metadata, {
</div>
);
},
deprecated,
} );
2 changes: 1 addition & 1 deletion assets/js/blocks/stock-filter/block.json
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@
},
"showCounts": {
"type": "boolean",
"default": true
"default": false
},
"showFilterButton": {
"type": "boolean",
Expand Down
57 changes: 57 additions & 0 deletions assets/js/blocks/stock-filter/deprecated.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,57 @@
/**
* External dependencies
*/
import classNames from 'classnames';
import { useBlockProps } from '@wordpress/block-editor';

/**
* Internal dependencies
*/
import metadata from './block.json';
import { blockAttributes } from './attributes';
import type { Attributes } from './types';

const v1 = {
attributes: {
...metadata.attributes,
showCounts: {
type: 'boolean',
default: true,
},
...blockAttributes,
},
save: ( { attributes }: { attributes: Attributes } ) => {
const {
className,
showCounts,
heading,
headingLevel,
showFilterButton,
} = attributes;
const data: Record< string, unknown > = {
'data-show-counts': showCounts,
'data-heading': heading,
'data-heading-level': headingLevel,
};
if ( showFilterButton ) {
data[ 'data-show-filter-button' ] = showFilterButton;
}
return (
<div
{ ...useBlockProps.save( {
className: classNames( 'is-loading', className ),
} ) }
{ ...data }
>
<span
aria-hidden
className="wc-block-product-stock-filter__placeholder"
/>
</div>
);
},
};

const deprecated = [ v1 ];

export default deprecated;
20 changes: 4 additions & 16 deletions assets/js/blocks/stock-filter/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import edit from './edit';
import metadata from './block.json';
import { blockAttributes } from './attributes';
import type { Attributes } from './types';
import deprecated from './deprecated';

registerBlockType( metadata, {
icon: {
Expand All @@ -30,27 +31,13 @@ registerBlockType( metadata, {
edit,
// Save the props to post content.
save( { attributes }: { attributes: Attributes } ) {
const {
className,
showCounts,
heading,
headingLevel,
showFilterButton,
} = attributes;
const data: Record< string, unknown > = {
'data-show-counts': showCounts,
'data-heading': heading,
'data-heading-level': headingLevel,
};
if ( showFilterButton ) {
data[ 'data-show-filter-button' ] = showFilterButton;
}
const { className } = attributes;

return (
<div
{ ...useBlockProps.save( {
className: classNames( 'is-loading', className ),
} ) }
{ ...data }
>
<span
aria-hidden
Expand All @@ -59,4 +46,5 @@ registerBlockType( metadata, {
</div>
);
},
deprecated,
} );

0 comments on commit 132839d

Please sign in to comment.