@shopgate/engage/category/components/CategoryImage/index.js

Shopgate's ENGAGE library.

function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_nonIterableRest();}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance");}function _iterableToArrayLimit(arr,i){var _arr=[];var _n=true;var _d=false;var _e=undefined;try{for(var _i=arr[Symbol.iterator](),_s;!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break;}}catch(err){_d=true;_e=err;}finally{try{if(!_n&&_i["return"]!=null)_i["return"]();}finally{if(_d)throw _e;}}return _arr;}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr;}import React,{useState,useCallback}from'react';import PropTypes from'prop-types';import{Image}from'@shopgate/engage/components';import connect from"./connector";/**
 * The CategoryImage component
 * @param {Object} props The component props.
 * @returns {JSX}
 */var CategoryImage=function CategoryImage(_ref){var className=_ref.className,src=_ref.src,placeholderSrc=_ref.placeholderSrc;var _useState=useState(!src),_useState2=_slicedToArray(_useState,2),showPlaceholder=_useState2[0],setShowPlaceholder=_useState2[1];var onImageError=useCallback(function(){setShowPlaceholder(true);},[setShowPlaceholder]);if(!showPlaceholder){return React.createElement(Image,{className:className,src:src,onError:onImageError});}if(!placeholderSrc){return null;}return React.createElement(Image,{key:"placeholder",className:className,src:placeholderSrc});};CategoryImage.defaultProps={src:null,placeholderSrc:null,className:null};export default connect(CategoryImage);