diff --git a/src/containers/DashboardWrapper/index.tsx b/src/containers/DashboardWrapper/index.tsx
index a8d0ae774..305fd568a 100644
--- a/src/containers/DashboardWrapper/index.tsx
+++ b/src/containers/DashboardWrapper/index.tsx
@@ -1,8 +1,7 @@
import React from 'react'
-import { BikeRentalStation } from '@entur/sdk'
import { Loader } from '@entur/loader'
-import { Vehicle } from '@entur/sdk/lib/mobility/types'
+import { Station, Vehicle } from '@entur/sdk/lib/mobility/types'
import { useCounter, isDarkOrDefaultTheme } from '../../utils'
import { useSettingsContext } from '../../settings'
@@ -80,7 +79,7 @@ function DashboardWrapper(props: Props): JSX.Element {
interface Props {
stopPlacesWithDepartures?: StopPlaceWithDepartures[] | null
- bikeRentalStations?: BikeRentalStation[] | null
+ bikeRentalStations?: Station[] | null
scooters?: Vehicle[] | null
className: string
children: JSX.Element | JSX.Element[]
diff --git a/src/dashboards/BusStop/MapTile/index.tsx b/src/dashboards/BusStop/MapTile/index.tsx
index d5197f4e4..6c63b06a7 100644
--- a/src/dashboards/BusStop/MapTile/index.tsx
+++ b/src/dashboards/BusStop/MapTile/index.tsx
@@ -1,8 +1,7 @@
import React from 'react'
import 'mapbox-gl/dist/mapbox-gl.css'
-import { BikeRentalStation } from '@entur/sdk'
-import { Vehicle } from '@entur/sdk/lib/mobility/types'
+import { Station, Vehicle } from '@entur/sdk/lib/mobility/types'
import MapView from '../../../components/Map'
@@ -21,7 +20,7 @@ function MapTile(data: Props): JSX.Element {
interface Props {
stopPlaces: StopPlaceWithDepartures[] | null
- bikeRentalStations: BikeRentalStation[] | null
+ bikeRentalStations: Station[] | null
scooters: Vehicle[] | null
walkTimes: Array<{ stopId: string; walkTime: number }> | null
latitude: number
diff --git a/src/dashboards/Chrono/BikeTile/index.tsx b/src/dashboards/Chrono/BikeTile/index.tsx
index 57403d778..bf2b2688c 100644
--- a/src/dashboards/Chrono/BikeTile/index.tsx
+++ b/src/dashboards/Chrono/BikeTile/index.tsx
@@ -1,14 +1,14 @@
import React, { useState, useEffect } from 'react'
-import { BikeRentalStation } from '@entur/sdk'
import { colors } from '@entur/tokens'
import { BicycleIcon } from '@entur/icons'
+import { Station } from '@entur/sdk/lib/mobility/types'
import Tile from '../components/Tile'
import './styles.scss'
import { useSettingsContext } from '../../../settings'
import { IconColorType } from '../../../types'
-import { getIconColorType } from '../../../utils'
+import { getIconColorType, getTranslation } from '../../../utils'
import useWalkInfoBike, { WalkInfoBike } from '../../../logic/useWalkInfoBike'
import TileRow from '../components/TileRow'
@@ -57,19 +57,19 @@ const BikeTile = ({ stations }: Props): JSX.Element => {
? getWalkInfoBike(walkInfoBike || [], station.id)
: undefined
}
- label={station.name}
+ label={getTranslation(station.name) || ''}
subLabels={[
{
time:
- station.bikesAvailable === 1
+ station.numBikesAvailable === 1
? '1 sykkel'
- : `${station.bikesAvailable} sykler`,
+ : `${station.numBikesAvailable} sykler`,
},
{
time:
- station.spacesAvailable === 1
+ station.numDocksAvailable === 1
? '1 lås'
- : `${station.spacesAvailable} låser`,
+ : `${station.numBikesAvailable} låser`,
},
]}
/>
@@ -79,7 +79,7 @@ const BikeTile = ({ stations }: Props): JSX.Element => {
}
interface Props {
- stations: BikeRentalStation[]
+ stations: Station[]
}
export default BikeTile
diff --git a/src/dashboards/Chrono/MapTile/index.tsx b/src/dashboards/Chrono/MapTile/index.tsx
index 51083c5a0..5bab69678 100644
--- a/src/dashboards/Chrono/MapTile/index.tsx
+++ b/src/dashboards/Chrono/MapTile/index.tsx
@@ -1,9 +1,7 @@
import React from 'react'
import 'mapbox-gl/dist/mapbox-gl.css'
-import { BikeRentalStation } from '@entur/sdk'
-
-import { Vehicle } from '@entur/sdk/lib/mobility/types'
+import { Station, Vehicle } from '@entur/sdk/lib/mobility/types'
import MapView from '../../../components/Map'
@@ -21,7 +19,7 @@ function MapTile(data: Props): JSX.Element {
interface Props {
stopPlaces: StopPlaceWithDepartures[] | null
- bikeRentalStations: BikeRentalStation[] | null
+ bikeRentalStations: Station[] | null
scooters: Vehicle[] | null
walkTimes: Array<{ stopId: string; walkTime: number }> | null
latitude: number
diff --git a/src/dashboards/Compact/BikeTile/index.tsx b/src/dashboards/Compact/BikeTile/index.tsx
index 6b78d72b8..927216508 100644
--- a/src/dashboards/Compact/BikeTile/index.tsx
+++ b/src/dashboards/Compact/BikeTile/index.tsx
@@ -1,13 +1,13 @@
import React, { useState, useEffect } from 'react'
-import { BikeRentalStation } from '@entur/sdk'
import { colors } from '@entur/tokens'
import { BicycleIcon } from '@entur/icons'
+import { Station } from '@entur/sdk/lib/mobility/types'
import Tile from '../components/Tile'
import TileRow from '../components/TileRow'
import { useSettingsContext } from '../../../settings'
import { IconColorType } from '../../../types'
-import { getIconColorType } from '../../../utils'
+import { getIconColorType, getTranslation } from '../../../utils'
import useWalkInfoBike, { WalkInfoBike } from '../../../logic/useWalkInfoBike'
function getWalkInfoBike(
@@ -54,19 +54,19 @@ const BikeTile = ({ stations }: Props): JSX.Element => {
? getWalkInfoBike(walkInfoBike || [], station.id)
: undefined
}
- label={station.name}
+ label={getTranslation(station.name) || ''}
subLabels={[
{
time:
- station.bikesAvailable === 1
+ station.numBikesAvailable === 1
? '1 sykkel'
- : `${station.bikesAvailable} sykler`,
+ : `${station.numBikesAvailable} sykler`,
},
{
time:
- station.spacesAvailable === 1
+ station.numDocksAvailable === 1
? '1 lås'
- : `${station.spacesAvailable} låser`,
+ : `${station.numDocksAvailable} låser`,
},
]}
/>
@@ -76,7 +76,7 @@ const BikeTile = ({ stations }: Props): JSX.Element => {
}
interface Props {
- stations: BikeRentalStation[]
+ stations: Station[]
}
export default BikeTile
diff --git a/src/dashboards/Compact/MapTile/index.tsx b/src/dashboards/Compact/MapTile/index.tsx
index 51083c5a0..5bab69678 100644
--- a/src/dashboards/Compact/MapTile/index.tsx
+++ b/src/dashboards/Compact/MapTile/index.tsx
@@ -1,9 +1,7 @@
import React from 'react'
import 'mapbox-gl/dist/mapbox-gl.css'
-import { BikeRentalStation } from '@entur/sdk'
-
-import { Vehicle } from '@entur/sdk/lib/mobility/types'
+import { Station, Vehicle } from '@entur/sdk/lib/mobility/types'
import MapView from '../../../components/Map'
@@ -21,7 +19,7 @@ function MapTile(data: Props): JSX.Element {
interface Props {
stopPlaces: StopPlaceWithDepartures[] | null
- bikeRentalStations: BikeRentalStation[] | null
+ bikeRentalStations: Station[] | null
scooters: Vehicle[] | null
walkTimes: Array<{ stopId: string; walkTime: number }> | null
latitude: number
diff --git a/src/logic/useBikeRentalStations.ts b/src/logic/useBikeRentalStations.ts
index e471b665f..a6b3dbf56 100644
--- a/src/logic/useBikeRentalStations.ts
+++ b/src/logic/useBikeRentalStations.ts
@@ -1,61 +1,89 @@
-import { useState, useEffect, useMemo } from 'react'
-import { isEqual } from 'lodash'
-import { BikeRentalStation } from '@entur/sdk'
+import { useState, useEffect } from 'react'
+import { Coordinates } from '@entur/sdk'
+import { Station } from '@entur/sdk/lib/mobility/types'
-import { usePrevious, isNotNullOrUndefined } from '../utils'
import service from '../service'
import { useSettingsContext } from '../settings'
-import { REFRESH_INTERVAL } from '../constants'
-import useNearestPlaces from './useNearestPlaces'
-
-async function fetchBikeRentalStations(
+async function fetchBikeRentalStationsById(
allStationIds: string[],
-): Promise {
- const allStations = await service.getBikeRentalStations(allStationIds)
- return allStations.filter(isNotNullOrUndefined)
+): Promise {
+ const allStations = await service.mobility.getStationsById({
+ stationIds: allStationIds,
+ })
+ return allStations
+}
+
+async function fetchBikeRentalStationsNearby(
+ coordinates: Coordinates,
+ distance: number,
+): Promise {
+ const allStations = await service.mobility.getStations({
+ lat: coordinates.latitude,
+ lon: coordinates.longitude,
+ range: distance,
+ })
+ return allStations
}
-export default function useBikeRentalStations(): BikeRentalStation[] | null {
+export default function useBikeRentalStations(
+ removeHiddenStations = true,
+): Station[] | null {
const [settings] = useSettingsContext()
const [bikeRentalStations, setBikeRentalStations] = useState<
- BikeRentalStation[] | null
+ Station[] | null
>(null)
- const nearestPlaces = useNearestPlaces(
- settings?.coordinates,
- settings?.distance,
+ const [nearbyStations, setNearbyStations] = useState([])
+ const [userSelectedStations, setUserSelectedStations] = useState(
+ [],
)
- const { newStations = [], hiddenStations, hiddenModes } = settings || {}
-
- const nearestBikeRentalStations = useMemo(
- () =>
- nearestPlaces
- .filter(({ type }) => type === 'BikeRentalStation')
- .map(({ id }) => id),
- [nearestPlaces],
- )
+ const {
+ coordinates,
+ distance,
+ newStations = [],
+ hiddenStations = [],
+ hiddenModes,
+ } = settings || {}
- const allStationIds = [...newStations, ...nearestBikeRentalStations]
- .filter((id) => !hiddenStations?.includes(id))
- .filter((id, index, ids) => ids.indexOf(id) === index)
+ const isDisabled = Boolean(hiddenModes?.includes('bysykkel'))
- const prevStationIds = usePrevious(allStationIds)
+ useEffect(() => {
+ if (!coordinates || !distance || isDisabled) {
+ return setBikeRentalStations(null)
+ }
+ fetchBikeRentalStationsNearby(coordinates, distance).then((stations) =>
+ setNearbyStations(stations || []),
+ )
+ }, [coordinates, distance, isDisabled])
- const isDisabled = Boolean(hiddenModes?.includes('bysykkel'))
useEffect(() => {
- const isStationsEqual = isEqual(allStationIds, prevStationIds)
if (isDisabled) {
return setBikeRentalStations(null)
}
- if (!isStationsEqual) {
- fetchBikeRentalStations(allStationIds).then(setBikeRentalStations)
+ fetchBikeRentalStationsById(newStations).then((stations) =>
+ setUserSelectedStations(stations || []),
+ )
+ }, [newStations, isDisabled])
+
+ useEffect(() => {
+ if (isDisabled) {
+ return setBikeRentalStations(null)
}
- const intervalId = setInterval(() => {
- fetchBikeRentalStations(allStationIds).then(setBikeRentalStations)
- }, REFRESH_INTERVAL)
- return (): void => clearInterval(intervalId)
- }, [allStationIds, isDisabled, prevStationIds])
+ const uniqueUserStations = userSelectedStations.filter(
+ (userStation) =>
+ !nearbyStations.some(
+ (nearbyStation) => nearbyStation.id === userStation.id,
+ ),
+ )
+ setBikeRentalStations([...nearbyStations, ...uniqueUserStations])
+ }, [nearbyStations, userSelectedStations, isDisabled])
+
+ if (removeHiddenStations && bikeRentalStations) {
+ return bikeRentalStations.filter(
+ (station) => !hiddenStations.includes(station.id),
+ )
+ }
return bikeRentalStations
}
diff --git a/src/logic/useWalkInfoBike.ts b/src/logic/useWalkInfoBike.ts
index bc11152df..9f1718a30 100644
--- a/src/logic/useWalkInfoBike.ts
+++ b/src/logic/useWalkInfoBike.ts
@@ -1,7 +1,8 @@
import { useState, useEffect } from 'react'
import { isEqual } from 'lodash'
-import { BikeRentalStation, Coordinates, QueryMode } from '@entur/sdk'
+import { Coordinates, QueryMode } from '@entur/sdk'
+import { Station } from '@entur/sdk/lib/mobility/types'
import service from '../service'
import { useSettingsContext } from '../settings'
@@ -14,7 +15,7 @@ export type WalkInfoBike = {
}
async function getWalkInfoBike(
- rentalStations: BikeRentalStation[],
+ rentalStations: Station[],
from: Coordinates,
signal: AbortSignal,
): Promise {
@@ -29,8 +30,8 @@ async function getWalkInfoBike(
},
to: {
coordinates: {
- longitude: stopPlace.longitude,
- latitude: stopPlace.latitude,
+ longitude: stopPlace.lon,
+ latitude: stopPlace.lat,
},
},
modes: [QueryMode.FOOT],
@@ -59,7 +60,7 @@ async function getWalkInfoBike(
}
export default function useTravelTime(
- rentalStations: BikeRentalStation[] | null,
+ rentalStations: Station[] | null,
): WalkInfoBike[] | null {
const [settings] = useSettingsContext()
const [travelTime, setTravelTime] = useState(null)
diff --git a/src/utils.tsx b/src/utils.tsx
index 579429788..84b1b3bde 100644
--- a/src/utils.tsx
+++ b/src/utils.tsx
@@ -19,6 +19,7 @@ import {
import { colors } from '@entur/tokens'
import { Departure, LegMode, TransportMode, TransportSubmode } from '@entur/sdk'
+import { TranslatedString, Translation } from '@entur/sdk/lib/mobility/types'
import { LineData, TileSubLabel, Theme, IconColorType } from './types'
import { useSettingsContext } from './settings'
@@ -393,3 +394,15 @@ export const ConditionalWrapper = ({
wrapper,
children,
}: WrapperProps) => (condition ? wrapper(children) : children)
+
+export function getTranslation(
+ translationObject: TranslatedString,
+ languageId = 'nb',
+): string | null {
+ const translations: Translation[] = translationObject.translation
+ const match = translations.find(
+ (currentTranslation) => currentTranslation.language === languageId,
+ )
+ if (!match) return null
+ return match.value
+}