From 5762b1a61c6e7fd0283e552bce58e985c93ca364 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?H=C3=A5kon=20Flatval?= <hakon.flatval@cognite.com>
Date: Mon, 31 Jul 2023 16:11:49 +0200
Subject: [PATCH] chore: lint fix story

---
 .../stories/HighlightNode.stories.tsx         | 24 ++++++++++++-------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/react-components/stories/HighlightNode.stories.tsx b/react-components/stories/HighlightNode.stories.tsx
index c912ceeb560..ac702d6befa 100644
--- a/react-components/stories/HighlightNode.stories.tsx
+++ b/react-components/stories/HighlightNode.stories.tsx
@@ -5,15 +5,15 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import {
   CadModelContainer,
-  FdmAssetMappingsConfig,
+  type FdmAssetMappingsConfig,
   RevealContainer,
   RevealToolbar,
   useReveal
 } from '../src';
 import { CogniteClient } from '@cognite/sdk';
 import { Color, Matrix4 } from 'three';
-import { useEffect, useState } from 'react';
-import { PointerEventData } from '@cognite/reveal';
+import { type ReactElement, useEffect, useState } from 'react';
+import { type PointerEventData } from '@cognite/reveal';
 import { queryMappedData } from '../src/components/Reveal3DResources/queryMappedData';
 import { useFdmSdk, useSDK } from '../src/components/RevealContainer/SDKProvider';
 
@@ -62,7 +62,7 @@ export const Main: Story = {
   )
 };
 
-const Querier = ({ fdmConfig }: { fdmConfig: FdmAssetMappingsConfig }) => {
+const Querier = ({ fdmConfig }: { fdmConfig: FdmAssetMappingsConfig }): ReactElement => {
   const viewer = useReveal();
   const sdk = useSDK();
   const fdmClient = useFdmSdk();
@@ -70,14 +70,20 @@ const Querier = ({ fdmConfig }: { fdmConfig: FdmAssetMappingsConfig }) => {
   const [nodeData, setNodeData] = useState<any>(undefined);
 
   useEffect(() => {
-    const callback = async (e: PointerEventData) => {
-      const nodeData = await queryMappedData(viewer, sdk, fdmClient, fdmConfig, e);
-      setNodeData(nodeData);
+    const queryAndSetData = (e: PointerEventData): void => {
+      void (async (e: PointerEventData): Promise<void> => {
+        const nodeData = await queryMappedData(viewer, sdk, fdmClient, fdmConfig, e);
+        setNodeData(nodeData);
+      })(e);
     };
 
-    viewer.on('click', callback);
+    viewer.on('click', (e: PointerEventData) => {
+      queryAndSetData(e);
+    });
 
-    return () => viewer.off('click', callback);
+    return (): void => {
+      viewer.off('click', queryAndSetData);
+    };
   });
 
   return <>Clicked node content: {JSON.stringify(nodeData)}</>;