diff --git a/src/components/ConfirmedRoute.tsx b/src/components/ConfirmedRoute.tsx index 351129a5ee3e..d9cbbc8f248f 100644 --- a/src/components/ConfirmedRoute.tsx +++ b/src/components/ConfirmedRoute.tsx @@ -26,9 +26,12 @@ type ConfirmedRoutePropsOnyxProps = { type ConfirmedRouteProps = ConfirmedRoutePropsOnyxProps & { /** Transaction that stores the distance expense data */ transaction: OnyxEntry; + + /** Whether the map is interactable or not */ + interactive?: boolean; }; -function ConfirmedRoute({mapboxAccessToken, transaction}: ConfirmedRouteProps) { +function ConfirmedRoute({mapboxAccessToken, transaction, interactive}: ConfirmedRouteProps) { const {isOffline} = useNetwork(); const {route0: route} = transaction?.routes ?? {}; const waypoints = transaction?.comment?.waypoints ?? {}; @@ -89,6 +92,7 @@ function ConfirmedRoute({mapboxAccessToken, transaction}: ConfirmedRouteProps) { return !isOffline && Boolean(mapboxAccessToken?.token) ? ( ( - ({accessToken, style, mapPadding, userLocation: cachedUserLocation, styleURL, pitchEnabled, initialState, waypoints, directionCoordinates, onMapReady}, ref) => { + ({accessToken, style, mapPadding, userLocation: cachedUserLocation, styleURL, pitchEnabled, initialState, waypoints, directionCoordinates, onMapReady, interactive = true}, ref) => { const navigation = useNavigation(); const {isOffline} = useNetwork(); const {translate} = useLocalize(); @@ -145,7 +145,7 @@ const MapView = forwardRef( }; return !isOffline && Boolean(accessToken) && Boolean(currentPosition) ? ( - + ( userLocation: cachedUserLocation, directionCoordinates, initialState = {location: CONST.MAPBOX.DEFAULT_COORDINATE, zoom: CONST.MAPBOX.DEFAULT_ZOOM}, + interactive = true, }, ref, ) => { @@ -195,6 +196,7 @@ const MapView = forwardRef( }} style={StyleUtils.getTextColorStyle(theme.mapAttributionText)} mapStyle={styleURL} + interactive={interactive} > {waypoints?.map(({coordinate, markerComponent, id}) => { const MarkerComponent = markerComponent; diff --git a/src/components/MapView/MapViewTypes.ts b/src/components/MapView/MapViewTypes.ts index 3fa52c54339b..40934308b0e1 100644 --- a/src/components/MapView/MapViewTypes.ts +++ b/src/components/MapView/MapViewTypes.ts @@ -20,6 +20,8 @@ type MapViewProps = { directionCoordinates?: Array<[number, number]>; // Callback to call when the map is idle / ready. onMapReady?: () => void; + // Whether the map is interactable or not + interactive?: boolean; }; type DirectionProps = { diff --git a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx index 7f70a3e538a9..5259b66492cd 100644 --- a/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx +++ b/src/components/ReportActionItem/MoneyRequestPreview/MoneyRequestPreviewContent.tsx @@ -230,7 +230,10 @@ function MoneyRequestPreviewContent({ > {showMapAsImage && ( - + )} {!showMapAsImage && hasReceipt && ( diff --git a/src/components/ReportActionItem/MoneyRequestView.tsx b/src/components/ReportActionItem/MoneyRequestView.tsx index 08bcc16cbbee..74cf0ed9ad88 100644 --- a/src/components/ReportActionItem/MoneyRequestView.tsx +++ b/src/components/ReportActionItem/MoneyRequestView.tsx @@ -338,7 +338,10 @@ function MoneyRequestView({ > {showMapAsImage ? ( - + ) : (