diff --git a/app/component/DepartureListContainer.js b/app/component/DepartureListContainer.js index 57a4452f88..3c7b3781df 100644 --- a/app/component/DepartureListContainer.js +++ b/app/component/DepartureListContainer.js @@ -21,8 +21,8 @@ const asDepartures = stoptimes => : stoptimes.map(stoptime => { const isArrival = stoptime.pickupType === 'NONE'; /* OTP returns either scheduled time or realtime prediction in - * 'realtimeDeparture' and 'realtimeArrival' fields. - * EXCEPT when state is CANCELLED, then it returns -1 for realtime */ + * 'realtimeDeparture' and 'realtimeArrival' fields. + * EXCEPT when state is CANCELLED, then it returns -1 for realtime */ const canceled = stoptime.realtimeState === 'CANCELED'; const arrivalTime = stoptime.serviceDay + diff --git a/app/component/StopPageContentContainer.js b/app/component/StopPageContentContainer.js index 0acc6abb8b..eda123a204 100644 --- a/app/component/StopPageContentContainer.js +++ b/app/component/StopPageContentContainer.js @@ -3,6 +3,7 @@ import React from 'react'; import Relay from 'react-relay/classic'; import some from 'lodash/some'; import mapProps from 'recompose/mapProps'; +import connectToStores from 'fluxible-addons-react/connectToStores'; import StopPageTabContainer from './StopPageTabContainer'; import DepartureListHeader from './DepartureListHeader'; @@ -23,9 +24,11 @@ class StopPageContentOptions extends React.Component { variables: PropTypes.shape({ date: PropTypes.string.isRequired, }).isRequired, + setVariables: PropTypes.func.isRequired, }).isRequired, initialDate: PropTypes.string.isRequired, setDate: PropTypes.func.isRequired, + currentTime: PropTypes.number.isRequired, }; static defaultProps = { @@ -39,6 +42,13 @@ class StopPageContentOptions extends React.Component { }; } + componentWillReceiveProps({ relay, currentTime }) { + const currUnix = this.props.currentTime; + if (currUnix !== currentTime) { + relay.setVariables({ startTime: currUnix }); + } + } + onDateChange = ({ target }) => { this.props.setDate(target.value); }; @@ -102,6 +112,7 @@ const StopPageContent = withBreakpoint( relay={props.relay} initialDate={props.initialDate} setDate={props.setDate} + currentTime={props.currentTime} /> ), ); @@ -119,9 +130,15 @@ StopPageContentOrEmpty.propTypes = { }).isRequired, }; -export default Relay.createContainer(StopPageContentOrEmpty, { - fragments: { - stop: ({ date }) => Relay.QL` +export default Relay.createContainer( + connectToStores(StopPageContentOrEmpty, ['TimeStore'], ({ getStore }) => ({ + currentTime: getStore('TimeStore') + .getCurrentTime() + .unix(), + })), + { + fragments: { + stop: ({ date }) => Relay.QL` fragment on Stop { url stoptimes: stoptimesWithoutPatterns(startTime: $startTime, timeRange: $timeRange, numberOfDepartures: $numberOfDepartures) { @@ -130,12 +147,13 @@ export default Relay.createContainer(StopPageContentOrEmpty, { ${TimetableContainer.getFragment('stop', { date })} } `, - }, + }, - initialVariables: { - startTime: 0, - timeRange: 3600 * 12, - numberOfDepartures: 100, - date: null, + initialVariables: { + startTime: 0, + timeRange: 3600 * 12, + numberOfDepartures: 100, + date: null, + }, }, -}); +); diff --git a/app/component/TripStopListContainer.js b/app/component/TripStopListContainer.js index 2dbb4dd4b4..40ff189404 100644 --- a/app/component/TripStopListContainer.js +++ b/app/component/TripStopListContainer.js @@ -18,6 +18,9 @@ class TripStopListContainer extends React.PureComponent { vehicles: PropTypes.object, locationState: PropTypes.object.isRequired, currentTime: PropTypes.object.isRequired, + relay: PropTypes.shape({ + forceFetch: PropTypes.func.isRequired, + }).isRequired, tripStart: PropTypes.string.isRequired, breakpoint: PropTypes.string, }; @@ -37,6 +40,13 @@ class TripStopListContainer extends React.PureComponent { } } + componentWillReceiveProps({ relay, currentTime }) { + const currUnix = this.props.currentTime.unix(); + const nextUnix = currentTime.unix(); + if (currUnix !== nextUnix) { + relay.forceFetch(); + } + } componentDidUpdate() { if (this.props.breakpoint === 'large' && !this.state.hasScrolled) { this.scrollToSelectedTailIcon(); diff --git a/app/component/map/popups/StopMarkerPopup.js b/app/component/map/popups/StopMarkerPopup.js index 84a5fbef0f..b37ff4c66b 100644 --- a/app/component/map/popups/StopMarkerPopup.js +++ b/app/component/map/popups/StopMarkerPopup.js @@ -2,6 +2,8 @@ import moment from 'moment'; import PropTypes from 'prop-types'; import React from 'react'; import Relay from 'react-relay/classic'; +import connectToStores from 'fluxible-addons-react/connectToStores'; + import PopupMock from './PopupMock'; import MarkerPopupBottom from '../MarkerPopupBottom'; import StopCardContainer from '../../StopCardContainer'; @@ -13,45 +15,61 @@ const NUMBER_OF_DEPARTURES = 5; const STOP_TIME_RANGE = 12 * 60 * 60; const TERMINAL_TIME_RANGE = 60 * 60; -function StopMarkerPopup(props) { - const stop = props.stop || props.terminal; - const terminal = props.terminal !== null; +class StopMarkerPopup extends React.PureComponent { + componentWillReceiveProps({ relay, currentTime }) { + const currUnix = this.props.currentTime; + if (currUnix !== currentTime) { + relay.setVariables({ currentTime: currUnix }); + } + } + render() { + const stop = this.props.stop || this.props.terminal; + const terminal = this.props.terminal !== null; - return ( -
- - -
- ); + return ( +
+ + +
+ ); + } } StopMarkerPopup.propTypes = { stop: PropTypes.object, terminal: PropTypes.object, + currentTime: PropTypes.number.isRequired, relay: PropTypes.shape({ variables: PropTypes.shape({ currentTime: PropTypes.number.isRequired, }).isRequired, + setVariables: PropTypes.func.isRequired, }).isRequired, }; -const StopMarkerPopupContainer = Relay.createContainer(StopMarkerPopup, { - fragments: { - stop: ({ currentTime }) => Relay.QL` +const StopMarkerPopupContainer = Relay.createContainer( + connectToStores(StopMarkerPopup, ['TimeStore'], ({ getStore }) => ({ + currentTime: getStore('TimeStore') + .getCurrentTime() + .unix(), + })), + { + fragments: { + stop: ({ currentTime }) => Relay.QL` fragment on Stop{ gtfsId lat @@ -64,7 +82,7 @@ const StopMarkerPopupContainer = Relay.createContainer(StopMarkerPopup, { })} } `, - terminal: ({ currentTime }) => Relay.QL` + terminal: ({ currentTime }) => Relay.QL` fragment on Stop{ gtfsId lat @@ -78,11 +96,12 @@ const StopMarkerPopupContainer = Relay.createContainer(StopMarkerPopup, { })} } `, + }, + initialVariables: { + currentTime: 0, + }, }, - initialVariables: { - currentTime: 0, - }, -}); +); StopMarkerPopupContainer.displayName = 'StopMarkerPopup';