@shopgate/engage
Version:
Shopgate's ENGAGE library.
8 lines • 2.37 kB
JavaScript
import React,{useMemo}from'react';import PropTypes from'prop-types';import{css}from'glamor';import{connect}from'react-redux';import{RippleButton}from'@shopgate/engage/components';import{i18n}from'@shopgate/engage/core';import{toggleFavoriteWithListChooser}from'@shopgate/pwa-common-commerce/favorites/actions/toggleFavorites';import{makeIsProductOnFavoriteList,hasMultipleFavoritesList}from'@shopgate/pwa-common-commerce/favorites/selectors';import{getWishlistItemQuantityEnabled}from'@shopgate/engage/core/selectors/shopSettings';import appConfig from'@shopgate/pwa-common/helpers/config';/**
* @param {Object} state State.
* @returns {Object}
*/var makeMapStateToProps=function makeMapStateToProps(){var getIsOnList=makeIsProductOnFavoriteList(function(_,props){return props.productId;});return function(state,props){return{isOnList:getIsOnList(state,props),hasMultipleLists:hasMultipleFavoritesList(state),wishlistItemQuantityEnabled:getWishlistItemQuantityEnabled(state)};};};/**
* @param {Function} dispatch Dispatch
* @returns {Object}
* */var mapDispatchToProps=function mapDispatchToProps(dispatch){return{toggle:function toggle(productId){return dispatch(toggleFavoriteWithListChooser(productId));}};};var styles={root:css({'&&':{margin:'0 0px 16px 16px',backgroundColor:'#fff',border:'1px solid var(--color-primary)',color:'var(--color-high-emphasis)',borderRadius:5,fontSize:14,textTransform:'none',padding:0}}).toString(),ripple:css({padding:'8px 16px'}).toString()};/** @returns {JSX} */var FavoriteButtonWide=function FavoriteButtonWide(_ref){var productId=_ref.productId,toggle=_ref.toggle,isOnList=_ref.isOnList,hasMultipleLists=_ref.hasMultipleLists,wishlistItemQuantityEnabled=_ref.wishlistItemQuantityEnabled;var label=useMemo(function(){// When wishlist item quantity is active, items cannot be removed via the button
if(!isOnList||wishlistItemQuantityEnabled){return'favorites.add_to_list';}if(hasMultipleLists){return'favorites.edit_lists';}return'favorites.remove_from_list';},[hasMultipleLists,isOnList,wishlistItemQuantityEnabled]);if(!appConfig.hasFavorites){return null;}return React.createElement(RippleButton,{className:styles.root,rippleClassName:styles.ripple,type:"primary",onClick:function onClick(){return toggle(productId);}},i18n.text(label));};export default connect(makeMapStateToProps,mapDispatchToProps)(FavoriteButtonWide);