refactor(react-components): move caching into separate class in archi…

…tecture (#4910)

* refactor(react-components): move caching into domain object

* chore: preliminary lint fix

* chore: lint fix some more

* chore: remove unwanted changes

* chore: make direct reference from render targe to caches

* fix: tests

* chore: rename function/file

react-components/src/architecture/base/renderTarget/CdfCaches.ts

@@ -0,0 +1,47 @@
+/*!
+ * Copyright 2024 Cognite AS
+ */
+import { type CogniteClient } from '@cognite/sdk/dist/src';
+import { AssetMappingAndNode3DCache } from '../../../components/CacheProvider/AssetMappingAndNode3DCache';
+import { FdmNodeCache } from '../../../components/CacheProvider/FdmNodeCache';
+import { FdmSDK } from '../../../data-providers/FdmSDK';
+import { type Fdm3dDataProvider } from '../../../data-providers/Fdm3dDataProvider';
+import { PointCloudAnnotationCache } from '../../../components/CacheProvider/PointCloudAnnotationCache';
+import { Image360AnnotationCache } from '../../../components/CacheProvider/Image360AnnotationCache';
+import { type Cognite3DViewer, type DataSourceType } from '@cognite/reveal';
+
+export class CdfCaches {
+  private readonly _assetMappingAndNode3dCache: AssetMappingAndNode3DCache;
+  private readonly _fdmNodeCache: FdmNodeCache;
+  private readonly _pointCloudAnnotationCache: PointCloudAnnotationCache;
+  private readonly _image360AnnotationCache: Image360AnnotationCache;
+
+  constructor(
+    cdfClient: CogniteClient,
+    fdm3dDataProvider: Fdm3dDataProvider,
+    viewer: Cognite3DViewer<DataSourceType>
+  ) {
+    const fdmClient = new FdmSDK(cdfClient);
+
+    this._assetMappingAndNode3dCache = new AssetMappingAndNode3DCache(cdfClient);
+    this._fdmNodeCache = new FdmNodeCache(cdfClient, fdmClient, fdm3dDataProvider);
+    this._pointCloudAnnotationCache = new PointCloudAnnotationCache(cdfClient);
+    this._image360AnnotationCache = new Image360AnnotationCache(cdfClient, viewer);
+  }
+
+  public get assetMappingAndNode3dCache(): AssetMappingAndNode3DCache {
+    return this._assetMappingAndNode3dCache;
+  }
+
+  public get fdmNodeCache(): FdmNodeCache {
+    return this._fdmNodeCache;
+  }
+
+  public get pointCloudAnnotationCache(): PointCloudAnnotationCache {
+    return this._pointCloudAnnotationCache;
+  }
+
+  public get image360Cache(): Image360AnnotationCache {
+    return this._image360AnnotationCache;
+  }
+}

react-components/src/architecture/base/renderTarget/RevealRenderTarget.ts

@@ -38,6 +38,7 @@ import { Changes } from '../domainObjectsHelpers/Changes';
 import { type CogniteClient } from '@cognite/sdk';
 import { type BaseTool } from '../commands/BaseTool';
 import { ContextMenuController } from './ContextMenuController';
+import { type CdfCaches } from './CdfCaches';
 
 const DIRECTIONAL_LIGHT_NAME = 'DirectionalLight';
 
@@ -50,6 +51,7 @@ export class RevealRenderTarget {
   private readonly _commandsController: CommandsController;
   private readonly _rootDomainObject: RootDomainObject;
   private readonly _contextmenuController: ContextMenuController;
+  private readonly _cdfCaches: CdfCaches;
   private _ambientLight: AmbientLight | undefined;
   private _directionalLight: DirectionalLight | undefined;
   private _clippedBoundingBox: Box3 | undefined;
@@ -65,7 +67,7 @@ export class RevealRenderTarget {
   // CONSTRUCTOR
   // ==================================================
 
-  constructor(viewer: Cognite3DViewer<DataSourceType>, sdk: CogniteClient) {
+  constructor(viewer: Cognite3DViewer<DataSourceType>, sdk: CogniteClient, cdfCaches: CdfCaches) {
     this._viewer = viewer;
 
     const cameraManager = this.cameraManager;
@@ -75,6 +77,7 @@ export class RevealRenderTarget {
     this._commandsController = new CommandsController(this.domElement);
     this._commandsController.addEventListeners();
     this._contextmenuController = new ContextMenuController();
+    this._cdfCaches = cdfCaches;
     this._rootDomainObject = new RootDomainObject(this, sdk);
 
     this.initializeLights();
@@ -119,6 +122,10 @@ export class RevealRenderTarget {
     return this._contextmenuController;
   }
 
+  public get cdfCaches(): CdfCaches {
+    return this._cdfCaches;
+  }
+
   public get cursor(): string {
     return this.domElement.style.cursor;
   }

react-components/src/components/CacheProvider/AssetMappingAndNode3DCache.ts

@@ -20,7 +20,7 @@ import { chunk, maxBy } from 'lodash';
 import assert from 'assert';
 import { isValidAssetMapping } from './utils';
 import { modelRevisionNodesAssetToKey, createModelRevisionKey } from './idAndKeyTranslation';
-import { type ModelWithAssetMappings } from './AssetMappingAndNode3DCacheProvider';
+import { type ModelWithAssetMappings } from '../../hooks/cad/ModelWithAssetMappings';
 import { AssetMappingPerAssetIdCache } from './AssetMappingPerAssetIdCache';
 import { AssetMappingPerNodeIdCache } from './AssetMappingPerNodeIdCache';
 import { Node3DPerNodeIdCache } from './Node3DPerNodeIdCache';

react-components/src/components/CacheProvider/CacheProvider.ts

@@ -0,0 +1,30 @@
+/*!
+ * Copyright 2024 Cognite AS
+ */
+import { type CdfCaches } from '../../architecture/base/renderTarget/CdfCaches';
+import { useRenderTarget } from '../RevealCanvas';
+import { type AssetMappingAndNode3DCache } from './AssetMappingAndNode3DCache';
+import { type FdmNodeCache } from './FdmNodeCache';
+import { type PointCloudAnnotationCache } from './PointCloudAnnotationCache';
+import { type Image360AnnotationCache } from './Image360AnnotationCache';
+
+const useCacheObject = (): CdfCaches => {
+  const revealRenderTarget = useRenderTarget();
+  return revealRenderTarget.cdfCaches;
+};
+
+export const useFdmNodeCache = (): FdmNodeCache => {
+  return useCacheObject().fdmNodeCache;
+};
+
+export const useAssetMappingAndNode3DCache = (): AssetMappingAndNode3DCache => {
+  return useCacheObject().assetMappingAndNode3dCache;
+};
+
+export const usePointCloudAnnotationCache = (): PointCloudAnnotationCache => {
+  return useCacheObject().pointCloudAnnotationCache;
+};
+
+export const useImage360AnnotationCache = (): Image360AnnotationCache => {
+  return useCacheObject().image360Cache;
+};