72 lines
1.7 KiB
JavaScript
72 lines
1.7 KiB
JavaScript
/**
|
|
* External dependencies
|
|
*/
|
|
import PropTypes from 'prop-types';
|
|
import { useSelectShippingRate } from '@woocommerce/base-hooks';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import Package from './package';
|
|
import './style.scss';
|
|
|
|
const Packages = ( {
|
|
className,
|
|
collapsible = false,
|
|
noResultsMessage,
|
|
renderOption,
|
|
shippingRates = [],
|
|
} ) => {
|
|
const { selectShippingRate, selectedShippingRates } = useSelectShippingRate(
|
|
shippingRates
|
|
);
|
|
/* eslint-disable camelcase */
|
|
return (
|
|
<div className="wc-block-shipping-rates-control">
|
|
{ shippingRates.map( ( { package_id, ...shippingRate } ) => (
|
|
<Package
|
|
key={ package_id }
|
|
className={ className }
|
|
collapsible={ collapsible }
|
|
noResultsMessage={ noResultsMessage }
|
|
onChange={ ( newShippingRate ) => {
|
|
selectShippingRate( newShippingRate, package_id );
|
|
} }
|
|
renderOption={ renderOption }
|
|
selected={ selectedShippingRates[ package_id ] }
|
|
shippingRate={ shippingRate }
|
|
showItems={ shippingRates.length > 1 }
|
|
title={
|
|
shippingRates.length > 1 ? shippingRate.name : null
|
|
}
|
|
/>
|
|
) ) }
|
|
</div>
|
|
);
|
|
/* eslint-enable */
|
|
};
|
|
|
|
Packages.propTypes = {
|
|
renderOption: PropTypes.func.isRequired,
|
|
className: PropTypes.string,
|
|
collapsible: PropTypes.bool,
|
|
noResultsMessage: PropTypes.string,
|
|
shippingRates: PropTypes.arrayOf(
|
|
PropTypes.shape( {
|
|
items: PropTypes.arrayOf(
|
|
PropTypes.shape( {
|
|
key: PropTypes.string,
|
|
name: PropTypes.string,
|
|
quantity: PropTypes.number,
|
|
} )
|
|
).isRequired,
|
|
package_id: PropTypes.number,
|
|
name: PropTypes.string,
|
|
destination: PropTypes.object,
|
|
shipping_rates: PropTypes.arrayOf( PropTypes.object ),
|
|
} ).isRequired
|
|
).isRequired,
|
|
};
|
|
|
|
export default Packages;
|