Product Categories List: Add the links into the rendered block (https://github.com/woocommerce/woocommerce-blocks/pull/637)

* Add `isPreview` prop to be used when in editor preview

* Add product category link to the categories object

* Add the link to the `a` if we're not in the preview mode
This commit is contained in:
Kelly Dwan 2019-06-24 08:52:43 -04:00 committed by GitHub
parent f7d846b547
commit 6526e398f0
3 changed files with 14 additions and 6 deletions

View File

@ -23,7 +23,7 @@ function getCategories( { hasEmpty, isDropdown, isHierarchical } ) {
/** /**
* Component displaying the categories as dropdown or list. * Component displaying the categories as dropdown or list.
*/ */
const ProductCategoriesBlock = ( { attributes } ) => { const ProductCategoriesBlock = ( { attributes, isPreview = false } ) => {
const { hasCount, isDropdown } = attributes; const { hasCount, isDropdown } = attributes;
const categories = getCategories( attributes ); const categories = getCategories( attributes );
const parentKey = 'parent-' + categories[ 0 ].term_id; const parentKey = 'parent-' + categories[ 0 ].term_id;
@ -33,10 +33,10 @@ const ProductCategoriesBlock = ( { attributes } ) => {
{ items.map( ( cat ) => { { items.map( ( cat ) => {
const count = hasCount ? <span>({ cat.count })</span> : null; const count = hasCount ? <span>({ cat.count })</span> : null;
return [ return [
<li key={ cat.term_id }><a>{ cat.name }</a> { count }</li>, // eslint-disable-line <li key={ cat.term_id }>
!! cat.children && <a href={ isPreview ? null : cat.link }>{ cat.name }</a> { count } { /* eslint-disable-line */ }
!! cat.children.length && </li>,
renderList( cat.children ), !! cat.children && !! cat.children.length && renderList( cat.children ),
]; ];
} ) } } ) }
</ul> </ul>
@ -65,6 +65,10 @@ ProductCategoriesBlock.propTypes = {
* The attributes for this block * The attributes for this block
*/ */
attributes: PropTypes.object.isRequired, attributes: PropTypes.object.isRequired,
/**
* Whether this is the block preview or frontend display.
*/
isPreview: PropTypes.bool,
}; };
export default ProductCategoriesBlock; export default ProductCategoriesBlock;

View File

@ -66,7 +66,7 @@ export default function( { attributes, setAttributes } ) {
/> />
</PanelBody> </PanelBody>
</InspectorControls> </InspectorControls>
<Block attributes={ attributes } /> <Block attributes={ attributes } isPreview />
</Fragment> </Fragment>
); );
} }

View File

@ -197,6 +197,10 @@ class WGPB_Block_Library {
'pad_counts' => true, 'pad_counts' => true,
) )
); );
foreach ( $product_categories as &$category ) {
$category->link = get_term_link( $category->term_id, 'product_cat' );
}
// Global settings used in each block. // Global settings used in each block.
$block_settings = array( $block_settings = array(
'min_columns' => wc_get_theme_support( 'product_blocks::min_columns', 1 ), 'min_columns' => wc_get_theme_support( 'product_blocks::min_columns', 1 ),