diff --git a/assets/src/components/app.tsx b/assets/src/components/app.tsx index f35a13311..47786ca95 100644 --- a/assets/src/components/app.tsx +++ b/assets/src/components/app.tsx @@ -22,13 +22,14 @@ import { allOpenRouteIds } from "../models/routeTab" import Nav from "./nav" import RightPanel from "./rightPanel" import { mapModeForUser } from "../util/mapMode" -import { Ghost, VehicleInScheduledService } from "../realtime" +import { Ghost, Vehicle, VehicleInScheduledService } from "../realtime" import MapPage from "./mapPage" import SearchPage from "./searchPage" import { OpenView, isPagePath } from "../state/pagePanelState" import { usePanelStateFromStateDispatchContext } from "../hooks/usePanelState" import PropertiesPanel from "./propertiesPanel" import { isGhost, isVehicle } from "../models/vehicle" +import { TabMode } from "./propertiesPanel/tabPanels" export const AppRoutes = () => { useAppcues() @@ -74,24 +75,14 @@ export const AppRoutes = () => { - - - ) : undefined - } - /> - + } > } /> @@ -100,6 +91,19 @@ export const AppRoutes = () => { element={} /> } /> + + + } + > @@ -111,6 +115,42 @@ export const AppRoutes = () => { ) } +const RouteElement = ({ + openMapEnabled, + selectedVehicleOrGhost, + openView, + vppTabMode, + setTabMode, + closeView, +}: { + openMapEnabled: boolean + selectedVehicleOrGhost?: Vehicle | Ghost | null + openView: OpenView + vppTabMode?: TabMode + setTabMode: (mode: TabMode) => void + closeView: () => void +}) => ( + <> + + + ) : undefined + } + /> + +) + const App = (): ReactElement => { return ( diff --git a/assets/src/components/propertiesPanel.tsx b/assets/src/components/propertiesPanel.tsx index 44b88e5fc..dea17d08a 100644 --- a/assets/src/components/propertiesPanel.tsx +++ b/assets/src/components/propertiesPanel.tsx @@ -10,6 +10,7 @@ import { TabMode } from "./propertiesPanel/tabPanels" interface Props extends IndividualPropertiesPanelProps { selectedVehicleOrGhost: Vehicle | Ghost + openMapEnabled: boolean } export type TabModeProps = { @@ -38,6 +39,7 @@ const PropertiesPanel = ({ tabMode, onChangeTabMode, onClosePanel, + openMapEnabled, }: Props) => { const { socket } = useSocket() const liveVehicle = useVehicleForId(socket, selectedVehicleOrGhost.id) @@ -68,6 +70,7 @@ const PropertiesPanel = ({ tabMode={tabMode} onChangeTabMode={onChangeTabMode} onClosePanel={onClosePanel} + openMapEnabled={openMapEnabled} /> ) : ( { const stations: Stop[] | null = useStations() @@ -65,7 +67,11 @@ const MiniMap = ({ stations={stations} allowFullscreen={!inMapBetaGroup} > - <>{inMapBetaGroup && } + <> + {inMapBetaGroup && openMapEnabled && ( + + )} + ) } diff --git a/assets/src/components/propertiesPanel/vehiclePropertiesPanel.tsx b/assets/src/components/propertiesPanel/vehiclePropertiesPanel.tsx index 8175de5bf..6c4e85ddb 100644 --- a/assets/src/components/propertiesPanel/vehiclePropertiesPanel.tsx +++ b/assets/src/components/propertiesPanel/vehiclePropertiesPanel.tsx @@ -28,6 +28,7 @@ import { DirectionsButton } from "../directionsButton" type Props = { selectedVehicle: Vehicle + openMapEnabled: boolean } & IndividualPropertiesPanelProps const InvalidBanner = () => ( @@ -72,7 +73,13 @@ const useRouteVehicles = ( .filter((v) => v.id !== primaryVehicleId) } -const Location = ({ vehicle }: { vehicle: Vehicle }) => { +const Location = ({ + vehicle, + openMapEnabled, +}: { + vehicle: Vehicle + openMapEnabled: boolean +}) => { const routeVehicles: VehicleInScheduledService[] = useRouteVehicles( vehicle.routeId, vehicle.id @@ -113,6 +120,7 @@ const Location = ({ vehicle }: { vehicle: Vehicle }) => { vehicle={vehicle} routeVehicles={routeVehicles} shapes={shapes} + openMapEnabled={openMapEnabled} /> @@ -163,7 +171,13 @@ const inDebugMode = (): boolean => const shouldShowDataDiscrepancies = ({ dataDiscrepancies }: Vehicle): boolean => inDebugMode() && dataDiscrepancies.length > 0 -const StatusContent = ({ selectedVehicle }: { selectedVehicle: Vehicle }) => ( +const StatusContent = ({ + selectedVehicle, + openMapEnabled, +}: { + selectedVehicle: Vehicle + openMapEnabled: boolean +}) => ( <>
{selectedVehicle.isOffCourse && } @@ -177,7 +191,7 @@ const StatusContent = ({ selectedVehicle }: { selectedVehicle: Vehicle }) => ( - + {shouldShowDataDiscrepancies(selectedVehicle) && ( @@ -190,6 +204,7 @@ const VehiclePropertiesPanel = ({ tabMode, onChangeTabMode, onClosePanel, + openMapEnabled, }: Props) => { return (
@@ -210,11 +225,19 @@ const VehiclePropertiesPanel = ({ {isVehicleInScheduledService(selectedVehicle) ? ( } + statusContent={ + + } mode={tabMode} /> ) : ( - + )}
) diff --git a/assets/tests/components/propertiesPanel.test.tsx b/assets/tests/components/propertiesPanel.test.tsx index 85526f77c..e60d31509 100644 --- a/assets/tests/components/propertiesPanel.test.tsx +++ b/assets/tests/components/propertiesPanel.test.tsx @@ -142,6 +142,7 @@ const PropertiesPanelWrapper: React.FC<{ selectedVehicleOrGhost={vehicleOrGhost} onClosePanel={closePanel || jest.fn()} initialTab={initialTab} + openMapEnabled={true} /> ) diff --git a/assets/tests/components/propertiesPanel/miniMap.test.tsx b/assets/tests/components/propertiesPanel/miniMap.test.tsx index f512131af..7a2a861f1 100644 --- a/assets/tests/components/propertiesPanel/miniMap.test.tsx +++ b/assets/tests/components/propertiesPanel/miniMap.test.tsx @@ -70,7 +70,12 @@ describe("MiniMap", () => { render( - + ) @@ -88,10 +93,35 @@ describe("MiniMap", () => { ) }) + test("Map does not include link to open vehicle in search map page when disabled by prop", async () => { + const mockDispatch = jest.fn() + + render( + + + + + + ) + expect( + screen.queryByRole("link", { name: "Open Map" }) + ).not.toBeInTheDocument() + }) + test("Map doesn't include fullscreen button", () => { render( - + ) expect( @@ -107,7 +137,12 @@ describe("MiniMap", () => { test("Map does not include link to open vehicle in search map page", () => { render( - + ) expect( @@ -118,7 +153,12 @@ describe("MiniMap", () => { test("Map does include fullscreen button", () => { render( - + ) expect( @@ -129,7 +169,12 @@ describe("MiniMap", () => { test("Doesn't have layers control", () => { render( - + ) expect(layersControlButton.query()).toBeNull() diff --git a/assets/tests/components/propertiesPanel/vehiclePropertiesPanel.test.tsx b/assets/tests/components/propertiesPanel/vehiclePropertiesPanel.test.tsx index bf883a353..5c6514834 100644 --- a/assets/tests/components/propertiesPanel/vehiclePropertiesPanel.test.tsx +++ b/assets/tests/components/propertiesPanel/vehiclePropertiesPanel.test.tsx @@ -134,6 +134,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) .toJSON() @@ -154,6 +155,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) @@ -174,6 +176,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) .toJSON() @@ -188,6 +191,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) expect(screen.getByRole("heading", { name: "Invalid Bus" })).toBeVisible() @@ -205,6 +209,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) .toJSON() @@ -225,6 +230,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) .toJSON() @@ -247,6 +253,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) .toJSON() @@ -274,6 +281,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) .toJSON() @@ -291,6 +299,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) expect(result.getByText("Atlantic Ave & Summer St")).toBeInTheDocument() @@ -307,6 +316,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) @@ -324,6 +334,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) @@ -344,6 +355,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) @@ -372,6 +384,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) expect(useVehiclesForRoute).toHaveBeenCalled() @@ -401,6 +414,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) @@ -416,6 +430,7 @@ describe("VehiclePropertiesPanel", () => { tabMode="status" onChangeTabMode={jest.fn()} onClosePanel={mockClosePanel} + openMapEnabled={true} /> ) @@ -443,6 +458,7 @@ describe("VehiclePropertiesPanel", () => { tabMode={initialTab || "status"} onChangeTabMode={mockSetTabMode} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) @@ -471,6 +487,7 @@ describe("VehiclePropertiesPanel", () => { tabMode={initialTab || "status"} onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> ) @@ -502,6 +519,7 @@ describe("VehiclePropertiesPanel", () => { tabMode={initialTab} onChangeTabMode={jest.fn()} onClosePanel={jest.fn()} + openMapEnabled={true} /> )