woocommerce/plugins/woocommerce-admin/client/components/product-image/index.js

51 lines
1.1 KiB
JavaScript
Raw Normal View History

/** @format */
/**
* External dependencies
*/
import classnames from 'classnames';
import PropTypes from 'prop-types';
/**
* Internal dependencies
*/
import './style.scss';
const ProductImage = ( { product, alt, width, height, className, ...props } ) => {
// The first returned image from the API is the featured/product image.
const productImage = product && product.images && product.images[ 0 ];
const src = ( productImage && productImage.src ) || false;
const altText = alt || ( productImage && productImage.alt ) || '';
const classes = classnames( 'woocommerce-product-image', className, {
'is-placeholder': ! src,
} );
return (
<img
className={ classes }
src={ src || wcSettings.wcAssetUrl + 'images/placeholder.png' }
width={ width }
height={ height }
alt={ altText }
{ ...props }
/>
);
};
ProductImage.propTypes = {
width: PropTypes.number,
height: PropTypes.number,
className: PropTypes.string,
product: PropTypes.object,
alt: PropTypes.string,
};
ProductImage.defaultProps = {
width: 60,
height: 60,
className: '',
};
export default ProductImage;