Merge branch 'dev' into fix-mobile-map

Author: binh-dam-ibigroup

Diff for: README.md

@@ -34,6 +34,37 @@ The same environment variables which affect the behavior of `yarn start` also af
 env JS_CONFIG=my-custom-js.js CUSTOM_CSS=my-custom-css.css yarn build
 ```
 
+## Internationalization
+
+OTP-react-redux uses `react-intl` from the [`formatjs`](https://github.com/formatjs/formatjs) library for internationalization.
+Both `react-intl` and `formatjs` take advantage of native internationalization features provided by web browsers.
+
+Language-specific content is located in YML files under the `i18n` folder
+(e.g. `en-US.yml` for American English, `fr.yml` for generic French, etc.).
+
+Most textual content can also be customized using the `language` section of `config.yml`,
+whether for all languages at once or for each supported individual language.
+
+### Contributing translations
+
+OTP-react-redux now uses [Hosted Weblate](https://www.weblate.org) to manage translations!
+
+<figure>
+  <a href="https://hosted.weblate.org/engage/otp-react-redux/">
+    <img src="https://hosted.weblate.org/widgets/otp-react-redux/-/horizontal-auto.svg" alt="Translation status" />
+  </a>
+  <figcaption>Translation status for
+    <a href="https://hosted.weblate.org/engage/otp-react-redux/">OTP-react-redux and OTP-UI on Hosted Weblate</a>
+  </figcaption>
+</figure>
+
+
+Translations from the community are welcome and very much appreciated,
+please see instructions at https://hosted.weblate.org/projects/otp-react-redux/.
+Community input from Weblate will appear as pull requests with changes to files in the `i18n` folder for our review.
+
+If changes to a specific language file is needed but not enabled in Weblate, please open an issue or a pull request with the changes needed.
+
 ## Library Documentation
 
 More coming soon...

Diff for: lib/actions/api.js

@@ -701,28 +701,11 @@ export function findStopTimesForStop(params) {
 
 // Routes lookup query
 
-const findRoutesResponse = createAction('FIND_ROUTES_RESPONSE')
-const findRoutesError = createAction('FIND_ROUTES_ERROR')
+export const findRoutesResponse = createAction('FIND_ROUTES_RESPONSE')
+export const findRoutesError = createAction('FIND_ROUTES_ERROR')
 
 export function findRoutes(params) {
-  return createQueryAction(
-    'index/routes',
-    findRoutesResponse,
-    findRoutesError,
-    {
-      postprocess: (payload, dispatch) => {
-        dispatch(setViewedStop(null))
-      },
-      rewritePayload: (payload) => {
-        const routes = {}
-        payload.forEach((rte) => {
-          routes[rte.id] = rte
-        })
-        return routes
-      },
-      serviceId: 'routes'
-    }
-  )
+  return executeOTPAction('findRoutes', params)
 }
 
 // Patterns for Route lookup query

Diff for: lib/actions/apiV1.js

@@ -13,6 +13,8 @@ import {
   findRouteError,
   findRouteResponse,
   findRoutesAtStop,
+  findRoutesError,
+  findRoutesResponse,
   findStopError,
   findStopResponse,
   findStopsForPattern,
@@ -234,10 +236,32 @@ export const findRoute = (params) =>
     }
   )
 
+export function findRoutes() {
+  return createQueryAction(
+    'index/routes',
+    findRoutesResponse,
+    findRoutesError,
+    {
+      postprocess: (payload, dispatch) => {
+        dispatch(setViewedStop(null))
+      },
+      rewritePayload: (payload) => {
+        const routes = {}
+        payload.forEach((rte) => {
+          routes[rte.id] = rte
+        })
+        return routes
+      },
+      serviceId: 'routes'
+    }
+  )
+}
+
 export default {
   fetchStopInfo,
   findPatternsForRoute,
   findRoute,
+  findRoutes,
   findTrip,
   getVehiclePositionsForRoute,
   vehicleRentalQuery

Diff for: lib/actions/apiV2.js

@@ -7,6 +7,8 @@ import {
   findNearbyAmenitiesResponse,
   findRouteError,
   findRouteResponse,
+  findRoutesError,
+  findRoutesResponse,
   findStopError,
   findStopResponse,
   findStopTimesForTrip,
@@ -538,11 +540,14 @@ export const findRoute = (params) =>
             phone
           }
           longName
+          shortName
+          mode
           type
           color
           textColor
           bikesAllowed
           routeBikesAllowed: bikesAllowed
+          url
       
           patterns {
             id
@@ -610,6 +615,62 @@ export const findRoute = (params) =>
     )
   }
 
+export function findRoutes() {
+  return function (dispatch) {
+    dispatch(
+      createGraphQLQueryAction(
+        `{
+          routes {
+            id: gtfsId
+            agency {
+              id: gtfsId
+              name
+            }
+            longName
+            shortName
+            mode
+            color
+          }
+        }
+      `,
+        {},
+        findRoutesResponse,
+        findRoutesError,
+        {
+          noThrottle: true,
+          // TODO: avoid re-writing OTP2 route object to match OTP1 style
+          rewritePayload: (payload) => {
+            if (payload.errors) {
+              return dispatch(findRoutesError(payload.errors))
+            }
+            const { routes } = payload?.data
+            if (!routes) return
+
+            // To initialize the route viewer,
+            // convert the routes array to a dictionary indexed by route ids.
+            return routes.reduce(
+              (result, { agency, color, id, longName, mode, shortName }) => {
+                result[id] = {
+                  agencyId: agency.id,
+                  agencyName: agency.name,
+                  color,
+                  id,
+                  longName,
+                  mode,
+                  shortName,
+                  v2: true
+                }
+                return result
+              },
+              {}
+            )
+          }
+        }
+      )
+    )
+  }
+}
+
 export const findPatternsForRoute = (params) =>
   function (dispatch, getState) {
     const state = getState()
@@ -628,6 +689,7 @@ export default {
   fetchStopInfo,
   findPatternsForRoute,
   findRoute,
+  findRoutes,
   findTrip,
   getVehiclePositionsForRoute,
   vehicleRentalQuery

Diff for: lib/components/admin/call-record.js

@@ -1,6 +1,6 @@
 /* eslint-disable react/prop-types */
 import { Circle } from '@styled-icons/fa-solid/Circle'
-import { Clock } from '@styled-icons/fa-regular'
+import { Clock } from '@styled-icons/fa-regular/Clock'
 import { differenceInMilliseconds, format } from 'date-fns'
 import { Phone } from '@styled-icons/fa-solid/Phone'
 import { PhoneAlt } from '@styled-icons/fa-solid/PhoneAlt'

Diff for: lib/components/admin/call-taker-controls.tsx

@@ -1,18 +1,16 @@
 import { connect } from 'react-redux'
+import { GraduationCap } from '@styled-icons/fa-solid/GraduationCap'
+import { History } from '@styled-icons/fa-solid/History'
 import { injectIntl, IntlShape, WrappedComponentProps } from 'react-intl'
+import { Phone } from '@styled-icons/fa-solid/Phone'
+import { Plus } from '@styled-icons/fa-solid/Plus'
+import { Stop } from '@styled-icons/fa-solid/Stop'
 import React, { Component } from 'react'
 
 import * as apiActions from '../../actions/api'
 import * as callTakerActions from '../../actions/call-taker'
 import * as fieldTripActions from '../../actions/field-trip'
 import * as uiActions from '../../actions/ui'
-import {
-  GraduationCap,
-  History,
-  Phone,
-  Plus,
-  Stop
-} from '@styled-icons/fa-solid'
 import { isModuleEnabled, Modules } from '../../util/config'
 
 import {

Diff for: lib/components/admin/draggable-window.tsx

@@ -1,4 +1,4 @@
-import { Times } from '@styled-icons/fa-solid'
+import { Times } from '@styled-icons/fa-solid/Times'
 import Draggable, { DraggableProps } from 'react-draggable'
 import React, { HTMLAttributes, ReactNode } from 'react'
 

Diff for: lib/components/admin/field-trip-notes.js

@@ -1,7 +1,7 @@
 /* eslint-disable react/prop-types */
 import { Badge, Button as BsButton } from 'react-bootstrap'
 import { Plus } from '@styled-icons/fa-solid/Plus'
-import { StickyNote } from '@styled-icons/fa-regular'
+import { StickyNote } from '@styled-icons/fa-regular/StickyNote'
 import { Trash } from '@styled-icons/fa-solid/Trash'
 import React, { Component } from 'react'
 import styled from 'styled-components'

Diff for: lib/components/form/date-time-preview.js

@@ -8,7 +8,7 @@ import { CaretUp } from '@styled-icons/fa-solid/CaretUp'
 import { Clock } from '@styled-icons/fa-regular/Clock'
 import { connect } from 'react-redux'
 import { injectIntl } from 'react-intl'
-import { PencilAlt } from '@styled-icons/fa-solid'
+import { PencilAlt } from '@styled-icons/fa-solid/PencilAlt'
 import { toDate } from 'date-fns-tz'
 import PropTypes from 'prop-types'
 import React, { Component } from 'react'

Diff for: lib/components/form/settings-preview.js

@@ -2,8 +2,10 @@
 /* eslint-disable jsx-a11y/no-static-element-interactions */
 /* eslint-disable jsx-a11y/click-events-have-key-events */
 import { Button } from 'react-bootstrap'
-import { CaretDown, CaretUp, PencilAlt } from '@styled-icons/fa-solid'
+import { CaretDown } from '@styled-icons/fa-solid/CaretDown'
+import { CaretUp } from '@styled-icons/fa-solid/CaretUp'
 import { connect } from 'react-redux'
+import { PencilAlt } from '@styled-icons/fa-solid/PencilAlt'
 import { useIntl } from 'react-intl'
 import coreUtils from '@opentripplanner/core-utils'
 import PropTypes from 'prop-types'

Diff for: lib/components/map/map.js

@@ -9,7 +9,6 @@ import { setMapillaryId } from '../../actions/map'
 import DefaultMap from './default-map'
 import LegDiagram from './leg-diagram'
 import MapillaryFrame from './mapillary-frame'
-import StylizedMap from './stylized-map'
 
 class Map extends Component {
   constructor() {
@@ -19,16 +18,6 @@ class Map extends Component {
     }
   }
 
-  getComponentForView(view) {
-    // TODO: allow a 'CUSTOM' type
-    switch (view.type) {
-      case 'DEFAULT':
-        return <DefaultMap />
-      case 'STYLIZED':
-        return <StylizedMap />
-    }
-  }
-
   render() {
     const { activeMapillaryImage, diagramLeg, mapConfig, setMapillaryId } =
       this.props
@@ -52,7 +41,7 @@ class Map extends Component {
                   i === this.state.activeViewIndex ? 'visible' : 'hidden'
               }}
             >
-              {this.getComponentForView(view)}
+              <DefaultMap />
             </div>
           )
         })}