woocommerce/plugins/woocommerce-blocks/assets/js/hocs/with-product.js

72 lines
1.6 KiB
JavaScript
Raw Normal View History

/**
* External dependencies
*/
import { Component } from '@wordpress/element';
import { createHigherOrderComponent } from '@wordpress/compose';
/**
* Internal dependencies
*/
import { getProduct } from '../components/utils';
import { formatError } from '../base/utils/errors.js';
const withProduct = createHigherOrderComponent(
( OriginalComponent ) => {
return class WrappedComponent extends Component {
constructor() {
super( ...arguments );
this.state = {
error: null,
loading: false,
product: null,
};
this.loadProduct = this.loadProduct.bind( this );
}
componentDidMount() {
this.loadProduct();
}
componentDidUpdate( prevProps ) {
if ( prevProps.attributes.productId !== this.props.attributes.productId ) {
this.loadProduct();
}
}
loadProduct() {
const { productId } = this.props.attributes;
if ( ! productId ) {
this.setState( { product: null, loading: false, error: null } );
return;
}
this.setState( { loading: true } );
getProduct( productId ).then( ( product ) => {
this.setState( { product, loading: false, error: null } );
} ).catch( async ( e ) => {
const error = await formatError( e );
this.setState( { product: null, loading: false, error } );
} );
}
render() {
const { error, loading, product } = this.state;
return <OriginalComponent
{ ...this.props }
error={ error }
getProduct={ this.loadProduct }
isLoading={ loading }
product={ product }
/>;
}
};
},
'withProduct'
);
export default withProduct;