Merge pull request #612 from opentripplanner/print-correct-itinerary

fix(printable-itinerary): always print selected itinerary

Author: miles-grant-ibigroup

Diff for: i18n/en-US.yml

@@ -649,6 +649,8 @@ common:
   forms:
     back: Back
     cancel: Cancel
+    clear: Clear
+    close: Close
     error: error!
     defaultValue: "{value} (default)"
     delete: Delete

Diff for: i18n/fr.yml

@@ -628,6 +628,8 @@ common:
   forms:
     back: Retour
     cancel: Annuler
+    clear: Effacer
+    close: Fermer
     error: erreur !
     defaultValue: "{value} (défaut)"
     delete: Supprimer

Diff for: lib/actions/form.js

@@ -95,7 +95,7 @@ export function setQueryParam(payload, searchId) {
  *                         query made during a call taker session, to prevent
  *                         a search from being added to the current call)
  */
-export function parseUrlQueryString(params = getUrlParams(), source) {
+export function parseUrlQueryString(params = getUrlParams(), source = null) {
   return function (dispatch, getState) {
     const state = getState()
     if (state.otp.ui.mainPanelContent !== null) return state

Diff for: lib/components/app/print-layout.js renamed to lib/components/app/print-layout.tsx

@@ -1,29 +1,40 @@
-import PrintableItinerary from '@opentripplanner/printable-itinerary'
-import PropTypes from 'prop-types'
-import React, { Component } from 'react'
 import { Button } from 'react-bootstrap'
-import { FormattedMessage } from 'react-intl'
 import { connect } from 'react-redux'
+import { FormattedMessage } from 'react-intl'
+import { Itinerary } from '@opentripplanner/types'
+// @ts-expect-error not typescripted yet
+import PrintableItinerary from '@opentripplanner/printable-itinerary'
+import React, { Component } from 'react'
 
+import {
+  addPrintViewClassToRootHtml,
+  clearClassFromRootHtml
+} from '../../util/print'
+import { ComponentContext } from '../../util/contexts'
+import { getActiveItinerary } from '../../util/state'
 import { parseUrlQueryString } from '../../actions/form'
 import { routingQuery } from '../../actions/api'
 import DefaultMap from '../map/default-map'
-import TripDetails from '../narrative/connected-trip-details'
-import { ComponentContext } from '../../util/contexts'
 import Icon from '../util/icon'
 import SpanWithSpace from '../util/span-with-space'
-import { addPrintViewClassToRootHtml, clearClassFromRootHtml } from '../../util/print'
-import { getActiveItinerary } from '../../util/state'
+import TripDetails from '../narrative/connected-trip-details'
 
-class PrintLayout extends Component {
-  static propTypes = {
-    itinerary: PropTypes.object,
-    parseUrlQueryString: PropTypes.func
-  }
+type Props = {
+  // TODO: Typescript config type
+  config: any
+  // TODO: typescript state.js
+  itinerary: any
+  location?: { search?: string }
+  parseUrlQueryString: (params?: any, source?: string) => any
+}
+type State = {
+  mapVisible?: boolean
+}
 
+class PrintLayout extends Component<Props, State> {
   static contextType = ComponentContext
 
-  constructor (props) {
+  constructor(props: Props) {
     super(props)
     this.state = {
       mapVisible: true
@@ -38,53 +49,63 @@ class PrintLayout extends Component {
     window.print()
   }
 
-  componentDidMount () {
-    const { location, parseUrlQueryString } = this.props
+  _close = () => {
+    window.location.replace(String(window.location).replace('print/', ''))
+  }
+
+  componentDidMount() {
+    const { itinerary, location, parseUrlQueryString } = this.props
     // Add print-view class to html tag to ensure that iOS scroll fix only applies
     // to non-print views.
     addPrintViewClassToRootHtml()
     // Parse the URL query parameters, if present
-    if (location && location.search) {
+    if (!itinerary && location && location.search) {
       parseUrlQueryString()
     }
   }
 
-  componentWillUnmount () {
+  componentWillUnmount() {
     clearClassFromRootHtml()
   }
 
-  render () {
+  render() {
     const { config, itinerary } = this.props
     const { LegIcon } = this.context
 
     return (
-      <div className='otp print-layout'>
+      <div className="otp print-layout">
         {/* The header bar, including the Toggle Map and Print buttons */}
-        <div className='header'>
+        <div className="header">
           <div style={{ float: 'right' }}>
             <SpanWithSpace margin={0.25}>
-              <Button bsSize='small' onClick={this._toggleMap}>
-                <Icon type='map' withSpace />
-                <FormattedMessage id='components.PrintLayout.toggleMap' />
+              <Button bsSize="small" onClick={this._toggleMap}>
+                <Icon type="map" withSpace />
+                <FormattedMessage id="components.PrintLayout.toggleMap" />
+              </Button>
+            </SpanWithSpace>
+            <SpanWithSpace margin={0.25}>
+              <Button bsSize="small" onClick={this._print}>
+                <Icon type="print" withSpace />
+                <FormattedMessage id="common.forms.print" />
               </Button>
             </SpanWithSpace>
-            <Button bsSize='small' onClick={this._print}>
-              <Icon type='print' withSpace />
-              <FormattedMessage id='common.forms.print' />
+            <Button bsSize="small" onClick={this._close}>
+              <Icon type="close" withSpace />
+              <FormattedMessage id="common.forms.close" />
             </Button>
           </div>
-          <FormattedMessage id='components.PrintLayout.itinerary' />
+          <FormattedMessage id="components.PrintLayout.itinerary" />
         </div>
 
         {/* The map, if visible */}
-        {this.state.mapVisible &&
-          <div className='map-container'>
+        {this.state.mapVisible && (
+          <div className="map-container">
             <DefaultMap />
           </div>
-        }
+        )}
 
         {/* The main itinerary body */}
-        {itinerary &&
+        {itinerary && (
           <>
             <PrintableItinerary
               config={config}
@@ -93,15 +114,16 @@ class PrintLayout extends Component {
             />
             <TripDetails itinerary={itinerary} />
           </>
-        }
+        )}
       </div>
     )
   }
 }
 
 // connect to the redux store
 
-const mapStateToProps = (state, ownProps) => {
+// TODO: Typescript state
+const mapStateToProps = (state: any) => {
   return {
     config: state.otp.config,
     itinerary: getActiveItinerary(state)

Diff for: lib/components/narrative/trip-tools.js

@@ -68,7 +68,7 @@ class PrintButton extends Component {
   _onClick = () => {
     // Note: this is designed to work only with hash routing.
     const printUrl = window.location.href.replace('#', '#/print')
-    window.open(printUrl, '_blank')
+    window.location = printUrl
   }
 
   render() {