From 8284ba0e8f4a409407ebbc8d905c9d97ec87d70a Mon Sep 17 00:00:00 2001 From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com> Date: Thu, 17 Sep 2020 18:15:01 -0400 Subject: [PATCH 1/3] fix(SavedTripScreen): Do not leave screen if there is an error saving a trip (new/existing). --- lib/components/user/saved-trip-screen.js | 29 ++++++++++++++++++++++-- 1 file changed, 27 insertions(+), 2 deletions(-) diff --git a/lib/components/user/saved-trip-screen.js b/lib/components/user/saved-trip-screen.js index 70932da42..dd7309201 100644 --- a/lib/components/user/saved-trip-screen.js +++ b/lib/components/user/saved-trip-screen.js @@ -1,3 +1,4 @@ +import qs from 'qs' import React, { Component } from 'react' import { connect } from 'react-redux' import { withLoginRequired } from 'use-auth0-hooks' @@ -102,12 +103,35 @@ class SavedTripScreen extends Component { _handleSaveNewTrip = async () => { await this._updateMonitoredTrip() - this._goToTripPlanner() + + // For new trips, if a trip with the same ui_activeSearch value in queryParams + // appears in the monitored trips redux state, + // then we know that save was successful and we can proceed. + const { activeSearchId } = this.props + + const savedTrip = this.props.monitoredTrips.find(trip => { + const tripQueryParams = qs.parse(trip.queryParams.split('?')[1]) + return tripQueryParams.ui_activeSearch === activeSearchId + }) + + if (savedTrip) { + this._goToTripPlanner() + } } _handleSaveTripEdits = async () => { + const { monitoredTrip } = this.state + await this._updateMonitoredTrip() - this._goToSavedTrips() + + // For existing trips, if the lastUpdated value (long) for the trip with the same id in monitored trips redux state + // is more recent that our copy, then we know that save was successful and we can proceed. + // (The state is not updated upon save because the next normal step is to close this screen.) + const savedTrip = this.props.monitoredTrips.find(trip => trip.id === monitoredTrip.id) + + if (savedTrip.lastUpdated > monitoredTrip.lastUpdated) { + this._goToSavedTrips() + } } /** @@ -215,6 +239,7 @@ const mapStateToProps = (state, ownProps) => { const activeItinerary = activeSearch && activeSearch.activeItinerary const itineraries = getActiveItineraries(state.otp) || [] return { + activeSearchId: state.otp.activeSearchId, itinerary: itineraries[activeItinerary], loggedInUser: state.user.loggedInUser, monitoredTrips: state.user.loggedInUserMonitoredTrips, From 861f5e8d951548dac61c07d5083f2b60682f604a Mon Sep 17 00:00:00 2001 From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com> Date: Fri, 9 Oct 2020 15:21:02 -0400 Subject: [PATCH 2/3] refactor(SavedTripScreen): Move navigation after trip persistence to actions/user. --- lib/actions/user.js | 3 +++ lib/components/user/saved-trip-screen.js | 3 ++- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/lib/actions/user.js b/lib/actions/user.js index 61c43ffd7..7ef6ec3c3 100644 --- a/lib/actions/user.js +++ b/lib/actions/user.js @@ -154,6 +154,9 @@ export function createOrUpdateUserMonitoredTrip (tripData, isNew, silentOnSucces // Reload user's monitored trips after add/update. await dispatch(fetchUserMonitoredTrips(accessToken)) + + // Finally, navigate to the saved trips page. + this.props.routeTo('/savedtrips') } else { alert(`An error was encountered:\n${JSON.stringify(result)}`) } diff --git a/lib/components/user/saved-trip-screen.js b/lib/components/user/saved-trip-screen.js index 750e01c75..094eebdc8 100644 --- a/lib/components/user/saved-trip-screen.js +++ b/lib/components/user/saved-trip-screen.js @@ -94,11 +94,12 @@ class SavedTripScreen extends Component { /** * Saves a trip and returns to the saved trips screen. + * On success, this operation will also make the browser + * navigate to the Saved trips page. * @param {*} monitoredTrip The trip edited state to be saved, provided by Formik. */ _handleSaveTrip = async monitoredTrip => { await this._updateMonitoredTrip(monitoredTrip) - this._goToSavedTrips() } // Make an index of pane components, so we don't render all panes at once on every render. From 3fd0a0ab2a63ee98522c108e5e31ae031777b83c Mon Sep 17 00:00:00 2001 From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com> Date: Fri, 9 Oct 2020 15:40:10 -0400 Subject: [PATCH 3/3] refactor(SavedTripScreen): Fix a few things. --- lib/actions/user.js | 3 ++- lib/components/user/saved-trip-screen.js | 21 +++++++-------------- 2 files changed, 9 insertions(+), 15 deletions(-) diff --git a/lib/actions/user.js b/lib/actions/user.js index 7ef6ec3c3..348d39628 100644 --- a/lib/actions/user.js +++ b/lib/actions/user.js @@ -1,5 +1,6 @@ import { createAction } from 'redux-actions' +import { routeTo } from './ui' import { addTrip, addUser, @@ -156,7 +157,7 @@ export function createOrUpdateUserMonitoredTrip (tripData, isNew, silentOnSucces await dispatch(fetchUserMonitoredTrips(accessToken)) // Finally, navigate to the saved trips page. - this.props.routeTo('/savedtrips') + dispatch(routeTo('/savedtrips')) } else { alert(`An error was encountered:\n${JSON.stringify(result)}`) } diff --git a/lib/components/user/saved-trip-screen.js b/lib/components/user/saved-trip-screen.js index 094eebdc8..a8b6bed2c 100644 --- a/lib/components/user/saved-trip-screen.js +++ b/lib/components/user/saved-trip-screen.js @@ -71,11 +71,14 @@ function hasMaxTripCount (trips) { */ class SavedTripScreen extends Component { /** - * Persists changes to edited trip. + * Persists changes to the edited trip. + * On success, this operation will also make the browser + * navigate to the Saved trips page. + * @param {*} monitoredTrip The trip edited state to be saved, provided by Formik. */ - _updateMonitoredTrip = async monitoredTrip => { + _updateMonitoredTrip = monitoredTrip => { const { isCreating, createOrUpdateUserMonitoredTrip } = this.props - await createOrUpdateUserMonitoredTrip(monitoredTrip, isCreating) + createOrUpdateUserMonitoredTrip(monitoredTrip, isCreating) } /** @@ -92,16 +95,6 @@ class SavedTripScreen extends Component { this.props.routeTo('/savedtrips') } - /** - * Saves a trip and returns to the saved trips screen. - * On success, this operation will also make the browser - * navigate to the Saved trips page. - * @param {*} monitoredTrip The trip edited state to be saved, provided by Formik. - */ - _handleSaveTrip = async monitoredTrip => { - await this._updateMonitoredTrip(monitoredTrip) - } - // Make an index of pane components, so we don't render all panes at once on every render. _panes = { basics: TripBasicsPane, @@ -167,7 +160,7 @@ class SavedTripScreen extends Component { validateOnChange={false} validateOnBlur validationSchema={validationSchema} - onSubmit={this._handleSaveTrip} + onSubmit={this._updateMonitoredTrip} initialValues={clone(monitoredTrip)} > {