fix(FavoritePlaceScreen): Do not show account header while setting up…

… account.

lib/components/app/responsive-webapp.js

@@ -24,6 +24,7 @@ import {
   AUTH0_SCOPE,
   ACCOUNT_SETTINGS_PATH,
   CREATE_ACCOUNT_PATH,
+  CREATE_ACCOUNT_PLACES_PATH,
   CREATE_ACCOUNT_VERIFY_PATH,
   PLACES_PATH,
   TRIPS_PATH,
@@ -162,11 +163,11 @@ const mapStateToProps = (state, ownProps) => {
     activeItinerary: getActiveItinerary(state.otp),
     activeSearchId: state.otp.activeSearchId,
     currentPosition: state.otp.location.currentPosition,
-    query: state.otp.currentQuery,
-    searches: state.otp.searches,
-    mobileScreen: state.otp.ui.mobileScreen,
     initZoomOnLocate: state.otp.config.map && state.otp.config.map.initZoomOnLocate,
+    mobileScreen: state.otp.ui.mobileScreen,
     modeGroups: state.otp.config.modeGroups,
+    query: state.otp.currentQuery,
+    searches: state.otp.searches,
     title
   }
 }
@@ -237,7 +238,7 @@ class RouterWrapperWithAuth0 extends Component {
             />
             <Route
               component={FavoritePlaceScreen}
-              path={`${PLACES_PATH}/:id`}
+              path={[`${CREATE_ACCOUNT_PLACES_PATH}/:id`, `${PLACES_PATH}/:id`]}
             />
             <Route
               component={SavedTripScreen}

lib/components/user/places/favorite-place-screen.js

@@ -10,6 +10,7 @@ import * as yup from 'yup'
 import AccountPage from '../account-page'
 import BackLink from '../back-link'
 import * as userActions from '../../../actions/user'
+import { CREATE_ACCOUNT_PLACES_PATH } from '../../../util/constants'
 import { RETURN_TO_CURRENT_ROUTE } from '../../../util/ui'
 import { isHomeOrWork, PLACE_TYPES } from '../../../util/user'
 import withLoggedInUserSupport from '../with-logged-in-user-support'
@@ -58,8 +59,8 @@ class FavoritePlaceScreen extends Component {
    * or null if the requested place is not found.
    */
   _getPlaceToEdit = user => {
-    const { isCreating, placeIndex } = this.props
-    return isCreating
+    const { isNewPlace, placeIndex } = this.props
+    return isNewPlace
       ? BLANK_PLACE
       : (user.savedLocations
         ? user.savedLocations[placeIndex]
@@ -86,7 +87,7 @@ class FavoritePlaceScreen extends Component {
   }
 
   render () {
-    const { isCreating, loggedInUser } = this.props
+    const { isCreating, isNewPlace, loggedInUser } = this.props
     // Get the places as shown (and not as retrieved from db), so that the index passed from URL applies
     // (indexes 0 and 1 are for Home and Work locations).
     const place = this._getPlaceToEdit(loggedInUser)
@@ -95,7 +96,7 @@ class FavoritePlaceScreen extends Component {
     let heading
     if (!place) {
       heading = 'Place not found'
-    } else if (isCreating) {
+    } else if (isNewPlace) {
       heading = 'Add a new place'
     } else if (isFixed) {
       heading = `Edit ${place.name}`
@@ -104,7 +105,7 @@ class FavoritePlaceScreen extends Component {
     }
 
     return (
-      <AccountPage>
+      <AccountPage subnav={!isCreating}>
         <BackLink />
         <Formik
           initialValues={clone(place)}
@@ -142,9 +143,11 @@ class FavoritePlaceScreen extends Component {
 // connect to the redux store
 
 const mapStateToProps = (state, ownProps) => {
-  const placeIndex = ownProps.match.params.id
+  const { params, path } = ownProps.match
+  const placeIndex = params.id
   return {
-    isCreating: placeIndex === 'new',
+    isCreating: path.startsWith(CREATE_ACCOUNT_PLACES_PATH),
+    isNewPlace: placeIndex === 'new',
     loggedInUser: state.user.loggedInUser,
     placeIndex
   }

lib/components/user/places/favorite-places-list.js

@@ -3,15 +3,15 @@ import { ControlLabel } from 'react-bootstrap'
 import { connect } from 'react-redux'
 
 import * as userActions from '../../../actions/user'
-import { PLACES_PATH } from '../../../util/constants'
+import { CREATE_ACCOUNT_PLACES_PATH, PLACES_PATH } from '../../../util/constants'
 import { isHomeOrWork } from '../../../util/user'
 import FavoritePlaceRow from './favorite-place-row'
 
 /**
  * Renders an editable list user's favorite locations, and lets the user add a new one.
  * Additions, edits, and deletions of places take effect immediately.
  */
-const FavoritePlacesList = ({ deleteUserPlace, loggedInUser }) => {
+const FavoritePlacesList = ({ deleteUserPlace, isCreating, loggedInUser }) => {
   const { savedLocations } = loggedInUser
   return (
     <div>
@@ -22,7 +22,7 @@ const FavoritePlacesList = ({ deleteUserPlace, loggedInUser }) => {
           isFixed={isHomeOrWork(place)}
           key={index}
           onDelete={() => deleteUserPlace(index)}
-          path={`${PLACES_PATH}/${index}`}
+          path={`${isCreating ? CREATE_ACCOUNT_PLACES_PATH : PLACES_PATH}/${index}`}
           place={place}
         />
       )
@@ -37,7 +37,10 @@ const FavoritePlacesList = ({ deleteUserPlace, loggedInUser }) => {
 // connect to the redux store
 
 const mapStateToProps = (state, ownProps) => {
+  const path = state.router.location.pathname
+  const isCreating = path === CREATE_ACCOUNT_PLACES_PATH
   return {
+    isCreating,
     loggedInUser: state.user.loggedInUser
   }
 }

lib/util/constants.js

@@ -11,6 +11,7 @@ export const PLACES_PATH = `${ACCOUNT_PATH}/places`
 export const CREATE_ACCOUNT_PATH = `${ACCOUNT_PATH}/create`
 export const CREATE_ACCOUNT_TERMS_PATH = `${CREATE_ACCOUNT_PATH}/terms`
 export const CREATE_ACCOUNT_VERIFY_PATH = `${CREATE_ACCOUNT_PATH}/verify`
+export const CREATE_ACCOUNT_PLACES_PATH = `${CREATE_ACCOUNT_PATH}/places`
 export const CREATE_TRIP_PATH = `${TRIPS_PATH}/new`
 
 // Gets the root URL, e.g. https://otp-instance.example.com:8080, computed once for all.