homeflowjs 0.11.6 → 0.11.8

package/branches/branches-map/branches-map.component.jsx

@@ -23,6 +23,7 @@ const BranchesMap = ({
   displayPopup,
   selectedBranch, 
   branches: branchesProp,
+  MapContainerProps,
 }) => {
   let branches = !!branchesProp.length
     ? branchesProp
@@ -125,6 +126,7 @@ const BranchesMap = ({
       bounds={bounds}
       scrollWheelZoom={scrollWheelZoom}
       style={{ height: '100%' }}
+      {...MapContainerProps}
     >
       {google ? (
         <ReactLeafletGoogleLayer apiKey={gmapsKey} type="roadmap" />
@@ -149,7 +151,8 @@ BranchesMap.propTypes = {
   markerClickHandler: PropTypes.func,
   displayPopup : PropTypes.bool,
   selectedBranch: PropTypes.object,
-  branches: PropTypes.arrayOf(PropTypes.object)
+  branches: PropTypes.arrayOf(PropTypes.object),
+  MapContainerProps: PropTypes.object
 };
 
 BranchesMap.defaultProps = {
@@ -162,7 +165,8 @@ BranchesMap.defaultProps = {
   markerClickHandler: () => {},
   displayPopup: true,
   selectedBranch: {},
-  branches: []
+  branches: [],
+  MapContainerProps: {}
 };
 
 const mapStateToProps = (state) => ({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "homeflowjs",
-  "version": "0.11.6",
+  "version": "0.11.8",
   "description": "JavaScript toolkit for Homeflow themes",
   "main": "index.js",
   "scripts": {

package/properties/property-map/property-leaflet-map.component.jsx

@@ -6,11 +6,13 @@ import { MapContainer, TileLayer, Marker, Popup } from 'react-leaflet';
 const PropertyLeafletMap = ({ CustomPopup }) => {
   const property = Homeflow.get('property');
   const customIcon = Homeflow.get('custom_map_icon');
+  const customIconAnchor = Homeflow.get('custom_map_icon_anchor');
 
   const defaultIcon = L.icon({
     iconRetinaUrl: '/assets/marker-icon.png',
     iconUrl: customIcon || '/assets/marker-icon.png',
     shadowUrl: '/assets/marker-shadow.png',
+    iconAnchor: customIconAnchor || [12, 41]
   });
 
   return (

package/search/location-input/location-input.component.jsx

@@ -17,6 +17,7 @@ class LocationInput extends Component {
     this.onLocationChange = this.onLocationChange.bind(this);
     // wait half a second after typing stops before fetching results
     this.debouncedLoadSuggestions = debounce(this.loadSuggestions, DEBOUNCE_DELAY);
+    this.abortContRef = React.createRef();
   }
 
   onLocationChange(event, { newValue }) {
@@ -31,8 +32,14 @@ class LocationInput extends Component {
   }
 
   getSuggestions(q) {
-    return fetch(`/places?term=${q}`)
-            .then(response => response.json());
+    if (this.abortContRef.current) this.abortContRef.current.abort();
+    this.abortContRef.current = new AbortController();
+    return fetch(`/places?term=${q}`, { signal: this.abortContRef.current.signal })
+            .then(response => response.json())
+            .catch(e => { 
+              if (e.code === 20) return;
+              console.error(e);
+            });
   }
 
   renderSuggestion(suggestion) {
@@ -51,7 +58,7 @@ class LocationInput extends Component {
     this.getSuggestions(value)
       .then((data) => {
         const suggestions = data ? (
-          data
+         data
             .filter((_item, index) => index < 15 )
             .map((item) => (
               { label: item[0], place: item[1] }