diff --git a/src/MainView.tsx b/src/MainView.tsx index 4e38e632e..be7de0353 100644 --- a/src/MainView.tsx +++ b/src/MainView.tsx @@ -607,6 +607,7 @@ class MainView extends React.Component { feature={this.props.lightweightFeature || this.props.feature} featureId={featureId} mappingEvents={this.props.mappingEvents} + mappingEvent={this.props.mappingEvent} equipmentInfo={this.props.equipmentInfo} equipmentInfoId={equipmentInfoId} categories={this.props.categories} diff --git a/src/components/Map/Map.tsx b/src/components/Map/Map.tsx index eb670acb8..7d22c6ee4 100644 --- a/src/components/Map/Map.tsx +++ b/src/components/Map/Map.tsx @@ -9,7 +9,7 @@ import includes from 'lodash/includes'; import isEqual from 'lodash/isEqual'; import * as React from 'react'; import { t } from 'ttag'; -import { hrefForFeature } from '../../lib/Feature'; +import { hrefForFeature, MappingEventFeature } from '../../lib/Feature'; import { currentLocales } from '../../lib/i18n'; import HighlightableMarker from './HighlightableMarker'; import LeafletLocateControl from './L.Control.Locate'; @@ -29,7 +29,7 @@ import { } from '../../lib/Feature'; import { globalFetchManager } from '../../lib/FetchManager'; import goToLocationSettings from '../../lib/goToLocationSettings'; -import { MappingEvents } from '../../lib/MappingEvent'; +import { MappingEvent, MappingEvents } from '../../lib/MappingEvent'; import { normalizeCoordinate, normalizeCoordinates } from '../../lib/normalizeCoordinates'; import { hasOpenedLocationHelp, saveState } from '../../lib/savedState'; import shouldUseImperialUnits from '../../lib/shouldUseImperialUnits'; @@ -85,6 +85,7 @@ type Props = { featureId?: string | number | null; feature?: PotentialPromise; mappingEvents?: MappingEvents; + mappingEvent?: MappingEvent; equipmentInfoId?: string | null; equipmentInfo?: PotentialPromise | null; @@ -132,8 +133,8 @@ type Props = { type State = { showZoomInfo?: boolean; showLocationNotAllowedHint: boolean; - placeOrEquipment?: Feature | EquipmentInfo | null; - placeOrEquipmentPromise?: Promise | null; + placeOrEquipment?: Feature | EquipmentInfo | MappingEventFeature | null; + placeOrEquipmentPromise?: Promise | null; zoomedToFeatureId: string | null; category: RootCategoryEntry | null; }; @@ -251,9 +252,9 @@ export default class Map extends React.Component { } static getDerivedStateFromProps(props: Props, state: State): Partial { - const { feature, equipmentInfo } = props; + const { feature, equipmentInfo, mappingEvent } = props; - const placeOrEquipment = equipmentInfo || feature; + const placeOrEquipment = equipmentInfo || feature || mappingEvent?.meetingPoint; const category = props.categoryId ? Categories.getRootCategory(props.categoryId) : null; @@ -480,8 +481,8 @@ export default class Map extends React.Component { } handlePromiseResolved( - placeOrEquipmentPromise: Promise, - placeOrEquipment: Feature | EquipmentInfo | null + placeOrEquipmentPromise: Promise, + placeOrEquipment: Feature | EquipmentInfo | MappingEventFeature | null ) { if (this.state.placeOrEquipmentPromise !== placeOrEquipmentPromise) { return; diff --git a/src/components/MappingEvents/MappingEventToolbar.tsx b/src/components/MappingEvents/MappingEventToolbar.tsx index dd3cf3982..84727dc2a 100644 --- a/src/components/MappingEvents/MappingEventToolbar.tsx +++ b/src/components/MappingEvents/MappingEventToolbar.tsx @@ -104,8 +104,8 @@ const MappingEventToolbar = ({ const hasMeetingPoint = Boolean(mappingEvent.meetingPoint); - const areaName = mappingEvent.area ? mappingEvent.area.properties.name : null; - const meetingPointName = mappingEvent.meetingPoint && mappingEvent.meetingPoint.properties.name; + const areaName = mappingEvent.area?.properties?.name; + const meetingPointName = mappingEvent.meetingPoint?.properties?.name; // translator: Screenreader description for a mapping event const toolbarAriaLabel = t`Mapping event ${mappingEvent.name}`; diff --git a/src/components/MappingEvents/MappingEventsToolbar.tsx b/src/components/MappingEvents/MappingEventsToolbar.tsx index 103f89eec..dddbae7cf 100644 --- a/src/components/MappingEvents/MappingEventsToolbar.tsx +++ b/src/components/MappingEvents/MappingEventsToolbar.tsx @@ -1,16 +1,15 @@ -import React from 'react'; -import { t } from 'ttag'; -import styled from 'styled-components'; import FocusTrap from 'focus-trap-react'; +import styled from 'styled-components'; +import { t } from 'ttag'; -import StyledToolbar from '../NodeToolbar/StyledToolbar'; -import Link, { RouteConsumer } from '../Link/Link'; -import { MappingEvents } from '../../lib/MappingEvent'; import { App } from '../../lib/App'; -import StyledMarkdown from '../StyledMarkdown'; -import { mappingEvent as MappingEventMarkerIcon } from '../icons/markers'; +import { MappingEvents } from '../../lib/MappingEvent'; import colors from '../../lib/colors'; import CloseButton from '../CloseButton'; +import Link, { RouteConsumer } from '../Link/Link'; +import StyledToolbar from '../NodeToolbar/StyledToolbar'; +import StyledMarkdown from '../StyledMarkdown'; +import { mappingEvent as MappingEventMarkerIcon } from '../icons/markers'; type MappingEventsToolbarProps = { app: App, @@ -87,7 +86,7 @@ const MappingEventsToolbar = ({

{event.name}

- {event.area &&

{event.area.properties.name}

} + {event.area?.properties?.name &&

{event.area?.properties?.name}

}
); diff --git a/src/lib/Feature.ts b/src/lib/Feature.ts index 2c419187f..b12c3d32e 100644 --- a/src/lib/Feature.ts +++ b/src/lib/Feature.ts @@ -240,6 +240,7 @@ export function getFeatureId(feature: Feature | EquipmentInfo | any): string | n typeof feature._id === 'string' && feature._id, properties && typeof properties.id === 'number' && properties.id, properties && typeof properties._id === 'string' && properties._id, + properties && typeof properties.osm_id === 'number' && properties.osm_id, ]; const result = idProperties.filter(Boolean)[0]; return result ? String(result) : null;