diff --git a/app/component/AlertList.js b/app/component/AlertList.js index 7bfa9eca64..c7c52d04f7 100644 --- a/app/component/AlertList.js +++ b/app/component/AlertList.js @@ -53,14 +53,17 @@ const AlertList = ({ disableScrolling, showExpired, serviceAlerts, + showRouteNameLink, }) => { const getRoute = alert => alert.route || {}; const getMode = alert => getRoute(alert).mode; const getShortName = alert => getRoute(alert).shortName; + const getRouteGtfsId = alert => getRoute(alert).gtfsId; const getStop = alert => alert.stop || {}; const getVehicleMode = alert => getStop(alert).vehicleMode; const getCode = alert => getStop(alert).code; + const getStopGtfsId = alert => getStop(alert).gtfsId; const getGroupKey = alert => `${alert.severityLevel}${(hasRoute(alert) && `route_${getMode(alert)}`) || @@ -115,6 +118,10 @@ const AlertList = ({ route: (hasRoute(alert) && { mode: getMode(alert), + routeGtfsId: alerts + .sort(alertCompare) + .map(getRouteGtfsId) + .join(','), shortName: alerts .sort(alertCompare) .map(getShortName) @@ -123,6 +130,10 @@ const AlertList = ({ undefined, stop: (hasStop(alert) && { + stopGtfsId: alerts + .sort(alertCompare) + .map(getStopGtfsId) + .join(','), code: alerts .sort(alertCompare) .map(getCode) @@ -132,7 +143,6 @@ const AlertList = ({ undefined, }; }); - return (
@@ -144,9 +154,9 @@ const AlertList = ({ description, expired, header, - route: { color, mode, shortName } = {}, + route: { color, mode, shortName, routeGtfsId } = {}, severityLevel, - stop: { code, vehicleMode } = {}, + stop: { code, vehicleMode, stopGtfsId } = {}, url, validityPeriod: { startTime, endTime }, }, @@ -169,6 +179,8 @@ const AlertList = ({ severityLevel={severityLevel} startTime={startTime} url={url} + gtfsIds={routeGtfsId || stopGtfsId} + showRouteNameLink={showRouteNameLink} /> ), )} @@ -203,6 +215,7 @@ AlertList.propTypes = { disableScrolling: PropTypes.bool, serviceAlerts: PropTypes.arrayOf(alertShape), showExpired: PropTypes.bool, + showRouteNameLink: PropTypes.bool, }; AlertList.defaultProps = { diff --git a/app/component/DisruptionListContainer.js b/app/component/DisruptionListContainer.js index c4e4a01a7e..289d5fa628 100644 --- a/app/component/DisruptionListContainer.js +++ b/app/component/DisruptionListContainer.js @@ -79,7 +79,6 @@ function DisruptionListContainer({ breakpoint, currentTime, root }, { intl }) { const stopAlertsToShow = stopAlerts.filter( showDisruptions ? isDisruption : isInfo, ); - return (
- + )} {stopAlertsToShow.length > 0 && ( @@ -153,7 +156,11 @@ function DisruptionListContainer({ breakpoint, currentTime, root }, { intl }) {
- + )}
@@ -198,10 +205,12 @@ const containerComponent = Relay.createContainer( color mode shortName + gtfsId } stop { code vehicleMode + gtfsId } } } diff --git a/app/component/RouteAlertsContainer.js b/app/component/RouteAlertsContainer.js index 42f00b3653..b8292b6ca0 100644 --- a/app/component/RouteAlertsContainer.js +++ b/app/component/RouteAlertsContainer.js @@ -56,7 +56,11 @@ function RouteAlertsContainer({ route, patternId }, { intl }) { ]; return ( - + ); } diff --git a/app/component/RouteAlertsRow.js b/app/component/RouteAlertsRow.js index 99b58f8c34..ca67d334a4 100644 --- a/app/component/RouteAlertsRow.js +++ b/app/component/RouteAlertsRow.js @@ -4,6 +4,7 @@ import moment from 'moment'; import PropTypes from 'prop-types'; import React from 'react'; import { intlShape } from 'react-intl'; +import { Link } from 'react-router'; import ComponentUsageExample from './ComponentUsageExample'; import ExternalLink from './ExternalLink'; @@ -11,6 +12,7 @@ import IconWithBigCaution from './IconWithBigCaution'; import RouteNumber from './RouteNumber'; import ServiceAlertIcon from './ServiceAlertIcon'; import { AlertSeverityLevelType } from '../constants'; +import { PREFIX_ROUTES, PREFIX_STOPS } from '../util/path'; export const getTimePeriod = ({ currentTime, startTime, endTime, intl }) => { const at = intl.formatMessage({ @@ -48,6 +50,8 @@ export default function RouteAlertsRow( severityLevel, startTime, url, + gtfsIds, + showRouteNameLink, }, { intl }, ) { @@ -57,6 +61,35 @@ export default function RouteAlertsRow( startTime && endTime && currentTime; + const gtfsIdList = gtfsIds ? gtfsIds.split(',') : []; + const routeLinks = + entityType === 'route' && entityIdentifier && gtfsIds + ? entityIdentifier.split(',').map((identifier, i) => ( + + {' '} + {identifier}{' '} + + )) + : []; + + const stopLinks = + entityType === 'stop' && entityIdentifier && gtfsIds + ? entityIdentifier.split(',').map((identifier, i) => ( + + {' '} + {identifier}{' '} + + )) + : []; + return (
{(entityType === 'route' && @@ -83,9 +116,23 @@ export default function RouteAlertsRow(
{(entityIdentifier || url) && (
- {entityIdentifier && ( -
{entityIdentifier}
- )} + {entityIdentifier && + ((entityType === 'route' && + showRouteNameLink && + routeLinks.length > 0 && ( +
{routeLinks}
+ )) || + (!showRouteNameLink && ( +
{entityIdentifier}
+ )) || + ((entityType === 'stop' && + showRouteNameLink && + stopLinks.length > 0 && ( +
{stopLinks}
+ )) || + (!showRouteNameLink && ( +
{entityIdentifier}
+ ))))} {url && ( {intl.formatMessage({ id: 'extra-info' })} @@ -123,6 +170,8 @@ RouteAlertsRow.propTypes = { severityLevel: PropTypes.string, startTime: PropTypes.number, url: PropTypes.string, + gtfsIds: PropTypes.string, + showRouteNameLink: PropTypes.bool, }; RouteAlertsRow.contextTypes = { @@ -154,6 +203,7 @@ RouteAlertsRow.description = () => ( } entityMode="tram" entityIdentifier="2" + gtfsIds="HSL:1002" expired={false} /> @@ -167,6 +217,7 @@ RouteAlertsRow.description = () => ( } entityMode="tram" entityIdentifier="2" + gtfsIds="HSL:1002" expired /> @@ -184,6 +235,7 @@ RouteAlertsRow.description = () => ( header="Lähijunat välillä Pasila-Leppävaara peruttu" description="Suurin osa lähijunista välillä Pasila-Leppävaara on peruttu asetinlaitevian vuoksi" entityIdentifier="Y, S, U, L, E, A" + gtfsIds="HSL:3002Y, HSL:3002S, HSL:3002U, HSL:3002L, HSL:3002E, HSL:3002A" entityMode="rail" severityLevel="WARNING" expired @@ -201,6 +253,7 @@ RouteAlertsRow.description = () => ( header="Lähijunat välillä Pasila-Leppävaara peruttu" description="Suurin osa lähijunista välillä Pasila-Leppävaara on peruttu asetinlaitevian vuoksi" entityIdentifier="Y, S, U, L, E, A" + gtfsIds="HSL:3002Y, HSL:3002S, HSL:3002U, HSL:3002L, HSL:3002E, HSL:3002A" entityMode="rail" severityLevel="WARNING" /> @@ -219,6 +272,7 @@ RouteAlertsRow.description = () => ( header="Lähijunat välillä Pasila-Leppävaara peruttu" description="Suurin osa lähijunista välillä Pasila-Leppävaara on peruttu asetinlaitevian vuoksi" entityIdentifier="Y, S, U, L, E, A" + gtfsIds="HSL:3002Y, HSL:3002S, HSL:3002U, HSL:3002L, HSL:3002E, HSL:3002A" entityMode="rail" severityLevel="WARNING" /> @@ -239,6 +293,7 @@ RouteAlertsRow.description = () => ( header="Lähijunat välillä Pasila-Leppävaara peruttu" description="Suurin osa lähijunista välillä Pasila-Leppävaara on peruttu asetinlaitevian vuoksi" entityIdentifier="Y, S, U, L, E, A" + gtfsIds="HSL:3002Y, HSL:3002S, HSL:3002U, HSL:3002L, HSL:3002E, HSL:3002A" entityMode="rail" severityLevel="WARNING" /> @@ -248,6 +303,7 @@ RouteAlertsRow.description = () => ( header="Pysäkki H4461 siirtyy" description="Leikkikujan pysäkki H4461 siirtyy tilapäisesti kulkusuunnassa 100 metriä taaksepäin." entityIdentifier="97N" + gtfsIds="HSL:1097N" entityMode="bus" severityLevel="INFO" url="https://www.hsl.fi" @@ -258,6 +314,7 @@ RouteAlertsRow.description = () => ( header="Pysäkki H4461 siirtyy" description="Leikkikujan pysäkki H4461 siirtyy tilapäisesti kulkusuunnassa 100 metriä taaksepäin." entityIdentifier="4461" + gtfsIds="HSL%3A1471151" entityMode="bus" entityType="stop" severityLevel="INFO" diff --git a/app/component/StopAlertsContainer.js b/app/component/StopAlertsContainer.js index e8646e6cee..b83125acfb 100644 --- a/app/component/StopAlertsContainer.js +++ b/app/component/StopAlertsContainer.js @@ -48,7 +48,11 @@ const StopAlertsContainer = ({ stop }, { intl }) => { ]; return ( - + ); }; diff --git a/app/component/route.scss b/app/component/route.scss index 838ff4c4fb..09c0b082d0 100644 --- a/app/component/route.scss +++ b/app/component/route.scss @@ -933,7 +933,10 @@ div.route-tabs { display: flex; padding: 0.8em 0.8em 0.8em 0.8em; position: relative; - + .route-alert-row-link { + padding-right: 1px; + padding-left: 1px; + } + .route-alert-row { border-top: 1px solid $light-gray; } diff --git a/test/unit/component/RouteAlertsContainer.test.js b/test/unit/component/RouteAlertsContainer.test.js index 970e7b95fb..e810514a43 100644 --- a/test/unit/component/RouteAlertsContainer.test.js +++ b/test/unit/component/RouteAlertsContainer.test.js @@ -41,6 +41,7 @@ describe('', () => { expect(wrapper.find(AlertList).props()).to.deep.equal({ cancelations: [], serviceAlerts: [], + showRouteNameLink: false, }); }); @@ -77,6 +78,7 @@ describe('', () => { expect(wrapper.find(AlertList).props()).to.deep.equal({ cancelations: [], serviceAlerts: [], + showRouteNameLink: false, }); }); diff --git a/test/unit/component/RouteAlertsRow.test.js b/test/unit/component/RouteAlertsRow.test.js index 0bee61c9cf..d0f2091074 100644 --- a/test/unit/component/RouteAlertsRow.test.js +++ b/test/unit/component/RouteAlertsRow.test.js @@ -46,6 +46,8 @@ describe('', () => { const props = { entityMode: 'BUS', entityType: 'stop', + identifier: '7922', + gtfsIds: 'HSL:27922', expired: false, }; const wrapper = shallowWithIntl(); @@ -85,10 +87,33 @@ describe('', () => { it('should render the identifier', () => { const props = { + entityType: 'route', + entityMode: 'bus', entityIdentifier: '97N', + gtfsIds: 'HSL:2097N', }; const wrapper = shallowWithIntl(); - expect(wrapper.find('.route-alert-top-row').text()).to.equal('97N'); + expect(wrapper.find('.bus')).to.have.lengthOf(1); + }); + + it('should not render the identifier if gtfsIds not provided', () => { + const props = { + entityType: 'route', + entityMode: 'bus', + entityIdentifier: '97N', + showRouteNameLink: true, + }; + const wrapper = shallowWithIntl(); + expect(wrapper.find('.bus')).to.have.lengthOf(0); + }); + + it('should not render the identifier if entityIdentifier not provided', () => { + const props = { + entityType: 'route', + entityMode: 'bus', + }; + const wrapper = shallowWithIntl(); + expect(wrapper.find('.bus')).to.have.lengthOf(0); }); it('should render the url', () => { diff --git a/test/unit/component/StopAlertsContainer.test.js b/test/unit/component/StopAlertsContainer.test.js index 184827ff62..a9e3327980 100644 --- a/test/unit/component/StopAlertsContainer.test.js +++ b/test/unit/component/StopAlertsContainer.test.js @@ -36,6 +36,7 @@ describe('', () => { expect(wrapper.find(AlertList).props()).to.deep.equal({ cancelations: [], serviceAlerts: [], + showRouteNameLink: false, }); });