diff --git a/src/containers/ListingPage/ListingPage.duck.js b/src/containers/ListingPage/ListingPage.duck.js index 02b5a9f1..c5895e4e 100644 --- a/src/containers/ListingPage/ListingPage.duck.js +++ b/src/containers/ListingPage/ListingPage.duck.js @@ -1,3 +1,4 @@ +import { pick } from 'lodash'; import { types } from '../../util/sdkLoader'; import { storableError } from '../../util/errors'; import { addMarketplaceEntities } from '../../ducks/marketplaceData.duck'; @@ -7,6 +8,8 @@ import { fetchCurrentUser } from '../../ducks/user.duck'; // ================ Action types ================ // +export const SET_INITAL_VALUES = 'app/ListingPage/SET_INITIAL_VALUES'; + export const SHOW_LISTING_REQUEST = 'app/ListingPage/SHOW_LISTING_REQUEST'; export const SHOW_LISTING_ERROR = 'app/ListingPage/SHOW_LISTING_ERROR'; @@ -27,11 +30,15 @@ const initialState = { fetchReviewsError: null, sendEnquiryInProgress: false, sendEnquiryError: null, + enquiryModalOpenForListingId: null, }; const listingPageReducer = (state = initialState, action = {}) => { const { type, payload } = action; switch (type) { + case SET_INITAL_VALUES: + return { ...initialState, ...payload }; + case SHOW_LISTING_REQUEST: return { ...state, id: payload.id, showListingError: null }; case SHOW_LISTING_ERROR: @@ -60,6 +67,11 @@ export default listingPageReducer; // ================ Action creators ================ // +export const setInitialValues = initialValues => ({ + type: SET_INITAL_VALUES, + payload: pick(initialValues, Object.keys(initialState)), +}); + export const showListingRequest = id => ({ type: SHOW_LISTING_REQUEST, payload: { id }, diff --git a/src/containers/ListingPage/ListingPage.js b/src/containers/ListingPage/ListingPage.js index 3b6268b6..f3294713 100644 --- a/src/containers/ListingPage/ListingPage.js +++ b/src/containers/ListingPage/ListingPage.js @@ -38,7 +38,7 @@ import { } from '../../components'; import { BookingDatesForm, TopbarContainer, EnquiryForm } from '../../containers'; -import { sendEnquiry, loadData } from './ListingPage.duck'; +import { sendEnquiry, loadData, setInitialValues } from './ListingPage.duck'; import EditIcon from './EditIcon'; import css from './ListingPage.css'; @@ -137,10 +137,11 @@ const gotoListingTab = (history, listing) => { export class ListingPageComponent extends Component { constructor(props) { super(props); + const { enquiryModalOpenForListingId, params } = props; this.state = { pageClassNames: [], imageCarouselOpen: false, - enquiryModalOpen: false, + enquiryModalOpen: enquiryModalOpenForListingId === params.id, }; this.handleSubmit = this.handleSubmit.bind(this); @@ -180,7 +181,21 @@ export class ListingPageComponent extends Component { } onContactUser() { - this.setState({ enquiryModalOpen: true }); + const { currentUser, history, useInitialValues, params } = this.props; + + if (!currentUser) { + const location = window.location; + const state = { from: `${location.pathname}${location.search}${location.hash}` }; + + // We need to log in before showing the modal, but first we need to ensure + // that modal does open when user is redirected back to this listingpage + useInitialValues(setInitialValues, { enquiryModalOpenForListingId: params.id }); + + // signup and return back to listingPage. + history.push(createResourceLocatorString('SignupPage', routeConfiguration(), {}, {}), state); + } else { + this.setState({ enquiryModalOpen: true }); + } } onSubmitEnquiry(values) { @@ -649,6 +664,7 @@ export class ListingPageComponent extends Component { ListingPageComponent.defaultProps = { currentUser: null, + enquiryModalOpenForListingId: null, showListingError: null, tab: 'listing', reviews: [], @@ -673,6 +689,7 @@ ListingPageComponent.propTypes = { getListing: func.isRequired, onManageDisableScrolling: func.isRequired, scrollingDisabled: bool.isRequired, + enquiryModalOpenForListingId: string, showListingError: propTypes.error, tab: oneOf(['book', 'listing']), useInitialValues: func.isRequired, @@ -690,6 +707,7 @@ const mapStateToProps = state => { fetchReviewsError, sendEnquiryInProgress, sendEnquiryError, + enquiryModalOpenForListingId, } = state.ListingPage; const { currentUser } = state.user; @@ -702,6 +720,7 @@ const mapStateToProps = state => { currentUser, getListing, scrollingDisabled: isScrollingDisabled(state), + enquiryModalOpenForListingId, showListingError, reviews, fetchReviewsError, @@ -727,6 +746,7 @@ const ListingPage = compose(withRouter, connect(mapStateToProps, mapDispatchToPr ListingPageComponent ); +ListingPage.setInitialValues = initialValues => setInitialValues(initialValues); ListingPage.loadData = loadData; export default ListingPage;