homeflowjs 0.13.44 → 0.13.45
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -25,6 +25,8 @@ const INITIAL_STATE = {
|
|
25
25
|
properties: [],
|
26
26
|
property_type: '',
|
27
27
|
bedrooms: '',
|
28
|
+
lat: '',
|
29
|
+
lng: '',
|
28
30
|
},
|
29
31
|
lead: {
|
30
32
|
first_name: '',
|
@@ -122,6 +124,7 @@ class InstantValuation extends Component {
|
|
122
124
|
lead_url_referrer: referrerURL,
|
123
125
|
};
|
124
126
|
|
127
|
+
|
125
128
|
const params = flatten({ search: restOfSearch, lead });
|
126
129
|
|
127
130
|
const query = new URLSearchParams(params);
|
@@ -200,6 +203,11 @@ class InstantValuation extends Component {
|
|
200
203
|
...prevState.lead,
|
201
204
|
full_address: this.constructor.formatAddress(json.Addresses[0]),
|
202
205
|
},
|
206
|
+
search: {
|
207
|
+
...prevState.search,
|
208
|
+
lat: json.Latitude,
|
209
|
+
lng: json.Longitude,
|
210
|
+
},
|
203
211
|
}));
|
204
212
|
|
205
213
|
return null;
|
@@ -149,18 +149,20 @@ const ResultStep = ({
|
|
149
149
|
</div>
|
150
150
|
)}
|
151
151
|
|
152
|
-
|
152
|
+
<ValuationMap recentSales={recentSales} search={search} />
|
153
153
|
|
154
154
|
<div style={{ clear: 'both' }} />
|
155
155
|
|
156
|
-
|
157
|
-
<
|
158
|
-
|
156
|
+
{!!recentSales?.length && (
|
157
|
+
<div className="recently-sold">
|
158
|
+
<h3>Recently sold in the area</h3>
|
159
|
+
<p>These properties near you were sold recently.</p>
|
159
160
|
|
160
|
-
|
161
|
-
|
162
|
-
|
163
|
-
|
161
|
+
<ul id="recently-sold-list">
|
162
|
+
{recentSales?.map((property) => recentSale(property))}
|
163
|
+
</ul>
|
164
|
+
</div>
|
165
|
+
)}
|
164
166
|
|
165
167
|
<div className="clear" />
|
166
168
|
</div>
|
@@ -9,19 +9,21 @@ import {
|
|
9
9
|
|
10
10
|
import '../../properties/properties-map/leaflet.css';
|
11
11
|
|
12
|
-
const ValuationMap = ({ recentSales }) => {
|
12
|
+
const ValuationMap = ({ recentSales, search }) => {
|
13
|
+
if (!recentSales.length && !search.lat && !search.lng) return null;
|
14
|
+
|
13
15
|
const defaultIcon = L.icon({
|
14
16
|
iconRetinaUrl: '/assets/marker-icon.png',
|
15
17
|
iconUrl: '/assets/marker-icon.png',
|
16
18
|
shadowUrl: '/assets/marker-shadow.png',
|
17
19
|
});
|
18
20
|
|
19
|
-
const bounds = latLngBounds([
|
21
|
+
const bounds = recentSales?.length ? latLngBounds([
|
20
22
|
parseFloat(recentSales[0].latitude),
|
21
23
|
parseFloat(recentSales[0].longitude),
|
22
|
-
]);
|
24
|
+
]) : null;
|
23
25
|
|
24
|
-
const markers = recentSales?.map((property) => {
|
26
|
+
const markers = recentSales?.length ? recentSales?.map((property) => {
|
25
27
|
bounds.extend([property.latitude, property.longitude]);
|
26
28
|
|
27
29
|
return (
|
@@ -31,11 +33,17 @@ const ValuationMap = ({ recentSales }) => {
|
|
31
33
|
icon={defaultIcon}
|
32
34
|
/>
|
33
35
|
);
|
34
|
-
})
|
36
|
+
}) : (
|
37
|
+
<Marker
|
38
|
+
position={[search.lat, search.lng]}
|
39
|
+
icon={defaultIcon}
|
40
|
+
/>
|
41
|
+
);
|
35
42
|
|
36
43
|
return (
|
37
44
|
<MapContainer
|
38
|
-
bounds
|
45
|
+
{...(!!recentSales.length && bounds && { bounds })}
|
46
|
+
{...(!recentSales.length && { center: [search.lat, search.lng], zoom: 14 })}
|
39
47
|
scrollWheelZoom={false}
|
40
48
|
style={{ height: 300 }}
|
41
49
|
>
|
@@ -50,6 +58,14 @@ const ValuationMap = ({ recentSales }) => {
|
|
50
58
|
|
51
59
|
ValuationMap.propTypes = {
|
52
60
|
recentSales: PropTypes.array.isRequired,
|
61
|
+
search: PropTypes.shape({
|
62
|
+
lat: PropTypes.number,
|
63
|
+
lng: PropTypes.number,
|
64
|
+
}),
|
65
|
+
};
|
66
|
+
|
67
|
+
ValuationMap.defaultProps = {
|
68
|
+
search: null,
|
53
69
|
};
|
54
70
|
|
55
71
|
export default ValuationMap;
|