@shopgate/engage
Version:
Shopgate's ENGAGE library.
16 lines • 2.62 kB
JavaScript
import React,{useCallback,useMemo}from'react';import PropTypes from'prop-types';import{connect}from'react-redux';import{getCurrentRoute}from'@shopgate/pwa-common/selectors/router';import{selectGlobalLocation}from'@shopgate/engage/locations/action-creators';import{getPreferredLocation,getIsPending}from"../../selectors";import{getIsLocationBasedShopping}from"../../../core/selectors";import{FulfillmentSheet}from"../FulfillmentSheet";import{STAGE_SELECT_STORE,MULTI_LINE_RESERVE}from"../../constants";/**
* Maps state to props.
* @param {Object} state State
* @return {Object}
*/var mapStateToProps=function mapStateToProps(state){return{currentRoute:getCurrentRoute(state),isLocationBasedShopping:getIsLocationBasedShopping(state),isPending:getIsPending(state),preferredLocation:getPreferredLocation(state)};};/**
* Maps the contents of the state to the component props.
* @param {Function} dispatch The redux dispatch function.
* @return {Object} The extended component props.
*/var mapDispatchToProps={selectGlobalLocation:selectGlobalLocation};/**
* Global selector that forces the customer to choose a location
* in location based shopping mode.
* @param {Object} props Components props.
* @return {Object}
*/var GlobalLocationSelector=function GlobalLocationSelector(_ref){var isLocationBasedShopping=_ref.isLocationBasedShopping,preferredLocation=_ref.preferredLocation,selectLocation=_ref.selectGlobalLocation,routePatternAllowList=_ref.routePatternAllowList,currentRoute=_ref.currentRoute,isPending=_ref.isPending;var closeSheetHandler=useCallback(function(location){if(location){selectLocation(location);}},[selectLocation]);var renderComponent=useMemo(function(){if(!currentRoute){return false;}var _ref2=currentRoute||{},pattern=_ref2.pattern;if(routePatternAllowList&&!routePatternAllowList.includes(pattern)){return false;}// Either when location based shopping is disabled or the customer
// already chose a location we skip the dialog.
return!isPending&&isLocationBasedShopping&&!preferredLocation;},[currentRoute,isLocationBasedShopping,isPending,preferredLocation,routePatternAllowList]);if(!renderComponent){return null;}return React.createElement(FulfillmentSheet,{stage:STAGE_SELECT_STORE,fulfillmentPath:MULTI_LINE_RESERVE,allowClose:false,onClose:closeSheetHandler,isInitialized:true,noProduct:true,noInventory:true,changeOnly:true,open:true});};GlobalLocationSelector.defaultProps={preferredLocation:null,isLocationBasedShopping:false,routePatternAllowList:null,currentRoute:null,isPending:false};export default connect(mapStateToProps,mapDispatchToProps)(GlobalLocationSelector);