From ab43dc5c797c94c0e575ebad5c6fb411ab062b52 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5kon=20Flatval?= Date: Wed, 13 Sep 2023 09:59:33 +0200 Subject: [PATCH 1/4] feat: include node cache in keep-alive context --- .../components/NodeCacheProvider/NodeCacheProvider.tsx | 10 +++++++++- .../src/components/RevealKeepAlive/RevealKeepAlive.tsx | 5 ++++- .../RevealKeepAlive/RevealKeepAliveContext.ts | 2 ++ 3 files changed, 15 insertions(+), 2 deletions(-) diff --git a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx index bc973319a9d..6e628c191c1 100644 --- a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx +++ b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx @@ -13,6 +13,7 @@ import { type DmsUniqueIdentifier } from '../../utilities/FdmSDK'; import { type TypedReveal3DModel } from '../Reveal3DResources/types'; import { type ThreeDModelMappings } from '../../hooks/types'; import { DEFAULT_QUERY_STALE_TIME } from '../../utilities/constants'; +import { useRevealKeepAlive } from '../RevealKeepAlive/RevealKeepAliveContext'; export type FdmNodeCacheContent = { cache: FdmNodeCache; @@ -97,8 +98,15 @@ export const useFdmAssetMappings = ( export function NodeCacheProvider({ children }: { children?: ReactNode }): ReactElement { const fdmClient = useFdmSdk(); const cdfClient = useSDK(); + const revealKeepAliveData = useRevealKeepAlive(); - const fdmCache = useMemo(() => new FdmNodeCache(cdfClient, fdmClient), []); + const fdmCache = useMemo(() => { + const cache = revealKeepAliveData?.fdmNodeCache.current ?? new FdmNodeCache(cdfClient, fdmClient); + if (revealKeepAliveData !== undefined) { + revealKeepAliveData.fdmNodeCache.current = cache; + } + return cache; + }, []); return ( diff --git a/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx b/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx index 15bc32eae95..45c94176802 100644 --- a/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx +++ b/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx @@ -5,10 +5,13 @@ import { type Cognite3DViewer } from '@cognite/reveal'; import { type ReactNode, type ReactElement, useRef, useEffect } from 'react'; import { RevealKeepAliveContext } from './RevealKeepAliveContext'; +import { FdmNodeCache } from '../NodeCacheProvider/FdmNodeCache'; export function RevealKeepAlive({ children }: { children?: ReactNode }): ReactElement { const viewerRef = useRef(); const isRevealContainerMountedRef = useRef(false); + const fdmNodeCache = useRef(); + useEffect(() => { return () => { viewerRef.current?.dispose(); @@ -16,7 +19,7 @@ export function RevealKeepAlive({ children }: { children?: ReactNode }): ReactEl }; }, []); return ( - + {children} ); diff --git a/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts b/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts index edbabebd0f7..0bbd6647f35 100644 --- a/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts +++ b/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts @@ -3,10 +3,12 @@ */ import { type Cognite3DViewer } from '@cognite/reveal'; import { type MutableRefObject, createContext, useContext } from 'react'; +import { FdmNodeCache } from '../NodeCacheProvider/FdmNodeCache'; export type RevealKeepAliveData = { viewerRef: MutableRefObject; isRevealContainerMountedRef: MutableRefObject; + fdmNodeCache: MutableRefObject; }; export const RevealKeepAliveContext = createContext(undefined); From fe3ce1daa8ffc59ae922e1f425895f27198a6e0b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5kon=20Flatval?= Date: Wed, 13 Sep 2023 10:21:44 +0200 Subject: [PATCH 2/4] chore: lint fix --- .../src/components/NodeCacheProvider/NodeCacheProvider.tsx | 3 ++- .../src/components/RevealKeepAlive/RevealKeepAlive.tsx | 5 +++-- .../src/components/RevealKeepAlive/RevealKeepAliveContext.ts | 2 +- 3 files changed, 6 insertions(+), 4 deletions(-) diff --git a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx index 6e628c191c1..7fc3f38b5a9 100644 --- a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx +++ b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx @@ -101,7 +101,8 @@ export function NodeCacheProvider({ children }: { children?: ReactNode }): React const revealKeepAliveData = useRevealKeepAlive(); const fdmCache = useMemo(() => { - const cache = revealKeepAliveData?.fdmNodeCache.current ?? new FdmNodeCache(cdfClient, fdmClient); + const cache = + revealKeepAliveData?.fdmNodeCache.current ?? new FdmNodeCache(cdfClient, fdmClient); if (revealKeepAliveData !== undefined) { revealKeepAliveData.fdmNodeCache.current = cache; } diff --git a/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx b/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx index 45c94176802..73b284cb8fa 100644 --- a/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx +++ b/react-components/src/components/RevealKeepAlive/RevealKeepAlive.tsx @@ -5,7 +5,7 @@ import { type Cognite3DViewer } from '@cognite/reveal'; import { type ReactNode, type ReactElement, useRef, useEffect } from 'react'; import { RevealKeepAliveContext } from './RevealKeepAliveContext'; -import { FdmNodeCache } from '../NodeCacheProvider/FdmNodeCache'; +import { type FdmNodeCache } from '../NodeCacheProvider/FdmNodeCache'; export function RevealKeepAlive({ children }: { children?: ReactNode }): ReactElement { const viewerRef = useRef(); @@ -19,7 +19,8 @@ export function RevealKeepAlive({ children }: { children?: ReactNode }): ReactEl }; }, []); return ( - + {children} ); diff --git a/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts b/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts index 0bbd6647f35..bcd0b27e342 100644 --- a/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts +++ b/react-components/src/components/RevealKeepAlive/RevealKeepAliveContext.ts @@ -3,7 +3,7 @@ */ import { type Cognite3DViewer } from '@cognite/reveal'; import { type MutableRefObject, createContext, useContext } from 'react'; -import { FdmNodeCache } from '../NodeCacheProvider/FdmNodeCache'; +import { type FdmNodeCache } from '../NodeCacheProvider/FdmNodeCache'; export type RevealKeepAliveData = { viewerRef: MutableRefObject; From cf2be26ddcb155e113205c4f9da840d9e558b995 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5kon=20Flatval?= Date: Wed, 13 Sep 2023 11:24:56 +0200 Subject: [PATCH 3/4] fix: add useMemo dependencies and explaratory variable --- .../src/components/NodeCacheProvider/NodeCacheProvider.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx index 7fc3f38b5a9..24ab52b433d 100644 --- a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx +++ b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx @@ -103,11 +103,14 @@ export function NodeCacheProvider({ children }: { children?: ReactNode }): React const fdmCache = useMemo(() => { const cache = revealKeepAliveData?.fdmNodeCache.current ?? new FdmNodeCache(cdfClient, fdmClient); - if (revealKeepAliveData !== undefined) { + + const isInRevealKeepAliveContext = revealKeepAliveData !== undefined; + if (isInRevealKeepAliveContext) { revealKeepAliveData.fdmNodeCache.current = cache; } + return cache; - }, []); + }, [cdfClient, fdmClient]); return ( From 217faf6e9a61896f1ad0f412b82a477e1d37a03f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?H=C3=A5kon=20Flatval?= Date: Wed, 13 Sep 2023 11:32:47 +0200 Subject: [PATCH 4/4] chore: rename variable --- .../src/components/NodeCacheProvider/NodeCacheProvider.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx index 24ab52b433d..699f363486d 100644 --- a/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx +++ b/react-components/src/components/NodeCacheProvider/NodeCacheProvider.tsx @@ -104,8 +104,8 @@ export function NodeCacheProvider({ children }: { children?: ReactNode }): React const cache = revealKeepAliveData?.fdmNodeCache.current ?? new FdmNodeCache(cdfClient, fdmClient); - const isInRevealKeepAliveContext = revealKeepAliveData !== undefined; - if (isInRevealKeepAliveContext) { + const isRevealKeepAliveContextProvided = revealKeepAliveData !== undefined; + if (isRevealKeepAliveContextProvided) { revealKeepAliveData.fdmNodeCache.current = cache; }