Skip to content

Metric Distance Support #1510

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
binh-dam-ibigroup wants to merge 11 commits into
base: dev
Choose a base branch
from
Open

Metric Distance Support #1510

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
11 commits
Select commit Hold shift + click to select a range
8e84243
chore(deps): Update some OTP-UI packages, deduplicate deps
binh-dam-ibigroup Nov 18, 2025
1ef510c
refactor: Add units to config type and example.
binh-dam-ibigroup Nov 18, 2025
59d4695
Revert "chore(deps): Update some OTP-UI packages, deduplicate deps"
binh-dam-ibigroup Nov 18, 2025
0c4b2d3
chore(deps): Upgrade some OTP-UI packages.
binh-dam-ibigroup Nov 18, 2025
ab79a1a
refactor(DistanceDisplay): Reuse distance component.
binh-dam-ibigroup Nov 18, 2025
ee86d06
refactor(DistanceDisplay): Extract connected Distance component.
binh-dam-ibigroup Nov 18, 2025
e93207d
fix(Distance): Default to imperial.
binh-dam-ibigroup Nov 18, 2025
45bbdea
Merge branch 'dev' into metric-distance
binh-dam-ibigroup Dec 31, 2025
1bbc8de
test(NearbyView): Update snapshot
binh-dam-ibigroup Dec 31, 2025
b3375bd
test(StopScheduleViewer): Update snapshot
binh-dam-ibigroup Jan 2, 2026
8a3e86a
Merge branch 'dev' into metric-distance
binh-dam-ibigroup Jan 2, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
80 changes: 60 additions & 20 deletions __tests__/components/viewers/__snapshots__/nearby-view.js.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4917,7 +4917,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "79 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={24}
/>,
}
}
>
Expand Down Expand Up @@ -5349,7 +5351,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "85 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={26}
/>,
}
}
>
Expand Down Expand Up @@ -5781,7 +5785,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "112 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={34}
/>,
}
}
>
Expand Down Expand Up @@ -11246,7 +11252,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "135 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={41}
/>,
}
}
>
Expand Down Expand Up @@ -18583,7 +18591,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "161 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={49}
/>,
}
}
>
Expand Down Expand Up @@ -21824,7 +21834,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "171 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={52}
/>,
}
}
>
Expand Down Expand Up @@ -22256,7 +22268,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "187 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={57}
/>,
}
}
>
Expand Down Expand Up @@ -22688,7 +22702,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "187 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={57}
/>,
}
}
>
Expand Down Expand Up @@ -28846,7 +28862,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "302 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={92}
/>,
}
}
>
Expand Down Expand Up @@ -33522,7 +33540,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "377 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={115}
/>,
}
}
>
Expand Down Expand Up @@ -33954,7 +33974,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "387 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={118}
/>,
}
}
>
Expand Down Expand Up @@ -34386,7 +34408,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "397 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={121}
/>,
}
}
>
Expand Down Expand Up @@ -34818,7 +34842,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "469 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={143}
/>,
}
}
>
Expand Down Expand Up @@ -35250,7 +35276,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "495 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={151}
/>,
}
}
>
Expand Down Expand Up @@ -38906,7 +38934,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "502 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={153}
/>,
}
}
>
Expand Down Expand Up @@ -42171,7 +42201,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "512 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={156}
/>,
}
}
>
Expand Down Expand Up @@ -47402,7 +47434,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "512 feet",
"localizedDistanceString": <Memo(Connect(Distance))
meters={156}
/>,
}
}
>
Expand Down Expand Up @@ -55667,7 +55701,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "0.1 miles",
"localizedDistanceString": <Memo(Connect(Distance))
meters={178}
/>,
}
}
>
Expand Down Expand Up @@ -62114,7 +62150,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "0.1 miles",
"localizedDistanceString": <Memo(Connect(Distance))
meters={181}
/>,
}
}
>
Expand Down Expand Up @@ -67579,7 +67617,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
id="components.NearbyView.distanceAway"
values={
Object {
"localizedDistanceString": "0.1 miles",
"localizedDistanceString": <Memo(Connect(Distance))
meters={194}
/>,
}
}
>
Expand Down
3 changes: 3 additions & 0 deletions example/example-config.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,9 @@ api:
port: 8080
v2: true

### The default unit system was historically imperial, but it can now easily be switched to metric:
# units: metric

# Determines if the header brand should be clickable or not. If set to true,
# clicking the header brand will go back to the main trip planner page and wipe out any
# results.
Expand Down
18 changes: 18 additions & 0 deletions lib/components/util/distance.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import { connect } from 'react-redux'
import { Distance } from '@opentripplanner/humanize-distance'

import { AppReduxState } from '../../util/state-types'

// Connect to the redux store for unit system presets
// (fall back to imperial to not break existing implementations).
const mapStateToProps = (state: AppReduxState) => {
const { units = 'imperial' } = state.otp.config
return {
// Preset for long units to be consistent with humanizeDistanceString.
long: units === 'imperial',
units
}
}

// Pass an empty object as mapDispatchToProps to remove dispatch from the rendered HTML.
export default connect(mapStateToProps, {})(Distance)
9 changes: 4 additions & 5 deletions lib/components/viewers/nearby/distance-display.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,19 +1,18 @@
import { FormattedMessage, useIntl } from 'react-intl'
import { humanizeDistanceString } from '@opentripplanner/humanize-distance'
import { FormattedMessage } from 'react-intl'
import React from 'react'

import Distance from '../../util/distance'

import { CardAside } from './styled'

const DistanceDisplay = ({ distance }: { distance?: number }): JSX.Element => {
const intl = useIntl()

if (!distance || distance < 5) return <></>
return (
<CardAside>
<FormattedMessage
id="components.NearbyView.distanceAway"
values={{
localizedDistanceString: humanizeDistanceString(distance, false, intl)
localizedDistanceString: <Distance meters={distance} />
}}
/>
</CardAside>
Expand Down
2 changes: 2 additions & 0 deletions lib/util/config-types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
ModeSetting,
ModeSettingValues,
TransitOperator,
UnitSystem,
VehicleRentalMapOverlaySymbol
} from '@opentripplanner/types'
import { ControlPosition } from 'react-map-gl/maplibre'
Expand Down Expand Up @@ -441,6 +442,7 @@ export interface AppConfig {
title?: string
transitOperators?: TransitOperatorConfig[]
translateExternalLinks?: boolean
units?: UnitSystem

// Add other config items as needed.
}
Loading