This repository has been archived by the owner on Feb 23, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 219
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Reduce number of dependencies for the product categories list block (#…
…771) * unqiueID helper to replace compose * move get categories function to own file * fix svg styling * remove lodash dependency * Refactor block/edit to use less dependencies * Babel config to skip wp.element * update comments * Update assets/js/blocks/product-categories/frontend.js ie11 compatible for each on nodelist Co-Authored-By: Albert Juhé Lluveras <[email protected]> * move id generation to constructor * simplify webpack config * Remove components CSS dependency * use HOC for component ID * Correct case on ComponentId
- Loading branch information
1 parent
2cf01d3
commit 254d7ad
Showing
13 changed files
with
1,394 additions
and
438 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,29 +1,31 @@ | ||
| /** | ||
| * External dependencies | ||
| */ | ||
| import { forEach } from 'lodash'; | ||
| import { render } from '@wordpress/element'; | ||
| import { render } from 'react-dom'; | ||
|
|
||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import Block from './block.js'; | ||
| import getCategories from './get-categories'; | ||
|
|
||
| const containers = document.querySelectorAll( | ||
| '.wp-block-woocommerce-product-categories' | ||
| ); | ||
|
|
||
| if ( containers.length ) { | ||
| forEach( containers, ( el ) => { | ||
| Array.prototype.forEach.call( containers, ( el ) => { | ||
| const data = JSON.parse( JSON.stringify( el.dataset ) ); | ||
| const attributes = { | ||
| hasCount: data.hasCount === 'true', | ||
| hasEmpty: data.hasEmpty === 'true', | ||
| isDropdown: data.isDropdown === 'true', | ||
| isHierarchical: data.isHierarchical === 'true', | ||
| }; | ||
| const categories = getCategories( attributes ); | ||
|
|
||
| el.classList.remove( 'is-loading' ); | ||
|
|
||
| render( <Block attributes={ attributes } />, el ); | ||
| render( <Block attributes={ attributes } categories={ categories } />, el ); | ||
| } ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,16 @@ | ||
| /** | ||
| * Internal dependencies | ||
| */ | ||
| import { buildTermsTree } from './hierarchy'; | ||
|
|
||
| /** | ||
| * Returns categories in tree form. | ||
| */ | ||
| export default function( { hasEmpty, isHierarchical } ) { | ||
| const categories = wc_product_block_data.productCategories.filter( | ||
| ( cat ) => hasEmpty || !! cat.count | ||
| ); | ||
| return isHierarchical ? | ||
| buildTermsTree( categories ) : | ||
| categories; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,35 @@ | ||
| import { Component } from 'react'; | ||
|
|
||
| const ids = []; | ||
|
|
||
| /** | ||
| * HOC that gives a component a unique ID. | ||
| * | ||
| * This is an alternative for withInstanceId from @wordpress/compose to avoid using that dependency on the frontend. | ||
| */ | ||
| const withComponentId = ( OriginalComponent ) => { | ||
| return class WrappedComponent extends Component { | ||
| generateUniqueID() { | ||
| const group = WrappedComponent.name; | ||
|
|
||
| if ( ! ids[ group ] ) { | ||
| ids[ group ] = 0; | ||
| } | ||
|
|
||
| ids[ group ]++; | ||
|
|
||
| return ids[ group ]; | ||
| } | ||
|
|
||
| render() { | ||
| const ComponentId = this.generateUniqueID(); | ||
|
|
||
| return <OriginalComponent | ||
| { ...this.props } | ||
| ComponentId={ ComponentId } | ||
| />; | ||
| } | ||
| }; | ||
| }; | ||
|
|
||
| export default withComponentId; |
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.