From 9c047fb71c63187f2cb5c71486a8b353cc99ce87 Mon Sep 17 00:00:00 2001 From: amy-corson-ibigroup <115499534+amy-corson-ibigroup@users.noreply.github.com> Date: Thu, 12 Sep 2024 17:35:50 -0500 Subject: [PATCH 1/6] feat(map-popup): Pass operator images to header --- packages/map-popup/src/index.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/map-popup/src/index.tsx b/packages/map-popup/src/index.tsx index 6f699803e..af3f0da34 100644 --- a/packages/map-popup/src/index.tsx +++ b/packages/map-popup/src/index.tsx @@ -90,6 +90,7 @@ type Props = { configCompanies?: ConfiguredCompany[]; entity: Entity getEntityName?: (entity: Entity, configCompanies: Company[],) => string; + getEntityPrefix?: (entity: Entity) => JSX.Element setLocation?: ({ location, locationType }: { location: Location, locationType: string }) => void; setViewedStop?: StopEventHandler; }; @@ -101,7 +102,7 @@ function entityIsStation(entity: Entity): entity is Station { /** * Renders a map popup for a stop, scooter, or shared bike */ -export function MapPopup({ closePopup = null, configCompanies, entity, getEntityName, setLocation, setViewedStop }: Props): JSX.Element { +export function MapPopup({ closePopup = null, configCompanies, entity, getEntityName, getEntityPrefix, setLocation, setViewedStop }: Props): JSX.Element { const intl = useIntl() if (!entity) return <> @@ -121,6 +122,7 @@ export function MapPopup({ closePopup = null, configCompanies, entity, getEntity + {getEntityPrefix && getEntityPrefix(entity)} Date: Thu, 12 Sep 2024 17:37:45 -0500 Subject: [PATCH 2/6] feat(otp2-tile-overlay): pass operator logos through to map popup --- packages/otp2-tile-overlay/src/index.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/packages/otp2-tile-overlay/src/index.tsx b/packages/otp2-tile-overlay/src/index.tsx index 468c0e5cf..8e3da7f17 100644 --- a/packages/otp2-tile-overlay/src/index.tsx +++ b/packages/otp2-tile-overlay/src/index.tsx @@ -2,6 +2,7 @@ import EntityPopup from "@opentripplanner/map-popup" import { ConfiguredCompany, MapLocationActionArg, + Station, Stop, StopEventHandler, } from "@opentripplanner/types" @@ -19,6 +20,7 @@ const AREA_TYPES = ["areaStops"] const OTP2TileLayerWithPopup = ({ color, configCompanies, + getEntityPrefix, id, network, onMapClick, @@ -33,6 +35,7 @@ const OTP2TileLayerWithPopup = ({ */ color?: string; configCompanies?: ConfiguredCompany[] + getEntityPrefix?: (entity: Stop | Station) => JSX.Element id: string name?: string /** @@ -183,6 +186,7 @@ const OTP2TileLayerWithPopup = ({ { setClickedEntity(null); setLocation(location) } : null} setViewedStop={setViewedStop ? (stop) => { setClickedEntity(null);setViewedStop(stop) } : null} /> @@ -210,7 +214,8 @@ const generateOTP2TileLayers = ( endpoint: string, setLocation?: (location: MapLocationActionArg) => void, setViewedStop?: (stop: Stop) => void, - configCompanies?: ConfiguredCompany[] + configCompanies?: ConfiguredCompany[], + getEntityPrefix?: (entity: Stop | Station) => JSX.Element ): JSX.Element[] => { return [ Date: Fri, 13 Sep 2024 12:29:54 -0500 Subject: [PATCH 3/6] Add prefixEntity story in map-popup --- packages/map-popup/src/MapPopup.story.tsx | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/packages/map-popup/src/MapPopup.story.tsx b/packages/map-popup/src/MapPopup.story.tsx index 708885586..1c06b1cbf 100644 --- a/packages/map-popup/src/MapPopup.story.tsx +++ b/packages/map-popup/src/MapPopup.story.tsx @@ -1,5 +1,7 @@ import React from "react"; import { action } from "@storybook/addon-actions"; +import styled from "styled-components"; +import { Station, Stop } from "@opentripplanner/types"; import MapPopupContents from "./index"; export default { @@ -8,6 +10,7 @@ export default { const STOP = { flex: false, + gtfsId: "9526", id: "9526", lat: 45.523009, lon: -122.672529, @@ -64,6 +67,18 @@ const FLOATING_CAR = { y: 52.52 }; +const getEntityPrefixExample = (entity: Stop | Station) => { + const DemoIcon = styled.span` + background-color: blue; + border-radius: 50px; + color: white; + margin-right: 0.5ch; + padding: 2px; + `; + + return {entity.name?.charAt(0)}; +}; + export const StopEntity = (): JSX.Element => ( ( setViewedStop={action("setViewedStop")} /> ); +export const StopEntitywithEntityPrefix = (): JSX.Element => ( + getEntityPrefixExample(STOP)} + setLocation={action("setLocation")} + setViewedStop={action("setViewedStop")} + /> +); export const StopEntityNoHandlers = (): JSX.Element => ( From 2eb968f4edb0aef43c470abee471a94fccbf5af5 Mon Sep 17 00:00:00 2001 From: amy-corson-ibigroup <115499534+amy-corson-ibigroup@users.noreply.github.com> Date: Mon, 23 Sep 2024 11:33:57 -0500 Subject: [PATCH 4/6] refactor storybook getEntityPrefix --- packages/map-popup/src/MapPopup.story.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/map-popup/src/MapPopup.story.tsx b/packages/map-popup/src/MapPopup.story.tsx index 1c06b1cbf..d3de3fd1b 100644 --- a/packages/map-popup/src/MapPopup.story.tsx +++ b/packages/map-popup/src/MapPopup.story.tsx @@ -89,7 +89,7 @@ export const StopEntity = (): JSX.Element => ( export const StopEntitywithEntityPrefix = (): JSX.Element => ( getEntityPrefixExample(STOP)} + getEntityPrefix={getEntityPrefixExample} setLocation={action("setLocation")} setViewedStop={action("setViewedStop")} /> From 208c2aaadccfd440d74c2ea295537304b75c98db Mon Sep 17 00:00:00 2001 From: amy-corson-ibigroup <115499534+amy-corson-ibigroup@users.noreply.github.com> Date: Tue, 24 Sep 2024 10:17:00 -0500 Subject: [PATCH 5/6] Fix missing comma --- packages/otp2-tile-overlay/src/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/otp2-tile-overlay/src/index.tsx b/packages/otp2-tile-overlay/src/index.tsx index d7cf6ee98..02f669a75 100644 --- a/packages/otp2-tile-overlay/src/index.tsx +++ b/packages/otp2-tile-overlay/src/index.tsx @@ -228,7 +228,7 @@ const generateOTP2TileLayers = ( setLocation?: (location: MapLocationActionArg) => void, setViewedStop?: (stop: Stop) => void, stopsWhitelist?: string[], - configCompanies?: ConfiguredCompany[] + configCompanies?: ConfiguredCompany[], getEntityPrefix?: (entity: Stop | Station) => JSX.Element ): JSX.Element[] => { return [ From 5888a387997cbc347b325ec92924fa58968f036d Mon Sep 17 00:00:00 2001 From: amy-corson-ibigroup <115499534+amy-corson-ibigroup@users.noreply.github.com> Date: Tue, 24 Sep 2024 12:36:29 -0500 Subject: [PATCH 6/6] test: update snapshots --- .../src/__snapshots__/MapPopup.story.tsx.snap | 68 +++++++++++++++++++ 1 file changed, 68 insertions(+) diff --git a/packages/map-popup/src/__snapshots__/MapPopup.story.tsx.snap b/packages/map-popup/src/__snapshots__/MapPopup.story.tsx.snap index 9ba1045f3..92a57f0ca 100644 --- a/packages/map-popup/src/__snapshots__/MapPopup.story.tsx.snap +++ b/packages/map-popup/src/__snapshots__/MapPopup.story.tsx.snap @@ -255,3 +255,71 @@ exports[`Map Popup StopEntityNoHandlers smoke-test 1`] = ` `; + +exports[`Map Popup StopEntitywithEntityPrefix smoke-test 1`] = ` +
+ +
+`;