From aeb0205e1063211cd7164b7644389d53dfc8dfa0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?H=C3=A5kon=20Flatval?=
 <70905152+haakonflatval-cognite@users.noreply.github.com>
Date: Wed, 2 Aug 2023 11:08:21 +0200
Subject: [PATCH 1/2] fix: remove uniqueKey from ViewerAnchor API (#3541)

* fix: remove uniqueKey from ViewerAnchor API
---
 .../src/components/ViewerAnchor/ViewerAnchor.tsx          | 8 +-------
 react-components/stories/ViewerAnchor.stories.tsx         | 4 ++--
 2 files changed, 3 insertions(+), 9 deletions(-)

diff --git a/react-components/src/components/ViewerAnchor/ViewerAnchor.tsx b/react-components/src/components/ViewerAnchor/ViewerAnchor.tsx
index 7885b982663..d9f10f3167c 100644
--- a/react-components/src/components/ViewerAnchor/ViewerAnchor.tsx
+++ b/react-components/src/components/ViewerAnchor/ViewerAnchor.tsx
@@ -15,14 +15,9 @@ export type ViewerAnchorElementMapping = {
 export type ViewerAnchorProps = {
   position: Vector3;
   children: ReactElement;
-  uniqueKey: string;
 };
 
-export const ViewerAnchor = ({
-  position,
-  children,
-  uniqueKey
-}: ViewerAnchorProps): ReactElement => {
+export const ViewerAnchor = ({ position, children }: ViewerAnchorProps): ReactElement => {
   const viewer = useReveal();
   const [divTranslation, setDivTranslation] = useState(new Vector2());
   const [visible, setVisible] = useState(false);
@@ -50,7 +45,6 @@ export const ViewerAnchor = ({
 
   return visible ? (
     <div
-      key={uniqueKey}
       ref={htmlRef}
       style={{
         position: 'absolute',
diff --git a/react-components/stories/ViewerAnchor.stories.tsx b/react-components/stories/ViewerAnchor.stories.tsx
index 3004fa54aef..aff81002cb2 100644
--- a/react-components/stories/ViewerAnchor.stories.tsx
+++ b/react-components/stories/ViewerAnchor.stories.tsx
@@ -49,7 +49,7 @@ export const Main: Story = {
           styling={styling}
           fdmAssetMappingConfig={fdmAssetMappingConfig}
         />
-        <ViewerAnchor position={position} uniqueKey="key2">
+        <ViewerAnchor position={position}>
           <p
             style={{
               backgroundColor: 'turquoise',
@@ -62,7 +62,7 @@ export const Main: Story = {
             This label is stuck at position {position.toArray().join(',')}
           </p>
         </ViewerAnchor>
-        <ViewerAnchor position={position2} uniqueKey="key1">
+        <ViewerAnchor position={position2}>
           <p
             style={{
               backgroundColor: 'red',

From ca24505337c1dabdcc4c533be7437d825ff0a00e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?H=C3=A5kon=20Flatval?=
 <70905152+haakonflatval-cognite@users.noreply.github.com>
Date: Wed, 2 Aug 2023 11:26:21 +0200
Subject: [PATCH 2/2] fix: FDM query refinements (#3542)

* fix: propagate undefined results to click handler

* fix: expose intersection in click handler parameter

* fix: correct HighlightNode story

---------

Co-authored-by: Savelii Novikov <45129444+Savokr@users.noreply.github.com>
---
 .../Reveal3DResources/Reveal3DResources.tsx      |  8 ++++----
 .../Reveal3DResources/queryMappedData.ts         |  2 +-
 .../src/components/Reveal3DResources/types.ts    |  6 +++---
 .../stories/HighlightNode.stories.tsx            | 16 +++++++++-------
 4 files changed, 17 insertions(+), 15 deletions(-)

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<NodeType = any> = {
   resources: AddResourceOptions[];
   fdmAssetMappingConfig: FdmAssetMappingsConfig;
   styling?: Reveal3DResourcesStyling;
-  onNodeClick?: (node: NodeDataResult<NodeType>) => void;
+  onNodeClick?: (node: NodeDataResult<NodeType> | undefined) => void;
 };
 
 export const Reveal3DResources = <NodeType = any,>({
@@ -76,6 +76,7 @@ export const Reveal3DResources = <NodeType = any,>({
   useEffect(() => {
     const callback = (event: PointerEventData): void => {
       void (async (event: PointerEventData): Promise<void> => {
+        if (onNodeClick === undefined) return;
         const data = await queryMappedData<NodeType>(
           viewer,
           client,
@@ -83,9 +84,8 @@ export const Reveal3DResources = <NodeType = any,>({
           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<NodeType>(
     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<NodeType> = {
   data: FdmNode<NodeType>;
   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<any>();
+  const [nodeData, setNodeData] = useState<any>(undefined);
 
-  const [highlightedId, setHighlightedId] = useState<string>('');
+  const [highlightedId, setHighlightedId] = useState<string | undefined>(undefined);
 
-  const callback = (nodeData: NodeDataResult<any>): void => {
-    setNodeData(nodeData.data);
+  const callback = (nodeData: NodeDataResult<any> | 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
               : [
                   {