homeflowjs 0.10.9 → 0.10.11

package/actions/branches.actions.js

@@ -1,5 +1,10 @@
 import BranchesActionTypes from './branches.types';
 
+export const setBranches = (payload) => ({
+  type: BranchesActionTypes.SET_BRANCHES,
+  payload,
+});
+
 export const setBranchesSearch = (payload) => ({
   type: BranchesActionTypes.SET_BRANCHES_SEARCH,
   payload,

package/actions/branches.types.js

@@ -1,4 +1,5 @@
 const BranchesActionTypes = {
+  SET_BRANCHES: 'SET_BRANCHES',
   SET_BRANCHES_SEARCH: 'SET_BRANCHES_SEARCH',
 };
 

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

@@ -13,7 +13,7 @@ import ReactLeafletGoogleLayer from 'react-leaflet-google-layer';
 import 'leaflet/dist/leaflet.css';
 
 const BranchesMap = ({
-  CustomPopup, google, gmapsKey, iconConfig, fallbackLatLng,
+  CustomPopup, google, gmapsKey, iconConfig, fallbackLatLng, scrollWheelZoom
 }) => {
   let branches = Homeflow.get('branches');
   let showMarkers = true;
@@ -30,12 +30,24 @@ const BranchesMap = ({
     shadowUrl: '/assets/marker-shadow.png',
   };
 
-  const icon = L.icon(iconConfig || defaultIconConfig);
+  let icon = L.icon(iconConfig || defaultIconConfig);
 
   const bounds = latLngBounds([branches[0].lat, branches[0].lng]);
 
   const markers = branches.map((branch) => {
     bounds.extend([branch.lat, branch.lng]);
+    // check if branch object have mapIcon payload, example:
+    // mapIcon: {
+    //   iconUrl: 'specific-path.png' || 'data:image/svg+xml;utf8,<svg></svg>',
+    //   iconSize: [149, 66],
+    // }
+    if ('mapIcon' in branch) icon = L.icon(branch.mapIcon);
+    // check if branch object have mapDivIcon payload, example:
+    // mapDivIcon: {
+    //   html: 'html string',
+    //   iconSize: [149, 66],
+    // }
+    if ('mapDivIcon' in branch) icon = L.divIcon(branch.mapDivIcon);
 
     return (
       <Marker
@@ -77,7 +89,7 @@ const BranchesMap = ({
     <MapContainer
       center={[branches[0].lat, branches[0].lng]}
       bounds={bounds}
-      scrollWheelZoom={false}
+      scrollWheelZoom={scrollWheelZoom}
       style={{ height: '100%' }}
     >
       {google ? (
@@ -99,6 +111,7 @@ BranchesMap.propTypes = {
   gmapsKey: PropTypes.string,
   iconConfig: PropTypes.object,
   fallbackLatLng: PropTypes.object,
+  scrollWheelZoom: PropTypes.bool,
 };
 
 BranchesMap.defaultProps = {
@@ -107,6 +120,7 @@ BranchesMap.defaultProps = {
   gmapsKey: null,
   iconConfig: null,
   fallbackLatLng: { lat: 51.509865, lng: -0.118092 },
+  scrollWheelZoom: false,
 };
 
 const mapStateToProps = (state) => ({

package/package.json

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

package/properties/properties-display/properties-display.component.jsx

@@ -58,10 +58,10 @@ const PropertiesDisplay = ({
          */
         if (inserts && (index % inserts[0].frequency) === 0 && index !== 0) {
           return (
-            <>
+            <React.Fragment key={property.property_id}>
               {inserts[0].component}
-              <Item key={property.property_id} property={property} {...other} />
-            </>
+              <Item property={property} {...other} />
+            </React.Fragment>
           );
         }
         return (

package/properties/stamp-duty-calculator/default-calculator.component.jsx

@@ -31,7 +31,7 @@ const DefaultCalculator = ({ purchasePrice, setPurchasePrice, firstTimeBuyer, ad
     }
 
     const {
-      rate1, 
+      rate1,
       rate2,
       rate3,
       rate4,
@@ -56,7 +56,7 @@ const DefaultCalculator = ({ purchasePrice, setPurchasePrice, firstTimeBuyer, ad
       setPurchasePrice(property.price_value);
       calculateStampDuty(property.price_value);
     }
-  }, []);
+  }, [firstTimeBuyer, additionalProperty]);
 
   const handlePriceInputChange = ({ target: { value } }) => {
     const numberString = value.substring(1);
@@ -102,7 +102,7 @@ const DefaultCalculator = ({ purchasePrice, setPurchasePrice, firstTimeBuyer, ad
         </p>
 
         {(firstTimeBuyer && property.price_value >= 625000) && (
-          <p id='first_time_buyer_info'>First time buyers purchasing property for more than £625,000 will not be entitled to any relief and will pay SDLT at the standard rates.</p>
+          <p id="first_time_buyer_info">First time buyers purchasing property for more than £625,000 will not be entitled to any relief and will pay SDLT at the standard rates.</p>
         )}
 
         <div className="results-table-wrap">

package/properties/stamp-duty-calculator/stamp-duty-calculator.component.jsx

@@ -7,7 +7,7 @@ import './stamp-duty-calculator.styles.scss';
 
 const StampDutyCalculator = ({ scotland, themePreferences }) => {
   const [type, setType] = useState('residential');
-  const [purchaseType, setPurchaseType] = useState('additional')
+  const [purchaseType, setPurchaseType] = useState('firstTimeBuyer')
   const [purchasePrice, setPurchasePrice] = useState();
 
   const renderCalculator = () => {
@@ -62,19 +62,19 @@ const StampDutyCalculator = ({ scotland, themePreferences }) => {
         <div className="form-group">
           <button
             type="button"
-            className={`stamp-duty-cal__type ${purchaseType === 'additional' ? 'selected' : ''}`}
-            onClick={() => setPurchaseType('additional')}
+            className={`stamp-duty-cal__type ${purchaseType === 'firstTimeBuyer' ? 'selected' : ''}`}
+            onClick={() => setPurchaseType('firstTimeBuyer')}
           >
-            Additional Property
+            First Time Buyer
           </button>
         </div>
         <div className="form-group">
           <button
             type="button"
-            className={`stamp-duty-cal__type ${purchaseType === 'firstTimeBuyer' ? 'selected' : ''}`}
-            onClick={() => setPurchaseType('firstTimeBuyer')}
+            className={`stamp-duty-cal__type ${purchaseType === 'additional' ? 'selected' : ''}`}
+            onClick={() => setPurchaseType('additional')}
           >
-            First Time Buyer
+            Additional Property
           </button>
         </div>
       </div>

package/reducers/branches.reducer.js

@@ -1,11 +1,17 @@
 import BranchesActionTypes from '../actions/branches.types';
 
 const INITIAL_STATE = {
+  branches: [],
   branchesSearch: '',
 };
 
 const branchesReducer = (state = INITIAL_STATE, action) => {
   switch (action.type) {
+    case BranchesActionTypes.SET_BRANCHES:
+      return {
+        ...state,
+        branches: action.payload,
+      };
     case BranchesActionTypes.SET_BRANCHES_SEARCH:
       return {
         ...state,

package/reducers/branches.reducer.test.js

@@ -0,0 +1,10 @@
+import branchesReducer from './branches.reducer';
+
+describe('branchesReducer', () => {
+  it('Sets the branches when it receives the SET_BRANCHES action', () => {
+    const state = { branches: [] };
+    const reducedState = branchesReducer(state, { type: 'SET_BRANCHES', payload: [1, 2, 3] });
+
+    expect(reducedState.branches).toEqual([1, 2, 3]);
+  });
+});