diff --git a/App/Screens/Details/Details.tsx b/App/Screens/Details/Details.tsx index 335715a8..c751cc47 100644 --- a/App/Screens/Details/Details.tsx +++ b/App/Screens/Details/Details.tsx @@ -26,7 +26,7 @@ import { Distance } from './Distance'; import { Header } from './Header'; import { i18n } from '../../localization'; import { ApiContext, CurrentLocationContext } from '../../stores'; -import { distanceToStation, getCorrectLatLng } from '../../util/station'; +import { distanceToStation, getCorrectLatLng, DistanceUnit } from '../../util/station'; interface DetailsProps extends NavigationInjectedProps {} @@ -61,6 +61,9 @@ export function Details (props: DetailsProps) { // object` error. It's related to the MapView below. const currentLocation = { ..._currentLocation! }; + const haversineDistanceUnit = i18n.t('haversine_distance_unit') as DistanceUnit; + const distance = distanceToStation(currentLocation!, api!, haversineDistanceUnit); + const station = { description: api!.shootISmoke.station || '', title: api!.shootISmoke.station, @@ -102,7 +105,7 @@ export function Details (props: DetailsProps) { )} - + ); } diff --git a/App/Screens/Details/Distance/Distance.tsx b/App/Screens/Details/Distance/Distance.tsx index ce9d59ea..84286ba2 100644 --- a/App/Screens/Details/Distance/Distance.tsx +++ b/App/Screens/Details/Distance/Distance.tsx @@ -26,11 +26,16 @@ interface DistanceProps { } export function Distance (props: DistanceProps) { + const distanceUnit = i18n.t('distance_unit'); + return ( {i18n - .t('details_distance_label', { distanceToStation: props.distance }) + .t('details_distance_label', { + distanceToStation: props.distance, + distanceUnit + }) .toUpperCase()} diff --git a/App/Screens/Home/Header/Header.tsx b/App/Screens/Home/Header/Header.tsx index 05c97f5e..b37b0953 100644 --- a/App/Screens/Home/Header/Header.tsx +++ b/App/Screens/Home/Header/Header.tsx @@ -29,7 +29,7 @@ import alert from '../../../../assets/images/alert.png'; import { CurrentLocation } from '../../../components'; import { i18n } from '../../../localization'; import { ApiContext, CurrentLocationContext } from '../../../stores'; -import { distanceToStation, isStationTooFar } from '../../../util/station'; +import { distanceToStation, isStationTooFar, DistanceUnit } from '../../../util/station'; import * as theme from '../../../util/theme'; interface HeaderProps { @@ -41,7 +41,9 @@ export function Header (props: HeaderProps) { const { currentLocation, isGps } = useContext(CurrentLocationContext); const { onChangeLocationClick } = props; - const distance = distanceToStation(currentLocation!, api!); + const distanceUnit = i18n.t('distance_unit'); + const haversineDistanceUnit = i18n.t('haversine_distance_unit') as DistanceUnit; + const distance = distanceToStation(currentLocation!, api!, haversineDistanceUnit); const isTooFar = isStationTooFar(currentLocation!, api!); return ( @@ -57,7 +59,8 @@ export function Header (props: HeaderProps) { {isTooFar && } {i18n.t('home_header_air_quality_station_distance', { - distanceToStation: distance + distanceToStation: distance, + distanceUnit })}{' '} {!isGps && i18n.t('home_header_from_search')} diff --git a/App/localization/languages/en.json b/App/localization/languages/en.json index bd15af83..6956c9ee 100644 --- a/App/localization/languages/en.json +++ b/App/localization/languages/en.json @@ -7,7 +7,7 @@ "home_station_too_far_message": "We couldn’t find a closer station to you.\nResults may be inaccurate at this distance.", "home_share_title": "Did you know that you may be smoking up to 20 cigarettes per day, just for living in a big city?", "home_share_message": "Shoot! I 'smoked' {{cigarettes}} cigarettes today by breathing urban air. And you? Find out here: https://shootismoke.github.io", - "home_header_air_quality_station_distance": "Air Quality Station: {{distanceToStation}}km away", + "home_header_air_quality_station_distance": "Air Quality Station: {{distanceToStation}}{{distanceUnit}} away", "home_header_from_search": "from search", "home_btn_why_is_station_so_far": "Why is the station so far?", "home_btn_see_detailed_info": "See detailed info", @@ -43,7 +43,9 @@ "details_header_latest_update_label": "Latest Update:", "details_header_latest_update_ago": "ago", "details_header_primary_pollutant_label": "Primary Pollutant:", - "details_distance_label": "AQI Station: {{distanceToStation}}km away", + "details_distance_label": "AQI Station: {{distanceToStation}}{{distanceUnit}} away", + "distance_unit": "mi", + "haversine_distance_unit": "mile", "past_stations_loading": "Loading", "past_stations_date_from_to": "{{startDate}} to {{endDate}}", "past_stations_monitored_weekly": "Stations monitored from you during the week", diff --git a/App/localization/languages/es.json b/App/localization/languages/es.json index ea34fc6a..abe49bf0 100644 --- a/App/localization/languages/es.json +++ b/App/localization/languages/es.json @@ -7,7 +7,7 @@ "home_station_too_far_message": "No encontramos una estación cerca\\nLos resultados pueden ser inexactos a esta distancia.", "home_share_title": "¿Sabías que por vivir en una gran ciudad puedes estar fumando hasta 20 cigarrillos al día?", "home_share_message": "Rayos! 'hoy fumé'' {{cigarettes}} cigarrillos respirando aire urbano. ¿Y tú? Encuentralo aquí: https://shootismoke.github.io", - "home_header_air_quality_station_distance": "Estación de calidad del aire: a {{distanceToStation}}km", + "home_header_air_quality_station_distance": "Estación de calidad del aire: a {{distanceToStation}}{{distanceUnit}}", "home_btn_why_is_station_so_far": "¿Estación retirada?", "home_btn_see_detailed_info": "Ver detalles", "home_btn_more_details": "Más detalles", @@ -34,7 +34,9 @@ "details_your_position_marker": "Tu ubicación", "details_header_latest_update_label": "Última actualización:", "details_header_primary_pollutant_label": "Contaminante primario:", - "details_distance_label": "Estación AQI: a {{distanceToStation}}km", + "details_distance_label": "Estación AQI: a {{distanceToStation}}{{distanceUnit}}", + "distance_unit": "km", + "haversine_distance_unit": "km", "about_how_do_you_calculate_the_number_of_cigarettes_title": "Cálculo de cigarrillos", "about_how_do_you_calculate_the_number_of_cigarettes_message_1": "Esta aplicación se inspiró en los hallazgos de Berkeley Earth sobre la", "about_how_do_you_calculate_the_number_of_cigarettes_link_1": "Equivalencia entre la contaminación del aire y el tabaquismo.", diff --git a/App/util/station.ts b/App/util/station.ts index 1167be7b..ee19f1cd 100644 --- a/App/util/station.ts +++ b/App/util/station.ts @@ -22,20 +22,24 @@ import { LatLng } from '../stores/fetchGpsPosition'; // Above this distance (km), we consider the station too far from the user export const MAX_DISTANCE_TO_STATION = 10; +export type DistanceUnit = 'km' | 'mile'; + /** * Get distance from current location to station. * * @param currentLocation - The current location of the user. * @param api - The api object returned by remote data. + * @param unit - The unit of measure returned. */ -export function distanceToStation (currentLocation: LatLng, api: Api) { +export function distanceToStation (currentLocation: LatLng, api: Api, unit: DistanceUnit = 'km') { return Math.round( haversine( currentLocation, getCorrectLatLng(currentLocation, { latitude: api.city.geo[0], longitude: api.city.geo[1] - }) + }), + { unit } ) ); }