From e07f3fdf69f8bc646fc7decb4b57310bae5bc1bb Mon Sep 17 00:00:00 2001
From: miles-grant-ibigroup <miles.grant@ibigroup.com>
Date: Tue, 1 Feb 2022 12:05:51 -0800
Subject: [PATCH 1/6] refactor: run autoformatter

---
 lib/components/narrative/trip-tools.js | 103 ++++++++++++-------------
 1 file changed, 51 insertions(+), 52 deletions(-)

diff --git a/lib/components/narrative/trip-tools.js b/lib/components/narrative/trip-tools.js
index 9b89a814b..fd5c7b01f 100644
--- a/lib/components/narrative/trip-tools.js
+++ b/lib/components/narrative/trip-tools.js
@@ -1,8 +1,8 @@
+import { Button } from 'react-bootstrap'
+import { connect } from 'react-redux'
 import bowser from 'bowser'
 import copyToClipboard from 'copy-to-clipboard'
-import React, {Component} from 'react'
-import { connect } from 'react-redux'
-import { Button } from 'react-bootstrap'
+import React, { Component } from 'react'
 // import { DropdownButton, MenuItem } from 'react-bootstrap'
 import { FormattedMessage, injectIntl } from 'react-intl'
 
@@ -10,10 +10,10 @@ import Icon from '../util/icon'
 
 class TripTools extends Component {
   static defaultProps = {
-    buttonTypes: [ 'COPY_URL', 'PRINT', 'REPORT_ISSUE', 'START_OVER' ]
+    buttonTypes: ['COPY_URL', 'PRINT', 'REPORT_ISSUE', 'START_OVER']
   }
 
-  render () {
+  render() {
     const { buttonTypes, reactRouterConfig, reportConfig } = this.props
 
     const buttonComponents = []
@@ -38,8 +38,8 @@ class TripTools extends Component {
           buttonComponents.push(
             // FIXME: The Spanish string does not fit in button width.
             <LinkButton
-              icon='undo'
-              text={<FormattedMessage id='common.forms.startOver' />}
+              icon="undo"
+              text={<FormattedMessage id="common.forms.startOver" />}
               url={startOverUrl}
             />
           )
@@ -48,8 +48,12 @@ class TripTools extends Component {
     })
 
     return (
-      <div className='trip-tools'>
-        {buttonComponents.map((btn, i) => <div className='button-container' key={i}>{btn}</div>)}
+      <div className="trip-tools">
+        {buttonComponents.map((btn, i) => (
+          <div className="button-container" key={i}>
+            {btn}
+          </div>
+        ))}
       </div>
     )
   }
@@ -82,7 +86,7 @@ class ShareSaveDropdownButton extends Component {
 // Copy URL Button
 
 class CopyUrlButton extends Component {
-  constructor (props) {
+  constructor(props) {
     super(props)
     this.state = { showCopied: false }
   }
@@ -100,7 +104,10 @@ class CopyUrlButton extends Component {
         url = `${parts[0]}#/start/x/x/x/${routerId}${parts[1]}`
       } else {
         // Console logs are not internationalized.
-        console.warn('URL not formatted as expected, copied URL will not contain session routerId.', routerId)
+        console.warn(
+          'URL not formatted as expected, copied URL will not contain session routerId.',
+          routerId
+        )
       }
     }
     copyToClipboard(url)
@@ -108,27 +115,21 @@ class CopyUrlButton extends Component {
     window.setTimeout(this._resetState, 2000)
   }
 
-  render () {
+  render() {
     return (
       <div>
-        <Button
-          className='tool-button'
-          onClick={this._onClick}
-        >
-          {this.state.showCopied
-            ? (
-              <span>
-                <Icon type='check' withSpace />
-                <FormattedMessage id='components.TripTools.linkCopied' />
-              </span>
-            )
-            : (
-              <span>
-                <Icon type='clipboard' withSpace />
-                <FormattedMessage id='components.TripTools.copyLink' />
-              </span>
-            )
-          }
+        <Button className="tool-button" onClick={this._onClick}>
+          {this.state.showCopied ? (
+            <span>
+              <Icon type="check" withSpace />
+              <FormattedMessage id="components.TripTools.linkCopied" />
+            </span>
+          ) : (
+            <span>
+              <Icon type="clipboard" withSpace />
+              <FormattedMessage id="components.TripTools.copyLink" />
+            </span>
+          )}
         </Button>
       </div>
     )
@@ -144,15 +145,12 @@ class PrintButton extends Component {
     window.open(printUrl, '_blank')
   }
 
-  render () {
+  render() {
     return (
       <div>
-        <Button
-          className='tool-button'
-          onClick={this._onClick}
-        >
-          <Icon type='print' withSpace />
-          <FormattedMessage id='common.forms.print' />
+        <Button className="tool-button" onClick={this._onClick}>
+          <Icon type="print" withSpace />
+          <FormattedMessage id="common.forms.print" />
         </Button>
       </div>
     )
@@ -164,9 +162,11 @@ class PrintButton extends Component {
 class ReportIssueButtonBase extends Component {
   _onClick = () => {
     const { intl, mailto, subject: configuredSubject } = this.props
-    const subject = configuredSubject || intl.formatMessage({id: 'components.TripTools.reportEmailSubject'})
+    const subject =
+      configuredSubject ||
+      intl.formatMessage({ id: 'components.TripTools.reportEmailSubject' })
     const bodyLines = [
-      intl.formatMessage({id: 'components.TripTools.reportEmailTemplate'}),
+      intl.formatMessage({ id: 'components.TripTools.reportEmailTemplate' }),
       '',
       // Search data section is for support and is not translated.
       'SEARCH DATA:',
@@ -178,18 +178,20 @@ class ReportIssueButtonBase extends Component {
       ''
     ]
 
-    window.open(`mailto:${mailto}?subject=${subject}&body=${encodeURIComponent(bodyLines.join('\n'))}`, '_self')
+    window.open(
+      `mailto:${mailto}?subject=${subject}&body=${encodeURIComponent(
+        bodyLines.join('\n')
+      )}`,
+      '_self'
+    )
   }
 
-  render () {
+  render() {
     return (
-      <Button
-        className='tool-button'
-        onClick={this._onClick}
-      >
-        <Icon type='flag' withSpace />
+      <Button className="tool-button" onClick={this._onClick}>
+        <Icon type="flag" withSpace />
         {/* FIXME: Depending on translation, Spanish and French strings may not fit in button width. */}
-        <FormattedMessage id='components.TripTools.reportIssue' />
+        <FormattedMessage id="components.TripTools.reportIssue" />
       </Button>
     )
   }
@@ -206,14 +208,11 @@ class LinkButton extends Component {
     window.location.href = this.props.url
   }
 
-  render () {
+  render() {
     const { icon, text } = this.props
     return (
       <div>
-        <Button
-          className='tool-button'
-          onClick={this._onClick}
-        >
+        <Button className="tool-button" onClick={this._onClick}>
           {icon && <Icon type={icon} withSpace />}
           {text}
         </Button>

From 158482c7907ecc1d9c85f3bdf0229d7f2e33de70 Mon Sep 17 00:00:00 2001
From: miles-grant-ibigroup <miles.grant@ibigroup.com>
Date: Tue, 1 Feb 2022 12:10:04 -0800
Subject: [PATCH 2/6] refactor(trip-tools): modernize report issue email
 template

---
 i18n/en-US.yml                         | 12 ++++++++++--
 i18n/fr-FR.yml                         |  5 ++++-
 lib/components/narrative/trip-tools.js |  2 --
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/i18n/en-US.yml b/i18n/en-US.yml
index 8216c7667..ead270933 100644
--- a/i18n/en-US.yml
+++ b/i18n/en-US.yml
@@ -580,8 +580,16 @@ components:
     reportEmailTemplate: >
       ***INSTRUCTIONS TO USER***
       This feature allows you to email a report to site administrators for review.
-      Please add any additional feedback for this trip under the 'Additional Comments'
-      section below and send using your regular email program."
+      Please fill out the prompts below and send using your regular email program.
+
+      *** PLEASE COMPLETE THE FOLLOWING ***
+
+      Issue encountered:
+
+      Type of trip you wanted to take (ex. walk + transit, bike + transit, car + transit):
+
+      *** TECHNICAL DETAILS ***
+
   # Used in both desktop and mobile
   TripViewer:
     accessible: Accessible
diff --git a/i18n/fr-FR.yml b/i18n/fr-FR.yml
index 64908ebd7..ae228236e 100644
--- a/i18n/fr-FR.yml
+++ b/i18n/fr-FR.yml
@@ -565,7 +565,10 @@ components:
       *** À L'ATTENTION DE L'UTILISATEUR ***
       Vous pouvez communiquer votre problème par e-mail et en détail aux administrateurs de ce site.
       Veuillez ajouter toute remarque sur cet itinéraire dans la section 'Additional Comments'
-      ci-dessous, puis envoyez depuis votre logiciel de messagerie usuel."
+      ci-dessous, puis envoyez depuis votre logiciel de messagerie usuel.
+
+  #    TODO: UPDATE TRANSlATION
+
   # Used in both desktop and mobile
   TripViewer:
     accessible: Accessible
diff --git a/lib/components/narrative/trip-tools.js b/lib/components/narrative/trip-tools.js
index fd5c7b01f..2ada1c2fd 100644
--- a/lib/components/narrative/trip-tools.js
+++ b/lib/components/narrative/trip-tools.js
@@ -173,8 +173,6 @@ class ReportIssueButtonBase extends Component {
       'Address: ' + window.location.href,
       'Browser: ' + bowser.name + ' ' + bowser.version,
       'OS: ' + bowser.osname + ' ' + bowser.osversion,
-      '',
-      'ADDITIONAL COMMENTS:',
       ''
     ]
 

From c9d973b110be0a91b884b87146d00bd39fbbcec6 Mon Sep 17 00:00:00 2001
From: miles-grant-ibigroup <miles.grant@ibigroup.com>
Date: Tue, 1 Feb 2022 12:26:13 -0800
Subject: [PATCH 3/6] refactor(trip-tools): add prop types

---
 lib/components/narrative/trip-tools.js | 151 ++++++++++++-------------
 1 file changed, 74 insertions(+), 77 deletions(-)

diff --git a/lib/components/narrative/trip-tools.js b/lib/components/narrative/trip-tools.js
index 2ada1c2fd..2bc3d7dd9 100644
--- a/lib/components/narrative/trip-tools.js
+++ b/lib/components/narrative/trip-tools.js
@@ -1,88 +1,14 @@
+/* eslint-disable no-case-declarations */
 import { Button } from 'react-bootstrap'
 import { connect } from 'react-redux'
 import bowser from 'bowser'
 import copyToClipboard from 'copy-to-clipboard'
+import PropTypes from 'prop-types'
 import React, { Component } from 'react'
 // import { DropdownButton, MenuItem } from 'react-bootstrap'
 import { FormattedMessage, injectIntl } from 'react-intl'
 
 import Icon from '../util/icon'
-
-class TripTools extends Component {
-  static defaultProps = {
-    buttonTypes: ['COPY_URL', 'PRINT', 'REPORT_ISSUE', 'START_OVER']
-  }
-
-  render() {
-    const { buttonTypes, reactRouterConfig, reportConfig } = this.props
-
-    const buttonComponents = []
-    buttonTypes.forEach((type) => {
-      switch (type) {
-        case 'COPY_URL':
-          buttonComponents.push(<CopyUrlButton />)
-          break
-        case 'PRINT':
-          buttonComponents.push(<PrintButton />)
-          break
-        case 'REPORT_ISSUE':
-          if (!reportConfig || !reportConfig.mailto) break
-          buttonComponents.push(<ReportIssueButton {...reportConfig} />)
-          break
-        case 'START_OVER':
-          // Determine "home" URL
-          let startOverUrl = '/'
-          if (reactRouterConfig && reactRouterConfig.basename) {
-            startOverUrl += reactRouterConfig.basename
-          }
-          buttonComponents.push(
-            // FIXME: The Spanish string does not fit in button width.
-            <LinkButton
-              icon="undo"
-              text={<FormattedMessage id="common.forms.startOver" />}
-              url={startOverUrl}
-            />
-          )
-          break
-      }
-    })
-
-    return (
-      <div className="trip-tools">
-        {buttonComponents.map((btn, i) => (
-          <div className="button-container" key={i}>
-            {btn}
-          </div>
-        ))}
-      </div>
-    )
-  }
-}
-
-// Share/Save Dropdown Component -- not used currently
-
-/*
-class ShareSaveDropdownButton extends Component {
-  _onCopyToClipboardClick = () => {
-    copyToClipboard(window.location.href)
-  }
-
-  render () {
-    return (
-      <DropdownButton
-        className='tool-button'
-        title={<span><i className='fa fa-share' /> Share/Save</span>}
-        id={'tool-share-dropdown'}
-      >
-        <MenuItem onClick={this._onCopyToClipboardClick}>
-          <i className='fa fa-clipboard' /> Copy Link to Clipboard
-        </MenuItem>
-      </DropdownButton>
-    )
-  }
-}
-*/
-
 // Copy URL Button
 
 class CopyUrlButton extends Component {
@@ -195,6 +121,12 @@ class ReportIssueButtonBase extends Component {
   }
 }
 
+ReportIssueButtonBase.propTypes = {
+  intl: PropTypes.object,
+  mailto: PropTypes.string,
+  subject: PropTypes.string
+}
+
 // The ReportIssueButton component above, with an intl prop
 // for retrieving messages shown outside of React rendering.
 const ReportIssueButton = injectIntl(ReportIssueButtonBase)
@@ -219,9 +151,74 @@ class LinkButton extends Component {
   }
 }
 
+LinkButton.propTypes = {
+  icon: PropTypes.string,
+  text: PropTypes.string,
+  url: PropTypes.string
+}
+
+class TripTools extends Component {
+  static defaultProps = {
+    buttonTypes: ['COPY_URL', 'PRINT', 'REPORT_ISSUE', 'START_OVER']
+  }
+
+  render() {
+    const { buttonTypes, reactRouterConfig, reportConfig } = this.props
+
+    const buttonComponents = []
+    buttonTypes.forEach((type) => {
+      switch (type) {
+        case 'COPY_URL':
+          buttonComponents.push(<CopyUrlButton />)
+          break
+        case 'PRINT':
+          buttonComponents.push(<PrintButton />)
+          break
+        case 'REPORT_ISSUE':
+          if (!reportConfig || !reportConfig.mailto) break
+          buttonComponents.push(<ReportIssueButton {...reportConfig} />)
+          break
+        case 'START_OVER':
+          // Determine "home" URL
+          let startOverUrl = '/'
+          if (reactRouterConfig && reactRouterConfig.basename) {
+            startOverUrl += reactRouterConfig.basename
+          }
+          buttonComponents.push(
+            // FIXME: The Spanish string does not fit in button width.
+            <LinkButton
+              icon="undo"
+              text={<FormattedMessage id="common.forms.startOver" />}
+              url={startOverUrl}
+            />
+          )
+          break
+        default:
+          console.warn(`TripTools called with invalid button type ${type}!`)
+      }
+    })
+
+    return (
+      <div className="trip-tools">
+        {buttonComponents.map((btn, i) => (
+          <div className="button-container" key={i}>
+            {btn}
+          </div>
+        ))}
+      </div>
+    )
+  }
+}
+
+TripTools.propTypes = {
+  buttonTypes: PropTypes.arrayOf(PropTypes.string),
+  reactRouterConfig: PropTypes.object,
+  reportConfig: PropTypes.object
+}
+
 // Connect main class to redux store
 
-const mapStateToProps = (state, ownProps) => {
+const mapStateToProps = (state) => {
   return {
     reactRouterConfig: state.otp.config.reactRouter,
     reportConfig: state.otp.config.reportIssue

From fd8ea13b983737f2cea4b19a37043ed7c19a813b Mon Sep 17 00:00:00 2001
From: miles-grant-ibigroup <miles.grant@ibigroup.com>
Date: Thu, 3 Feb 2022 16:09:13 -0800
Subject: [PATCH 4/6] refactor: add newlines to email template

---
 i18n/en-US.yml                         | 12 ++++--------
 lib/components/narrative/trip-tools.js |  5 ++++-
 2 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/i18n/en-US.yml b/i18n/en-US.yml
index ead270933..8c497b40b 100644
--- a/i18n/en-US.yml
+++ b/i18n/en-US.yml
@@ -581,14 +581,10 @@ components:
       ***INSTRUCTIONS TO USER***
       This feature allows you to email a report to site administrators for review.
       Please fill out the prompts below and send using your regular email program.
-
-      *** PLEASE COMPLETE THE FOLLOWING ***
-
-      Issue encountered:
-
-      Type of trip you wanted to take (ex. walk + transit, bike + transit, car + transit):
-
-      *** TECHNICAL DETAILS ***
+      {br}*** PLEASE COMPLETE THE FOLLOWING ***
+      {br}Issue encountered:
+      {br}Type of trip you wanted to take (ex. walk + transit, bike + transit, car + transit):
+      {br}*** TECHNICAL DETAILS ***
 
   # Used in both desktop and mobile
   TripViewer:
diff --git a/lib/components/narrative/trip-tools.js b/lib/components/narrative/trip-tools.js
index 2bc3d7dd9..6f1ef0020 100644
--- a/lib/components/narrative/trip-tools.js
+++ b/lib/components/narrative/trip-tools.js
@@ -92,7 +92,10 @@ class ReportIssueButtonBase extends Component {
       configuredSubject ||
       intl.formatMessage({ id: 'components.TripTools.reportEmailSubject' })
     const bodyLines = [
-      intl.formatMessage({ id: 'components.TripTools.reportEmailTemplate' }),
+      intl.formatMessage(
+        { id: 'components.TripTools.reportEmailTemplate' },
+        { br: '\n' }
+      ),
       '',
       // Search data section is for support and is not translated.
       'SEARCH DATA:',

From 04ea9e95455ae4749e8a0178eab11d5ac6df28ac Mon Sep 17 00:00:00 2001
From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com>
Date: Fri, 4 Feb 2022 11:13:43 -0500
Subject: [PATCH 5/6] Revert "refactor: add newlines to email template"

This reverts commit fd8ea13b983737f2cea4b19a37043ed7c19a813b.
---
 i18n/en-US.yml                         | 12 ++++++++----
 lib/components/narrative/trip-tools.js |  5 +----
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/i18n/en-US.yml b/i18n/en-US.yml
index 8c497b40b..ead270933 100644
--- a/i18n/en-US.yml
+++ b/i18n/en-US.yml
@@ -581,10 +581,14 @@ components:
       ***INSTRUCTIONS TO USER***
       This feature allows you to email a report to site administrators for review.
       Please fill out the prompts below and send using your regular email program.
-      {br}*** PLEASE COMPLETE THE FOLLOWING ***
-      {br}Issue encountered:
-      {br}Type of trip you wanted to take (ex. walk + transit, bike + transit, car + transit):
-      {br}*** TECHNICAL DETAILS ***
+
+      *** PLEASE COMPLETE THE FOLLOWING ***
+
+      Issue encountered:
+
+      Type of trip you wanted to take (ex. walk + transit, bike + transit, car + transit):
+
+      *** TECHNICAL DETAILS ***
 
   # Used in both desktop and mobile
   TripViewer:
diff --git a/lib/components/narrative/trip-tools.js b/lib/components/narrative/trip-tools.js
index 6f1ef0020..2bc3d7dd9 100644
--- a/lib/components/narrative/trip-tools.js
+++ b/lib/components/narrative/trip-tools.js
@@ -92,10 +92,7 @@ class ReportIssueButtonBase extends Component {
       configuredSubject ||
       intl.formatMessage({ id: 'components.TripTools.reportEmailSubject' })
     const bodyLines = [
-      intl.formatMessage(
-        { id: 'components.TripTools.reportEmailTemplate' },
-        { br: '\n' }
-      ),
+      intl.formatMessage({ id: 'components.TripTools.reportEmailTemplate' }),
       '',
       // Search data section is for support and is not translated.
       'SEARCH DATA:',

From 96d72fab0a2db4d8716949d0e01ec86e85e6b37a Mon Sep 17 00:00:00 2001
From: binh-dam-ibigroup <56846598+binh-dam-ibigroup@users.noreply.github.com>
Date: Fri, 4 Feb 2022 11:36:31 -0500
Subject: [PATCH 6/6] improvement(i18n): Improve report email template.

---
 i18n/en-US.yml |  5 ++---
 i18n/fr-FR.yml | 16 ++++++++++------
 2 files changed, 12 insertions(+), 9 deletions(-)

diff --git a/i18n/en-US.yml b/i18n/en-US.yml
index ead270933..24cc85cb1 100644
--- a/i18n/en-US.yml
+++ b/i18n/en-US.yml
@@ -577,8 +577,8 @@ components:
     linkCopied: Copied
     reportIssue: Report Issue
     reportEmailSubject: Reporting an Issue with OpenTripPlanner
-    reportEmailTemplate: >
-      ***INSTRUCTIONS TO USER***
+    reportEmailTemplate: |+
+      *** INSTRUCTIONS TO USER ***
       This feature allows you to email a report to site administrators for review.
       Please fill out the prompts below and send using your regular email program.
 
@@ -589,7 +589,6 @@ components:
       Type of trip you wanted to take (ex. walk + transit, bike + transit, car + transit):
 
       *** TECHNICAL DETAILS ***
-
   # Used in both desktop and mobile
   TripViewer:
     accessible: Accessible
diff --git a/i18n/fr-FR.yml b/i18n/fr-FR.yml
index ae228236e..52ce58fdb 100644
--- a/i18n/fr-FR.yml
+++ b/i18n/fr-FR.yml
@@ -561,14 +561,18 @@ components:
     linkCopied: Copié
     reportIssue: Un problème ? # "Signaler un problème" does not fit.
     reportEmailSubject: Signaler un problème avec OpenTripPlanner
-    reportEmailTemplate: >
-      *** À L'ATTENTION DE L'UTILISATEUR ***
-      Vous pouvez communiquer votre problème par e-mail et en détail aux administrateurs de ce site.
-      Veuillez ajouter toute remarque sur cet itinéraire dans la section 'Additional Comments'
-      ci-dessous, puis envoyez depuis votre logiciel de messagerie usuel.
+    reportEmailTemplate: |+
+      *** CONSIGNES POUR L'UTILISATEUR ***
+      Cet email signalera votre problème aux administrateurs de ce site.
+      Veuillez remplir les détails ci-dessous, puis envoyez depuis votre logiciel de messagerie habituel.
 
-  #    TODO: UPDATE TRANSlATION
+      *** VEUILLEZ REMPLIR CI-DESSOUS ***
 
+      Problème rencontré :
+
+      Type de trajet recherché (ex. à pied + transports, vélo + transports, voiture + transports) :
+
+      *** DÉTAILS TECHNIQUES ***
   # Used in both desktop and mobile
   TripViewer:
     accessible: Accessible