diff --git a/web/components/Filters.js b/web/components/Filters.js index 1cb0653..a8b91cc 100644 --- a/web/components/Filters.js +++ b/web/components/Filters.js @@ -15,16 +15,20 @@ export default class Filters extends React.Component { } onMaxPriceChange(e) { + const maxPrice = e.target.value; + this.props.dispatch({ type: "SET_MAX_PRICE", - action: { maxPrice: e.target.value } + action: {maxPrice} }); } onMinPriceChange(e) { + const minPrice = e.target.value; + this.props.dispatch({ type: "SET_MIN_PRICE", - action: { minPrice: e.target.value } + action: {minPrice} }); } @@ -60,6 +64,7 @@ export default class Filters extends React.Component { } onRefreshClick() { + this.updateSearch(); } @@ -70,6 +75,19 @@ export default class Filters extends React.Component { } updateSearch () { + const {minPrice, maxPrice, minSize, maxSize} = this.props.filters; + + this.props.dispatch({ + type: 'UPDATE_ROUTE', + action: { + params: { + minPrice, + maxPrice, + minSize, + maxSize + } + } + }); this.props.dispatch({ type: "UPDATE_SEARCH" }); } diff --git a/web/components/Main.js b/web/components/Main.js index b47eb5f..4138430 100644 --- a/web/components/Main.js +++ b/web/components/Main.js @@ -25,15 +25,19 @@ class Main extends React.Component { if (props.initialState) { props.initialState.sort = props.initialState.sort || state.sort; - state.filters.rooms = props.initialState.rooms; - state.filters.category = props.initialState.category; - state.sort = props.initialState.sort || state.sort; - state.listingId = props.initialState.listingId; - state.bounds = props.initialState.bounds; - state.zoom = props.initialState.zoom; + state.filters.rooms = props.initialState.rooms; + state.filters.category = props.initialState.category; + state.sort = props.initialState.sort || state.sort; + state.listingId = props.initialState.listingId; + state.bounds = props.initialState.bounds; + state.zoom = props.initialState.zoom; if (state.listingId) { state.listingDetails = true; } + state.filters.minSize = props.initialState.minSize; + state.filters.maxSize = props.initialState.maxSize; + state.filters.minPrice = props.initialState.minPrice; + state.filters.maxPrice = props.initialState.maxPrice; } this.state = state; diff --git a/web/index.js b/web/index.js index ecc4f26..7714743 100644 --- a/web/index.js +++ b/web/index.js @@ -44,10 +44,12 @@ const getInitialState = (url) => { if (key === "zoom") { initialState.zoom = parseInt(value); } + + if (["minSize", "maxSize", "minPrice", "maxPrice"].includes(key)) { + initialState[key] = parseFloat(value); + } } - console.log('initial state dump', initialState); - console.log('initial state ROOMS', initialState.rooms); return initialState; } diff --git a/web/lib/router.js b/web/lib/router.js index d0bedcd..588b588 100644 --- a/web/lib/router.js +++ b/web/lib/router.js @@ -35,7 +35,18 @@ export default class Router { this.state = Object.assign(this.state, cloned.params); - const {listingId, bounds, sort, rooms = {}, category = {}, zoom} = this.state; + const { + listingId, + minPrice, + maxPrice, + minSize, + maxSize, + bounds, + sort, + rooms = {}, + category = {}, + zoom + } = this.state; if (listingId) { params.push(`listingId=${listingId}`); @@ -44,6 +55,21 @@ export default class Router { params.push(`sort=${sort}`); params.push(`bounds=${bounds}`); params.push(`zoom=${zoom}`); + if (maxPrice) { + params.push(`maxPrice=${maxPrice}`); + } + + if (minPrice) { + params.push(`minPrice=${minPrice}`); + } + + if (minSize) { + params.push(`minSize=${minSize}`); + } + + if (maxSize) { + params.push(`maxSize=${maxSize}`); + } params.push(`rooms=${Object.keys(rooms).filter(v => rooms[v]).join(",")}`); params.push(`category=${Object.keys(category).filter(v => category[v]).join(",")}`); }