diff --git a/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx b/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx index a98a1588deb..abaa0a21a5c 100644 --- a/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx +++ b/react-components/src/components/Reveal3DResources/Reveal3DResources.tsx @@ -43,7 +43,7 @@ export type Reveal3DResourcesProps = { resources: AddResourceOptions[]; fdmAssetMappingConfig: FdmAssetMappingsConfig; styling?: Reveal3DResourcesStyling; - onNodeClick?: (node: NodeDataResult) => void; + onNodeClick?: (node: NodeDataResult | undefined) => void; }; export const Reveal3DResources = ({ @@ -76,6 +76,7 @@ export const Reveal3DResources = ({ useEffect(() => { const callback = (event: PointerEventData): void => { void (async (event: PointerEventData): Promise => { + if (onNodeClick === undefined) return; const data = await queryMappedData( viewer, client, @@ -83,9 +84,8 @@ export const Reveal3DResources = ({ fdmAssetMappingConfig, event ); - if (onNodeClick !== undefined && data !== undefined) { - onNodeClick?.(data); - } + + onNodeClick(data); })(event); }; diff --git a/react-components/src/components/Reveal3DResources/queryMappedData.ts b/react-components/src/components/Reveal3DResources/queryMappedData.ts index 7deee733e36..c92f8ecd387 100644 --- a/react-components/src/components/Reveal3DResources/queryMappedData.ts +++ b/react-components/src/components/Reveal3DResources/queryMappedData.ts @@ -73,7 +73,7 @@ export async function queryMappedData( data: nodeData, view: dataView, cadNode: selectedNode, - model: cadIntersection.model + intersection: cadIntersection }; } diff --git a/react-components/src/components/Reveal3DResources/types.ts b/react-components/src/components/Reveal3DResources/types.ts index 821e635c621..63d4875a396 100644 --- a/react-components/src/components/Reveal3DResources/types.ts +++ b/react-components/src/components/Reveal3DResources/types.ts @@ -3,9 +3,9 @@ */ import { - type CogniteCadModel, type AddModelOptions, - type SupportedModelTypes + type SupportedModelTypes, + type CadIntersection } from '@cognite/reveal'; import { type Matrix4 } from 'three'; import { type FdmNode, type Source } from '../../utilities/FdmSDK'; @@ -26,5 +26,5 @@ export type NodeDataResult = { data: FdmNode; view: Source; cadNode: Node3D; - model: CogniteCadModel; + intersection: CadIntersection; }; diff --git a/react-components/stories/HighlightNode.stories.tsx b/react-components/stories/HighlightNode.stories.tsx index 83f62109de3..4b538d94a7a 100644 --- a/react-components/stories/HighlightNode.stories.tsx +++ b/react-components/stories/HighlightNode.stories.tsx @@ -66,15 +66,17 @@ const StoryContent = ({ resources: AddResourceOptions[]; fdmAssetMappingConfig: FdmAssetMappingsConfig; }): ReactElement => { - const [nodeData, setNodeData] = useState(); + const [nodeData, setNodeData] = useState(undefined); - const [highlightedId, setHighlightedId] = useState(''); + const [highlightedId, setHighlightedId] = useState(undefined); - const callback = (nodeData: NodeDataResult): void => { - setNodeData(nodeData.data); + const callback = (nodeData: NodeDataResult | undefined): void => { + setNodeData(nodeData?.data); + setHighlightedId(nodeData?.data?.externalId); - setHighlightedId(nodeData.data.externalId); - nodeData.model.assignStyledNodeCollection( + if (nodeData === undefined) return; + + nodeData.intersection.model.assignStyledNodeCollection( new TreeIndexNodeCollection([nodeData.cadNode.treeIndex]), DefaultNodeAppearance.Highlighted ); @@ -86,7 +88,7 @@ const StoryContent = ({ resources={resources} styling={{ groups: - highlightedId.length === 0 + highlightedId === undefined ? undefined : [ {