homeflowjs 0.13.44 → 0.13.45

package/instant-valuation/instant-valuation/instant-valuation.component.jsx

@@ -25,6 +25,8 @@ const INITIAL_STATE = {
     properties: [],
     property_type: '',
     bedrooms: '',
+    lat: '',
+    lng: '',
   },
   lead: {
     first_name: '',
@@ -122,6 +124,7 @@ class InstantValuation extends Component {
       lead_url_referrer: referrerURL,
     };
 
+
     const params = flatten({ search: restOfSearch, lead });
 
     const query = new URLSearchParams(params);
@@ -200,6 +203,11 @@ class InstantValuation extends Component {
             ...prevState.lead,
             full_address: this.constructor.formatAddress(json.Addresses[0]),
           },
+          search: {
+            ...prevState.search,
+            lat: json.Latitude,
+            lng: json.Longitude,
+          },
         }));
 
         return null;

package/instant-valuation/result-step/result-step.component.jsx

@@ -149,18 +149,20 @@ const ResultStep = ({
             </div>
           )}
 
-          {!!recentSales?.length && <ValuationMap recentSales={recentSales} />}
+          <ValuationMap recentSales={recentSales} search={search} />
 
           <div style={{ clear: 'both' }} />
 
-          <div className="recently-sold">
-            <h3>Recently sold in the area</h3>
-            <p>These properties near you were sold recently.</p>
+          {!!recentSales?.length && (
+            <div className="recently-sold">
+              <h3>Recently sold in the area</h3>
+              <p>These properties near you were sold recently.</p>
 
-            <ul id="recently-sold-list">
-              {recentSales?.map((property) => recentSale(property))}
-            </ul>
-          </div>
+              <ul id="recently-sold-list">
+                {recentSales?.map((property) => recentSale(property))}
+              </ul>
+            </div>
+          )}
 
           <div className="clear" />
         </div>

package/instant-valuation/result-step/valuation-map.component.jsx

@@ -9,19 +9,21 @@ import {
 
 import '../../properties/properties-map/leaflet.css';
 
-const ValuationMap = ({ recentSales }) => {
+const ValuationMap = ({ recentSales, search }) => {
+  if (!recentSales.length && !search.lat && !search.lng) return null;
+
   const defaultIcon = L.icon({
     iconRetinaUrl: '/assets/marker-icon.png',
     iconUrl: '/assets/marker-icon.png',
     shadowUrl: '/assets/marker-shadow.png',
   });
 
-  const bounds = latLngBounds([
+  const bounds = recentSales?.length ? latLngBounds([
     parseFloat(recentSales[0].latitude),
     parseFloat(recentSales[0].longitude),
-  ]);
+  ]) : null;
 
-  const markers = recentSales?.map((property) => {
+  const markers = recentSales?.length ? recentSales?.map((property) => {
     bounds.extend([property.latitude, property.longitude]);
 
     return (
@@ -31,11 +33,17 @@ const ValuationMap = ({ recentSales }) => {
         icon={defaultIcon}
       />
     );
-  });
+  }) : (
+    <Marker
+      position={[search.lat, search.lng]}
+      icon={defaultIcon}
+    />
+  );
 
   return (
     <MapContainer
-      bounds={bounds}
+      {...(!!recentSales.length && bounds && { bounds })}
+      {...(!recentSales.length && { center: [search.lat, search.lng], zoom: 14 })}
       scrollWheelZoom={false}
       style={{ height: 300 }}
     >
@@ -50,6 +58,14 @@ const ValuationMap = ({ recentSales }) => {
 
 ValuationMap.propTypes = {
   recentSales: PropTypes.array.isRequired,
+  search: PropTypes.shape({
+    lat: PropTypes.number,
+    lng: PropTypes.number,
+  }),
+};
+
+ValuationMap.defaultProps = {
+  search: null,
 };
 
 export default ValuationMap;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "homeflowjs",
-  "version": "0.13.44",
+  "version": "0.13.45",
   "sideEffects": [
     "modal/**/*",
     "user/default-profile/**/*",