diff --git a/react/src/components/AssetDetail/AssetGeometry.tsx b/react/src/components/AssetDetail/AssetGeometry.tsx index 4683a006..cf9701c2 100644 --- a/react/src/components/AssetDetail/AssetGeometry.tsx +++ b/react/src/components/AssetDetail/AssetGeometry.tsx @@ -1,13 +1,13 @@ import React from 'react'; import _ from 'lodash'; import * as turf from '@turf/turf'; -import { Feature } from '@hazmapper/types'; +import { Feature, FeatureType, getFeatureType } from '@hazmapper/types'; -interface GeometryAssetProps { +interface AssetGeometryProps { selectedFeature: Feature; } -const GeometryAsset: React.FC = ({ selectedFeature }) => { +const AssetGeometry: React.FC = ({ selectedFeature }) => { if (!selectedFeature?.geometry) return null; const bbox = @@ -15,9 +15,11 @@ const GeometryAsset: React.FC = ({ selectedFeature }) => { ? turf.bbox(selectedFeature) : null; + const geometryType: FeatureType = getFeatureType(selectedFeature); + return ( <> - {selectedFeature.geometry.type === 'Point' && ( + {geometryType === FeatureType.Point && ( @@ -29,17 +31,17 @@ const GeometryAsset: React.FC = ({ selectedFeature }) => { - + - +
Latitude{selectedFeature.geometry.coordinates[0]}{turf.bbox(selectedFeature.geometry)[0]}
Longitude{selectedFeature.geometry.coordinates[1]}{turf.bbox(selectedFeature.geometry)[1]}
)} - {(selectedFeature.geometry.type === 'Polygon' || - selectedFeature.geometry.type === 'MultiPolygon') && ( + {(geometryType === FeatureType.Polygon || + geometryType === FeatureType.MultiPolygon) && ( @@ -56,8 +58,8 @@ const GeometryAsset: React.FC = ({ selectedFeature }) => {
)} - {(selectedFeature.geometry.type === 'LineString' || - selectedFeature.geometry.type === 'MultiLineString') && ( + {(geometryType === FeatureType.LineString || + geometryType === FeatureType.MultiLineString) && ( @@ -74,7 +76,7 @@ const GeometryAsset: React.FC = ({ selectedFeature }) => {
)} - {selectedFeature.geometry.type !== 'Point' && bbox && ( + {geometryType !== FeatureType.Point && bbox && ( {selectedFeature.geometry.type === 'GeometryCollection' && ( @@ -113,4 +115,4 @@ const GeometryAsset: React.FC = ({ selectedFeature }) => { ); }; -export default GeometryAsset; +export default AssetGeometry;