Skip to content
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

Jump to bottom

DT-4910: New texts for infobox #4875

Merged
merged 50 commits into from
Nov 20, 2023
Merged

DT-4910: New texts for infobox #4875

Show file tree
Hide file tree
Changes from 11 commits
Commits
Show all changes
50 commits
Select commit Hold shift + click to select a range
9846088
fix: added new links for Tampere
Dvun Oct 20, 2023
33b3c11
fix: added new text in infobox with links
Dvun Oct 20, 2023
182ba1c
fix: added new text in infobox with links
Dvun Oct 20, 2023
67fc9ae
fix: added new translation texts
Dvun Oct 20, 2023
99f7b31
fix: renamed names in config
Dvun Oct 23, 2023
e807d10
fix: renamed
Dvun Oct 23, 2023
290cf17
fix: added new text for infobox
Dvun Oct 23, 2023
7cb8c67
fix: added new text for infobox
Dvun Oct 23, 2023
f569001
fix: renamed nysse-ticket-limited" to train-ticket-limited"
Dvun Nov 1, 2023
ed2ca98
fix: new function for check pickup type
Dvun Nov 7, 2023
3cb02df
fix: added mode check
Dvun Nov 7, 2023
6cb1f7f
fix: fixed function to check is Rail mode or not
Dvun Nov 8, 2023
22ed412
Merge branch 'v3' into DT-4910
Dvun Nov 8, 2023
08845a0
fix: fixed mystic string to constants
Dvun Nov 8, 2023
acad2d2
fix: fixed check
Dvun Nov 9, 2023
ca55d23
fix: removed not needed if
Dvun Nov 9, 2023
81dfc4b
fix: totally reworked infoBoxText and created with nested constants
Dvun Nov 9, 2023
ac037fb
fix: if statement fix and removed 2 constants for default infoText
Dvun Nov 9, 2023
ae21227
fix: created new InfoBox component
Dvun Nov 10, 2023
28d9113
fix: infoboxtext moved to own component
Dvun Nov 10, 2023
2487893
fix: fixed if statement for info box
Dvun Nov 13, 2023
9c720c7
fix: renamed from InfoBox to FareDisclaimer + added defaultProps
Dvun Nov 15, 2023
14043e3
fix: config method renamed
Dvun Nov 15, 2023
291099d
fix: renamed config method
Dvun Nov 15, 2023
798ee74
fix: renamed function name
Dvun Nov 15, 2023
98260b8
fix: renamed function names and methods
Dvun Nov 15, 2023
f83a7c3
fix: fix
Dvun Nov 15, 2023
8934ca8
fix: config update
Dvun Nov 16, 2023
0954c57
fix: renamed configData to linkText
Dvun Nov 16, 2023
44d211b
fix: reworked, updated function to show info text
Dvun Nov 16, 2023
c5d341d
fix: removed unnecessary function
Dvun Nov 16, 2023
dafbba7
fix: updated to more generic
Dvun Nov 16, 2023
f3274b1
fix: fix
Dvun Nov 16, 2023
1c1b6e1
fix: fixed same text pushed many times
Dvun Nov 16, 2023
f575303
fix: fix code
Dvun Nov 16, 2023
8ee65b8
fix: code fix
Dvun Nov 17, 2023
88aad96
fix: code fix
Dvun Nov 17, 2023
84758f0
fix: removed config
Dvun Nov 17, 2023
d8faf24
fix: updated code and config with agencyName coming inside values
Dvun Nov 17, 2023
a5bec27
fix: removed 'train-ticket-limited' texts
Dvun Nov 17, 2023
d94c436
fix: update to more generic properties
Dvun Nov 17, 2023
f1c717e
fix: update to more generic properties
Dvun Nov 17, 2023
125255c
fix: update to more generic properties
Dvun Nov 17, 2023
bc3c5a5
fix: moved texts from translation.js
Dvun Nov 17, 2023
7b77158
fix: fix
Dvun Nov 17, 2023
b9c7ed1
fix: bad update :(
Dvun Nov 17, 2023
0285ffa
fix: changed propTypes
Dvun Nov 17, 2023
8b6c417
fix: update
Dvun Nov 17, 2023
65567b7
chore: remove redundant variables
vesameskanen Nov 18, 2023
74e5f3c
fix: incorrect message id
vesameskanen Nov 20, 2023
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
156 changes: 105 additions & 51 deletions app/component/ItineraryTab.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,17 +15,18 @@ import ItineraryLegs from './ItineraryLegs';
import BackButton from './BackButton';
import MobileTicketPurchaseInformation from './MobileTicketPurchaseInformation';
import {
getRoutes,
getZones,
compressLegs,
getRoutes,
getTotalBikingDistance,
getTotalBikingDuration,
getTotalDrivingDistance,
getTotalDrivingDuration,
getTotalWalkingDistance,
getTotalWalkingDuration,
legContainsRentalBike,
getTotalDrivingDuration,
getTotalDrivingDistance,
getZones,
isCallAgencyPickupType,
isTrainLimitationPickupType,
legContainsRentalBike,
} from '../util/legUtils';
import { BreakpointConsumer } from '../util/withBreakpoint';

Expand All @@ -36,10 +37,10 @@ import {
} from '../util/fareUtils';
import { addAnalyticsEvent } from '../util/analyticsUtils';
import {
getCurrentMillis,
getFormattedTimeDate,
isToday,
isTomorrow,
getFormattedTimeDate,
getCurrentMillis,
} from '../util/timeUtils';
import CityBikeDurationInfo from './CityBikeDurationInfo';
import { getCityBikeNetworkId } from '../util/citybikes';
Expand Down Expand Up @@ -86,7 +87,7 @@ class ItineraryTab extends React.Component {

static defaultProps = {
hideTitle: false,
currentLanguage: "fi"
currentLanguage: 'fi',
};

static contextTypes = {
Expand Down Expand Up @@ -216,8 +217,82 @@ class ItineraryTab extends React.Component {
const suggestionIndex = this.context.match.params.secondHash
? Number(this.context.match.params.secondHash) + 1
: Number(this.context.match.params.hash) + 1;
const itineraryContainsCallLegs = itinerary.legs.some(leg => isCallAgencyPickupType(leg));

const itineraryContainsCallLegs = itinerary.legs.some(leg =>
isCallAgencyPickupType(leg),
);
const isTrainLimitation = itinerary.legs.some(leg =>
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Poor naming:

  • isTrainLimitation -> hasTrainLegs. Actually this could be more generic: configuration could include a map of disclaimers per mode.
  • isShowItineraryContainsCallLegsInfo is totally incomprehensible, change it to 'showCallAgencyDisclaimer'
  • isShowTrainLimitationInfo -> showLegModeDisclaimer

isTrainLimitationPickupType(leg),
);

const infoBoxText = () => {
if (config.callAgencyInfo && itineraryContainsCallLegs) {
return (
<div className="description-container">
<FormattedMessage
id="separate-ticket-required-for-call-agency-disclaimer"
values={{
callAgencyInfoUrl: get(
config,
`callAgencyInfo.${currentLanguage}.callAgencyInfoLink`,
),
}}
/>
<a href={config.callAgencyInfo[currentLanguage].callAgencyInfoLink}>
<FormattedMessage
id={
config.callAgencyInfo[currentLanguage].callAgencyInfoLinkText
}
defaultMessage={
config.callAgencyInfo[currentLanguage].callAgencyInfoLinkText
}
/>
</a>
</div>
);
}

if (config.showTrainLimitationInfo && isTrainLimitation) {
return (
<div className="description-container">
<FormattedMessage
id="train-ticket-limited"
values={{
agencyName: get(config, 'appBarLink.name'),
}}
/>
<a
href={
config.showTrainLimitationInfo[currentLanguage]
.showTrainLimitationInfoLink
}
>
<FormattedMessage
id={
config.showTrainLimitationInfo[currentLanguage]
.showTrainLimitationInfoLinkText
}
defaultMessage={
config.showTrainLimitationInfo[currentLanguage]
.showTrainLimitationInfoLinkText
}
/>
</a>
</div>
);
}

Copy link
Member

@vesameskanen vesameskanen Nov 16, 2023 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Seuraava olisi hyvä ratkaisu:
Rakenna taulukko FareDisclaimereja. Taulukoon pusketaan CallAgency yms disclaimerit, ja lisäksi n kpl mode disclaimereja. Eli iteroi kaikki legit ja katso onko käytössä leg.mode disclaimer. Jos on puske taulukkoon.
Tekstit kannattaa siirtää pois translations.txt tiedostosta config .modeDisclaimer objektiin.

return (
<div className="description-container">
<FormattedMessage
id="separate-ticket-required-disclaimer"
values={{
agencyName: get(config, 'ticketInformation.primaryAgencyName'),
}}
/>
</div>
);
};

return (
<div className="itinerary-tab">
<h2 className="sr-only">
Expand All @@ -240,7 +315,11 @@ class ItineraryTab extends React.Component {
futureText={extraProps.futureText}
isMultiRow={extraProps.isMultiRow}
isMobile={this.props.isMobile}
hideBottomDivider={shouldShowFarePurchaseInfo(config, breakpoint, fares)}
hideBottomDivider={shouldShowFarePurchaseInfo(
config,
breakpoint,
fares,
)}
/>
) : (
<>
Expand Down Expand Up @@ -281,18 +360,19 @@ class ItineraryTab extends React.Component {
config={config}
/>
),
shouldShowFareInfo(config) && (
shouldShowFarePurchaseInfo(config,breakpoint,fares) ? (
shouldShowFareInfo(config) &&
(shouldShowFarePurchaseInfo(config, breakpoint, fares) ? (
<MobileTicketPurchaseInformation
fares={fares}
zones={getZones(itinerary.legs)}
/>) :
( <TicketInformation
/>
) : (
<TicketInformation
fares={fares}
zones={getZones(itinerary.legs)}
legs={itinerary.legs}
/>)
),
/>
)),
<div
className={cx('momentum-scroll itinerary-tabs__scroll', {
multirow: extraProps.isMultiRow,
Expand All @@ -310,37 +390,7 @@ class ItineraryTab extends React.Component {
<div className="icon-container">
<Icon className="info" img="icon-icon_info" />
</div>
{config.callAgencyInfo && itineraryContainsCallLegs ?
(<div className="description-container">
<FormattedMessage
id="separate-ticket-required-for-call-agency-disclaimer"
values={{
callAgencyInfoUrl: get(
config,
`callAgencyInfo.${currentLanguage}.callAgencyInfoLink`,
),
}}
/>
<a href={config.callAgencyInfo[currentLanguage].callAgencyInfoLink}>
<FormattedMessage
id={config.callAgencyInfo[currentLanguage].callAgencyInfoLinkText}
defaultMessage={config.callAgencyInfo[currentLanguage].callAgencyInfoLinkText}
/>
</a>
</div>
) : (
<div className="description-container">
<FormattedMessage
id="separate-ticket-required-disclaimer"
values={{
agencyName: get(
config,
'ticketInformation.primaryAgencyName',
),
}}
/>
</div>
)}
{infoBoxText()}
</div>
)}
<ItineraryLegs
Expand Down Expand Up @@ -403,7 +453,11 @@ const withRelay = createFragmentContainer(
}
legs {
mode
nextLegs(numberOfLegs: 2 originModesWithParentStation: [RAIL] destinationModesWithParentStation: [RAIL]) {
nextLegs(
numberOfLegs: 2
originModesWithParentStation: [RAIL]
destinationModesWithParentStation: [RAIL]
) {
mode
distance
route {
Expand Down Expand Up @@ -436,8 +490,8 @@ const withRelay = createFragmentContainer(
tripHeadsign
pattern {
code
}
}

gtfsId
}
realTime
Expand Down
100 changes: 66 additions & 34 deletions app/component/TransitLeg.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import { FormattedMessage, intlShape } from 'react-intl';
import Link from 'found/Link';
import connectToStores from 'fluxible-addons-react/connectToStores';

import ExternalLink from './ExternalLink';
import get from 'lodash/get';
import LegAgencyInfo from './LegAgencyInfo';
import Icon from './Icon';
import IntermediateLeg from './IntermediateLeg';
Expand All @@ -16,30 +16,31 @@ import PlatformNumber from './PlatformNumber';
import ServiceAlertIcon from './ServiceAlertIcon';
import StopCode from './StopCode';
import {
alertSeverityCompare,
getActiveAlertSeverityLevel,
legHasCancelation,
tripHasCancelationForStop,
getActiveLegAlerts,
getActiveLegAlertSeverityLevel,
alertSeverityCompare,
getMaximumAlertSeverityLevel,
hasEntitiesOfType,
legHasCancelation,
tripHasCancelationForStop,
} from '../util/alertUtils';
import { PREFIX_ROUTES, PREFIX_STOPS, PREFIX_DISRUPTION } from '../util/path';
import { PREFIX_DISRUPTION, PREFIX_ROUTES, PREFIX_STOPS } from '../util/path';
import { durationToString } from '../util/timeUtils';
import { addAnalyticsEvent } from '../util/analyticsUtils';
import {
getZoneLabel,
getHeadsignFromRouteLongName,
getStopHeadsignFromStoptimes,
getZoneLabel,
} from '../util/legUtils';
import { shouldShowFareInfo } from '../util/fareUtils';
import { AlertSeverityLevelType, AlertEntityType } from '../constants';
import { AlertEntityType, AlertSeverityLevelType } from '../constants';
import ZoneIcon from './ZoneIcon';
import StopInfo from './StopInfo';
import InterlineInfo from './InterlineInfo';
import AlternativeLegsInfo from './AlternativeLegsInfo';
import LegInfo from './LegInfo';
import ExternalLink from './ExternalLink';

class TransitLeg extends React.Component {
constructor(props) {
Expand Down Expand Up @@ -231,8 +232,8 @@ class TransitLeg extends React.Component {
.format('HH:mm')}
</span>,
];
const LegRouteName = leg.from.name.concat(' - ').concat(leg.to.name);
const modeClassName = mode.toLowerCase();
const LegRouteName = leg.from.name.concat(' - ').concat(leg.to.name);

const textVersionBeforeLink = (
<FormattedMessage
Expand Down Expand Up @@ -544,35 +545,66 @@ class TransitLeg extends React.Component {
/>
)}
</div>
{leg.fare && leg.fare.isUnknown && shouldShowFareInfo(config) && (
<div className="disclaimer-container unknown-fare-disclaimer__leg">
<div className="description-container">
<span className="accent">
{`${intl.formatMessage({ id: 'pay-attention' })} `}
</span>
{intl.formatMessage({ id: 'separate-ticket-required' })}
{leg.fare &&
leg.fare.isUnknown &&
shouldShowFareInfo(config) &&
(mode === 'RAIL' && config.showTrainLimitationInfo ? (
<div className="disclaimer-container unknown-fare-disclaimer__leg">
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Koeta koodata tämä näin:

(config.modeDisclaimers[mode] ?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suora käytä mode en pysty, koska tämä tulee kun 'RAIL', mutta tarvitseen configille 'rail'.
Onko sitten parempi käytää tällä mode.toLowerCase() tai sitten sama tiedostossa oli jo aikasemmin kirjoitety
const modeClassName = mode.toLowerCase();
Tämä on hyvä käytä, mutta tuntuu, että muttoja nimi modeClassName ei ole hyvä ???

<div className="description-container">
<FormattedMessage
id="train-ticket-limited"
values={{
agencyName: get(config, 'appBarLink.name'),
}}
/>
<a
href={
config.showTrainLimitationInfo[lang]
.showTrainLimitationInfoLink
}
>
<FormattedMessage
id={
config.showTrainLimitationInfo[lang]
.showTrainLimitationInfoLinkText
}
defaultMessage={
config.showTrainLimitationInfo[lang]
.showTrainLimitationInfoLinkText
}
/>
</a>
</div>
</div>
<div className="ticket-info">
<div className="accent">{LegRouteName}</div>
{leg.fare.agency &&
!config.hideExternalOperator(leg.fare.agency) && (
<React.Fragment>
<div>{leg.fare.agency.name}</div>
{leg.fare.agency.fareUrl && (
<ExternalLink
className="agency-link"
href={leg.fare.agency.fareUrl}
>
{intl.formatMessage({ id: 'extra-info' })}
</ExternalLink>
)}
</React.Fragment>
)}
) : (
<div className="disclaimer-container unknown-fare-disclaimer__leg">
<div className="description-container">
<span className="accent">
{`${intl.formatMessage({ id: 'pay-attention' })} `}
</span>
{intl.formatMessage({ id: 'separate-ticket-required' })}
</div>
<div className="ticket-info">
<div className="accent">{LegRouteName}</div>
{leg.fare.agency &&
!config.hideExternalOperator(leg.fare.agency) && (
<React.Fragment>
<div>{leg.fare.agency.name}</div>
{leg.fare.agency.fareUrl && (
<ExternalLink
className="agency-link"
href={leg.fare.agency.fareUrl}
>
{intl.formatMessage({ id: 'extra-info' })}
</ExternalLink>
)}
</React.Fragment>
)}
</div>
</div>
</div>
)}
))}
</div>
<span className="sr-only">{alertSeverityDescription}</span>
<span className="sr-only">{alertSeverityDescription}</span>;
</div>
);
};
Expand Down
Loading