From c76537135aa7ccfcc008fa28ed86d4c59f3cc4e8 Mon Sep 17 00:00:00 2001 From: Daniel Heppner Date: Mon, 10 Jul 2023 16:43:12 -0700 Subject: [PATCH] address pr comments --- .../core-utils/src/__tests__/itinerary.js | 8 +-- .../src/TransitLegBody/index.tsx | 16 +++--- .../trip-details/src/TripDetails.story.tsx | 52 +++++++++---------- packages/trip-details/src/index.tsx | 15 +++--- packages/trip-details/src/types.ts | 15 ++---- packages/trip-details/src/utils.tsx | 4 +- yarn.lock | 5 ++ 7 files changed, 58 insertions(+), 57 deletions(-) diff --git a/packages/core-utils/src/__tests__/itinerary.js b/packages/core-utils/src/__tests__/itinerary.js index e0f31d758..6a10fb8e1 100644 --- a/packages/core-utils/src/__tests__/itinerary.js +++ b/packages/core-utils/src/__tests__/itinerary.js @@ -94,18 +94,20 @@ describe("util > itinerary", () => { const leg = { fareProducts: [ { + id: "testId", product: { medium: { id: "cash" }, - riderCategory: { id: "regular" }, name: "rideCost", - price: { amount: 200, currency: "USD" } + price: { amount: 200, currency: "USD" }, + riderCategory: { id: "regular" } } }, { + id: "testId", product: { + medium: { id: "cash" }, name: "transfer", price: { amount: 50, currency: "USD" }, - medium: { id: "cash" }, riderCategory: { id: "regular" } } } diff --git a/packages/itinerary-body/src/TransitLegBody/index.tsx b/packages/itinerary-body/src/TransitLegBody/index.tsx index d20aef811..53b13b39a 100644 --- a/packages/itinerary-body/src/TransitLegBody/index.tsx +++ b/packages/itinerary-body/src/TransitLegBody/index.tsx @@ -14,7 +14,7 @@ import { injectIntl, IntlShape } from "react-intl"; -import { getLegCost } from "@opentripplanner/core-utils/lib/itinerary"; + import { Duration } from "../defaults"; import * as S from "../styled"; @@ -35,11 +35,12 @@ interface Props { AlertBodyIcon?: FunctionComponent; AlertToggleIcon?: FunctionComponent; alwaysCollapseAlerts: boolean; + defaultFareSelector?: FareProductSelector; intl: IntlShape; leg: Leg; + legDestination: string; LegIcon: LegIconComponent; legIndex: number; - legDestination: string; RouteDescription: FunctionComponent; setActiveLeg: SetActiveLegFunction; setViewedTrip: SetViewedTripFunction; @@ -49,7 +50,6 @@ interface Props { TransitLegSubheader?: FunctionComponent; TransitLegSummary: FunctionComponent; transitOperator?: TransitOperator; - defaultFareSelector?: FareProductSelector; } interface State { @@ -126,13 +126,14 @@ class TransitLegBody extends Component { render(): ReactElement { const { - AlertToggleIcon = S.DefaultAlertToggleIcon, AlertBodyIcon, + AlertToggleIcon = S.DefaultAlertToggleIcon, alwaysCollapseAlerts, + defaultFareSelector, intl, leg, - LegIcon, legDestination, + LegIcon, RouteDescription, setViewedTrip, showAgencyInfo, @@ -140,8 +141,7 @@ class TransitLegBody extends Component { timeZone, TransitLegSubheader, TransitLegSummary, - transitOperator, - defaultFareSelector + transitOperator } = this.props; const { agencyBrandingUrl, agencyName, agencyUrl, alerts } = leg; const { alertsExpanded, stopsExpanded } = this.state; @@ -171,7 +171,7 @@ class TransitLegBody extends Component { const legCost = defaultFareSelector && - getLegCost( + coreUtils.itinerary.getLegCost( leg, defaultFareSelector.mediumId, defaultFareSelector.riderCategoryId diff --git a/packages/trip-details/src/TripDetails.story.tsx b/packages/trip-details/src/TripDetails.story.tsx index 4d878a6dc..bc7eba734 100644 --- a/packages/trip-details/src/TripDetails.story.tsx +++ b/packages/trip-details/src/TripDetails.story.tsx @@ -59,57 +59,57 @@ const StyledTripDetails = styled(TripDetails)` const otp2FareByLegLayout: FareTableLayout[] = [ { - headerKey: "regular", cols: [ { columnHeaderKey: "cash", - riderCategoryId: "orca:regular", - mediumId: "orca:cash" + mediumId: "orca:cash", + riderCategoryId: "orca:regular" }, { columnHeaderKey: "electronic", - riderCategoryId: "orca:regular", - mediumId: "orca:electronic" + mediumId: "orca:electronic", + riderCategoryId: "orca:regular" }, { columnHeaderKey: "special", - riderCategoryId: "orca:special", - mediumId: "orca:electronic" + mediumId: "orca:electronic", + riderCategoryId: "orca:special" } - ] + ], + headerKey: "regular" }, { - headerKey: "youth", cols: [ { columnHeaderKey: "cash", - riderCategoryId: "orca:youth", - mediumId: "orca:cash" + mediumId: "orca:cash", + riderCategoryId: "orca:youth" }, { columnHeaderKey: "electronic", - riderCategoryId: "orca:youth", - mediumId: "orca:electronic" + mediumId: "orca:electronic", + riderCategoryId: "orca:youth" }, { columnHeaderKey: "test", - riderCategoryId: "invalidkey", - mediumId: "invalidkey" + mediumId: "invalidkey", + riderCategoryId: "invalidkey" } - ] + ], + headerKey: "youth" }, { headerKey: "senior", cols: [ { columnHeaderKey: "cash", - riderCategoryId: "orca:senior", - mediumId: "orca:cash" + mediumId: "orca:cash", + riderCategoryId: "orca:senior" }, { columnHeaderKey: "electronic", - riderCategoryId: "orca:senior", - mediumId: "orca:electronic" + mediumId: "orca:electronic", + riderCategoryId: "orca:senior" } ] } @@ -193,11 +193,11 @@ function createTripDetailsTemplate( ): ComponentStory { const TripDetailsTemplate = ( { - TimeActiveDetails, + defaultFareType, DepartureDetails, FareDetails, fareDetailsLayout, - defaultFareType, + TimeActiveDetails, itinerary }: TripDetailsProps, { globals, parameters }: StoryContext @@ -280,9 +280,9 @@ export const BikeTransitBikeItinerary = makeStory({ }); export const LegFareProductsItinerary = makeStory({ - itinerary: otp2FareProducts, + defaultFareType: otp2defaultFareType, fareDetailsLayout: otp2FareByLegLayout, - defaultFareType: otp2defaultFareType + itinerary: otp2FareProducts }); export const WalkInterlinedTransitItinerary = makeStory( @@ -346,14 +346,14 @@ export const TncTransitItinerary = makeStory( export const TncTransitItineraryWithCustomMessages = makeStory( { - TimeActiveDetails: CustomTimeActiveDetails, defaultFareType: { headerKey: "electronicRegular", mediumId: "orca:electronic", riderCategoryId: "orca:regular" }, DepartureDetails: CustomDepartureDetails, - itinerary: tncTransitTncItinerary + itinerary: tncTransitTncItinerary, + TimeActiveDetails: CustomTimeActiveDetails }, { // For illustration purposes, diff --git a/packages/trip-details/src/index.tsx b/packages/trip-details/src/index.tsx index 00bf4a3e8..aa8f1eabb 100644 --- a/packages/trip-details/src/index.tsx +++ b/packages/trip-details/src/index.tsx @@ -1,4 +1,5 @@ import coreUtils from "@opentripplanner/core-utils"; +import { FareProductSelector } from "@opentripplanner/types"; import React, { ReactElement } from "react"; import { FormattedMessage, FormattedNumber } from "react-intl"; import { CalendarAlt } from "@styled-icons/fa-solid/CalendarAlt"; @@ -6,15 +7,13 @@ import { Heartbeat } from "@styled-icons/fa-solid/Heartbeat"; import { MoneyBillAlt } from "@styled-icons/fa-solid/MoneyBillAlt"; import { Leaf } from "@styled-icons/fa-solid/Leaf"; import { Route } from "@styled-icons/fa-solid/Route"; - -import { getItineraryCost } from "@opentripplanner/core-utils/lib/itinerary"; import { flatten } from "flat"; import * as S from "./styled"; import TripDetail from "./trip-detail"; import FareLegTable from "./fare-table"; import { boldText, renderFare } from "./utils"; -import { FareType, TimeActiveDetailsProps, TripDetailsProps } from "./types"; +import { TimeActiveDetailsProps, TripDetailsProps } from "./types"; // Load the default messages. import defaultEnglishMessages from "../i18n/en-US.yml"; @@ -81,7 +80,7 @@ export function TripDetails({ const { companies, fareTypes } = itinerary.legs.reduce<{ companies: string; - fareTypes: FareType[]; + fareTypes: FareProductSelector[]; }>( (prev, leg) => { if (leg.rideHailingEstimate) { @@ -110,7 +109,7 @@ export function TripDetails({ let fare; if (fareTypes.length > 0 && defaultFareType) { - const defaultFareTotal = getItineraryCost( + const defaultFareTotal = coreUtils.itinerary.getItineraryCost( itinerary.legs, defaultFareType.mediumId, defaultFareType.riderCategoryId @@ -160,12 +159,12 @@ export function TripDetails({ } return ( ) } @@ -300,9 +299,9 @@ export function TripDetails({ description={ FareDetails && ( ) } diff --git a/packages/trip-details/src/types.ts b/packages/trip-details/src/types.ts index 99a928979..9a27dc5ef 100644 --- a/packages/trip-details/src/types.ts +++ b/packages/trip-details/src/types.ts @@ -1,6 +1,6 @@ // Prettier does not recognize the import type syntax. // eslint-disable-next-line prettier/prettier -import type { MassUnitOption, Itinerary, Money, Leg } from "@opentripplanner/types"; +import type { FareProductSelector, Itinerary, Leg, Money, MassUnitOption, } from "@opentripplanner/types"; import type { ReactElement } from "react"; export interface TimeActiveDetailsProps { @@ -19,18 +19,13 @@ export interface DepartureDetailsProps { departureDate: Date; } -export interface FareType { - riderCategoryId: string; - mediumId: string; -} - /** * This is the interface used to define the layout for a particular fare table. * The table with be rendered with the columns defined here, * with each row being an individual transit leg from the itinerary. */ export interface FareTableLayout { - cols: (FareType & { + cols: (FareProductSelector & { columnHeaderKey: string; })[] headerKey: string; @@ -41,7 +36,7 @@ export interface FareLegTableProps { } // Total fare amount corresponding to a fare key -export type FareTotals = (FareType & { price: Money })[] +export type FareTotals = (FareProductSelector & { price: Money })[] export interface TransitFareProps { headerKey: string; @@ -55,9 +50,9 @@ export interface TransitFareProps { } export interface FareDetailsProps { + legs: Leg[]; maxTNCFare: number; minTNCFare: number; - legs: Leg[]; } @@ -73,7 +68,7 @@ export interface TripDetailsProps { /** * Determines which transit fare should be displayed by default, should there be multiple transit fare types. */ - defaultFareType?: { headerKey: string } & FareType; + defaultFareType?: { headerKey: string } & FareProductSelector; /** * Slot for a custom component to render the expandable section for departure. */ diff --git a/packages/trip-details/src/utils.tsx b/packages/trip-details/src/utils.tsx index 48f88c23c..36cfd05f6 100644 --- a/packages/trip-details/src/utils.tsx +++ b/packages/trip-details/src/utils.tsx @@ -1,10 +1,10 @@ -import React, { ReactElement } from "react"; +import React, { ReactElement, ReactNode } from "react"; import { FormattedNumber } from "react-intl"; /** * Format text bold (used with FormattedMessage). */ -export function boldText(contents: ReactElement | string): ReactElement { +export function boldText(contents: ReactNode): ReactElement { return {contents}; } diff --git a/yarn.lock b/yarn.lock index 047f4ecba..89314e45f 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3275,6 +3275,11 @@ resolved "https://registry.yarnpkg.com/@opentripplanner/types/-/types-6.0.0-alpha.4.tgz#dee3c06675e30c596159d182ed707e7710cd937c" integrity sha512-FlYsHm/tk+x0ldrEG1X9Ph1R1k3way1oEdKX7XSnhu9lNTzL4lO0hfT1PLzNXMfBRar7TzK94PHNDibJsod8Kw== +"@opentripplanner/types@^6.0.0-alpha.9": + version "6.0.0-alpha.10" + resolved "https://registry.yarnpkg.com/@opentripplanner/types/-/types-6.0.0-alpha.10.tgz#1489c55f7741ef46df6882c682580ea96ca23d62" + integrity sha512-s0xBgA3WLqvda5itUYzv7PGyMV/dqITfnA2zpdwsbyzuNQeOYTk1tSQLWr+QH7mbUYJXAs5i8qzC/VNvDSZQqg== + "@peculiar/asn1-schema@^2.1.6", "@peculiar/asn1-schema@^2.3.0": version "2.3.3" resolved "https://registry.yarnpkg.com/@peculiar/asn1-schema/-/asn1-schema-2.3.3.tgz#21418e1f3819e0b353ceff0c2dad8ccb61acd777"