fix(react-components): list 360-core-dm-connected assets (#4967)

* fix(react-components): list 360-core-dm-connected assets

Does not include Search-capabilities

* feat: enable search filtering for 360

* chore: lint fix in viewer

* chore: correct AnnotationAssetRef type

* chore: ignore lint error

I swear, I could not for the life of me make the linter accept this.

* chore: try to fix build error by upgrading target ES version in tsconfig

* Revert "chore: try to fix build error by upgrading target ES version in tsconfig"

This reverts commit 4b4818d.

* test(react-components): Add tests for listMappedFdmNodes

* chore: remove unnecessary results, improve typing

* chore: tests WIP

* chore: minor changes to filterNodesByMappedTo3d

* chore: rename annotations-folder and utilities

* chore: spurious cleanup, lint and add missing files

* chore: lint fix again

* chore: lint fix YET AGAIN (not sure why CI get more errors than me)

* test: a few tests for CoreDm3dDataProvider

* chore: move fixtures

* chore: lint fix

* chore: remove outdated file

* chore: remove a bunch of cyclic dependencies

* chore: LINT FIXSNTEOHUSNEOTHUSNTOEHUSNTH

* chore: don't initialize mock

* chore: import right function...

* Update react-components/src/data-providers/core-dm-provider/listMappedFdmNodes.test.ts

Co-authored-by: Fredrik Anfinsen <[email protected]>

* Update react-components/src/utilities/image360Annotations/getImage360AnnotationAssetRef.ts

Co-authored-by: Fredrik Anfinsen <[email protected]>

* chore: increase type safety

* chore: lint fix

* chore: avoid as unknown

* chore: rewrite image360 queries to make life easier for Typescript

* chore: add missing export

* chore: correct tests etc.

* chore: lint fix

* fix: persist unhoisted properties in return value from search

* fix: correct table name in FDM query

* chore: lint fix

* fix: fix typing in hoist function

---------

Co-authored-by: pramod-cog <[email protected]>
Co-authored-by: Fredrik Anfinsen <[email protected]>
Co-authored-by: Christopher J. Tannum <[email protected]>

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

@@ -35,7 +35,7 @@ export class CdfCaches {
     const fdmClient = new FdmSDK(cdfClient);
 
     const fdm3dDataProvider = coreDmOnly
-      ? new CoreDm3dFdm3dDataProvider([], fdmClient)
+      ? new CoreDm3dFdm3dDataProvider(fdmClient)
       : new LegacyFdm3dDataProvider(fdmClient, cdfClient);
 
     this._assetMappingAndNode3dCache = new AssetMappingAndNode3DCache(cdfClient);

react-components/src/architecture/concrete/pointsOfInterest/PointsOfInterestCommand.ts

@@ -5,7 +5,7 @@ import { RenderTargetCommand } from '../../base/commands/RenderTargetCommand';
 import { PointsOfInterestDomainObject } from './PointsOfInterestDomainObject';
 import { PointsOfInterestTool } from './PointsOfInterestTool';
 
-export abstract class PointsOfInterestCommand<PoiIdType> extends RenderTargetCommand {
+export class PointsOfInterestCommand<PoiIdType> extends RenderTargetCommand {
   protected getTool(): PointsOfInterestTool<PoiIdType> | undefined {
     return this.getActiveTool(PointsOfInterestTool);
   }

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

@@ -16,16 +16,13 @@ import {
   type InstanceReferenceKey
 } from '../../utilities/instanceIds/toKey';
 import { createFdmKey } from './idAndKeyTranslation';
-import { type DmsUniqueIdentifier } from '../../data-providers';
 
 export function getInstanceReferenceFromPointCloudAnnotation(
   annotation: AnnotationModel
 ): IdEither | undefined {
   const annotationData = annotation.data as AnnotationsBoundingVolume;
   const assetRef = annotationData.assetRef;
-  return assetRef !== undefined && isIdEither(annotationData.assetRef as IdEither)
-    ? (assetRef as IdEither)
-    : undefined;
+  return assetRef !== undefined && isIdEither(assetRef) ? assetRef : undefined;
 }
 
 export function getInstanceReferenceFromImage360Annotation(
@@ -62,16 +59,6 @@ export function getIdKeyForImage360Annotation(
   }
 }
 
-export function getIdForImage360Annotation(
-  annotation: DataSourceType['image360AnnotationType']
-): DmsUniqueIdentifier | number {
-  if (isCoreDmImage360Annotation(annotation)) {
-    return annotation.annotationIdentifier;
-  } else {
-    return annotation.id;
-  }
-}
-
 // TODO: Implement this in Reveal instead
 function isCoreDmImage360Annotation(
   annotation: DataSourceType['image360AnnotationType']

react-components/src/components/PointCloudContainer/PointCloudContainer.tsx

@@ -21,8 +21,8 @@ import { modelExists } from '../../utilities/modelExists';
 import { getViewerResourceCount } from '../../utilities/getViewerResourceCount';
 import { type PointCloudModelStyling } from './types';
 import { useModelIdRevisionIdFromModelOptions } from '../../hooks/useModelIdRevisionIdFromModelOptions';
+import { isClassicIdentifier, isDM3DModelIdentifier } from '../Reveal3DResources/typeGuards';
 import { isSameModel } from '../../utilities/isSameModel';
-import { isClassicIdentifier, isDMIdentifier } from '../Reveal3DResources/typeGuards';
 import { RevealModelsUtils } from '../../architecture/concrete/reveal/RevealModelsUtils';
 
 export type CognitePointCloudModelProps = {
@@ -141,7 +141,7 @@ function defaultLoadErrorHandler(addOptions: AddModelOptions<DataSourceType>, er
     console.warn(
       `Failed to load (${addOptions.modelId}, ${addOptions.revisionId}): ${JSON.stringify(error)}`
     );
-  } else if (isDMIdentifier(addOptions)) {
+  } else if (isDM3DModelIdentifier(addOptions)) {
     console.warn(
       `Failed to load (${addOptions.revisionExternalId}, ${addOptions.revisionSpace}): ${JSON.stringify(error)}`
     );

react-components/src/components/Reveal3DResources/Reveal3DResources.context.tsx

@@ -18,7 +18,7 @@ import { useCallCallbackOnFinishedLoading } from './hooks/useCallCallbackOnFinis
 import { useSetExpectedLoadCount } from './hooks/useSetExpectedLoadCount';
 import { useCalculateImage360Styling } from './hooks/useCalculateImage360Styling';
 import { CadModelContainer } from '../CadModelContainer';
-import { PointCloudContainer } from '../PointCloudContainer';
+import { PointCloudContainer } from '../PointCloudContainer/PointCloudContainer';
 import { Image360CollectionContainer } from '../Image360CollectionContainer';
 
 export type Reveal3DResourcesDependencies = {

react-components/src/components/Reveal3DResources/hooks/useCalculatePointCloudStyling.tsx

@@ -26,7 +26,7 @@ import { EMPTY_ARRAY } from '../../../utilities/constants';
 import { type PointCloudVolumeStylingGroup } from '../../PointCloudContainer/types';
 import { useModelIdRevisionIdFromModelOptions } from '../../../hooks/useModelIdRevisionIdFromModelOptions';
 import { isDefined } from '../../../utilities/isDefined';
-import { use3dModels } from '../../../hooks';
+import { use3dModels } from '../../../hooks/use3dModels';
 import {
   isClassicAssetMappingStylingGroup,
   isFdmAssetStylingGroup

react-components/src/components/Reveal3DResources/hooks/useMatchedPointCloudModels.ts

@@ -12,7 +12,7 @@ import {
 } from '@cognite/reveal';
 import { useMemo } from 'react';
 import { EMPTY_ARRAY } from '../../../utilities/constants';
-import { isDMIdentifier } from '../typeGuards';
+import { isDM3DModelIdentifier } from '../typeGuards';
 
 type MatchedPointCloudModel = {
   viewerModel: CognitePointCloudModel<DataSourceType>;
@@ -30,7 +30,7 @@ export function useMatchedPointCloudModels(
       }
       const model = viewerModel;
       const matchedModel = classicModelOptions.find((modelOption) => {
-        if (isDMPointCloudModel(model) && isDMIdentifier(modelOption)) {
+        if (isDMPointCloudModel(model) && isDM3DModelIdentifier(modelOption)) {
           return (
             model.modelIdentifier.revisionExternalId === modelOption.revisionExternalId &&
             model.modelIdentifier.revisionSpace === modelOption.revisionSpace

react-components/src/components/Reveal3DResources/index.ts

@@ -29,3 +29,4 @@ export {
   useReveal3DResourcesExpectedInViewerCount,
   useReveal3DLoadedResourceCount
 } from './Reveal3DResourcesInfoContext';
+export { isClassicIdentifier, isDM3DModelIdentifier } from './typeGuards';

react-components/src/components/Reveal3DResources/typeGuards.ts

@@ -1,17 +1,13 @@
 /*!
  * Copyright 2024 Cognite AS
  */
-import {
-  type DMDataSourceType,
-  type ClassicDataSourceType,
-  type AddModelOptions
-} from '@cognite/reveal';
+import { type DMDataSourceType, type AddModelOptions } from '@cognite/reveal';
 import {
   type AddImage360CollectionEventsOptions,
   type AddImage360CollectionDatamodelsOptions,
   type AddImage360CollectionOptions,
   type AddResourceOptions,
-  type AddPointCloudResourceOptions
+  type ClassicAdd3DModelOptions
 } from './types';
 
 export function is360ImageAddOptions(
@@ -24,7 +20,11 @@ export function is360ImageDataModelAddOptions(
   addOptions: AddResourceOptions
 ): addOptions is AddImage360CollectionDatamodelsOptions {
   const castOptions = addOptions as AddImage360CollectionDatamodelsOptions;
-  return castOptions.externalId !== undefined && castOptions.space !== undefined;
+  return (
+    castOptions.externalId !== undefined &&
+    castOptions.space !== undefined &&
+    (castOptions.source === 'cdm' || castOptions.source === 'dm')
+  );
 }
 
 export function is360ImageEventsAddOptions(
@@ -36,8 +36,8 @@ export function is360ImageEventsAddOptions(
 
 export function isClassicIdentifier(
   addOptions: AddResourceOptions
-): addOptions is AddPointCloudResourceOptions & AddModelOptions<ClassicDataSourceType> {
-  const castOptions = addOptions as AddModelOptions<ClassicDataSourceType>;
+): addOptions is ClassicAdd3DModelOptions {
+  const castOptions = addOptions as ClassicAdd3DModelOptions;
   return (
     castOptions.modelId !== undefined &&
     castOptions.revisionId !== undefined &&
@@ -46,9 +46,9 @@ export function isClassicIdentifier(
   );
 }
 
-export function isDMIdentifier(
+export function isDM3DModelIdentifier(
   addOptions: AddResourceOptions
-): addOptions is AddPointCloudResourceOptions & AddModelOptions<DMDataSourceType> {
+): addOptions is AddModelOptions<DMDataSourceType> {
   const castOptions = addOptions as AddModelOptions<DMDataSourceType>;
   return castOptions.revisionExternalId !== undefined && castOptions.revisionSpace !== undefined;
 }

react-components/src/components/Reveal3DResources/types.ts

@@ -75,10 +75,11 @@ export type AddResourceOptions =
   | AddPointCloudResourceOptions
   | AddImage360CollectionOptions;
 
-export type AddPointCloudResourceOptions = AddModelOptions<DataSourceType> & {
-  transform?: Matrix4;
-  styling?: { default?: NodeAppearance; mapped?: NodeAppearance };
-};
+export type AddPointCloudResourceOptions<T extends DataSourceType = DataSourceType> =
+  AddModelOptions<T> & {
+    transform?: Matrix4;
+    styling?: { default?: NodeAppearance; mapped?: NodeAppearance };
+  };
 
 export type AddCadResourceOptions = AddModelOptions<ClassicDataSourceType> & {
   transform?: Matrix4;
@@ -89,6 +90,10 @@ export type AddCadResourceOptions = AddModelOptions<ClassicDataSourceType> & {
   };
 };
 
+export type ClassicAdd3DModelOptions =
+  | AddCadResourceOptions
+  | AddPointCloudResourceOptions<ClassicDataSourceType>;
+
 export type TypedReveal3DModel = CadModelOptions | PointCloudModelOptions;
 
 export type CadModelOptions = { type: 'cad' } & AddCadResourceOptions;

react-components/src/components/i18n/Translator.tsx

@@ -4,8 +4,8 @@
 
 import { type Translations } from './types';
 import { getLanguage } from './utils';
-import { type TranslationInput } from '../../architecture';
 import {
+  type TranslationInput,
   isTranslatedString,
   type TranslationKey
 } from '../../architecture/base/utilities/TranslateInput';

react-components/src/data-providers/Fdm3dDataProvider.ts

@@ -11,7 +11,10 @@ import {
 import { type DataSourceType, type AddModelOptions } from '@cognite/reveal';
 import { type InstancesWithView } from '../query/useSearchMappedEquipmentFDM';
 import { type FdmCadConnection } from '../components/CacheProvider/types';
-import { type TaggedAddResourceOptions } from '../components/Reveal3DResources/types';
+import {
+  type AddImage360CollectionDatamodelsOptions,
+  type TaggedAddResourceOptions
+} from '../components/Reveal3DResources/types';
 import { type Node3D } from '@cognite/sdk';
 
 export type Fdm3dDataProvider = {
@@ -28,21 +31,21 @@ export type Fdm3dDataProvider = {
   ) => Promise<FdmCadConnection[]>;
 
   listMappedFdmNodes: (
-    models: Array<AddModelOptions<DataSourceType>>,
+    models: Array<AddModelOptions<DataSourceType> | AddImage360CollectionDatamodelsOptions>,
     sourcesToSearch: Source[],
     instancesFilter: InstanceFilter | undefined,
     limit: number
   ) => Promise<NodeItem[]>;
 
   listAllMappedFdmNodes: (
-    models: Array<AddModelOptions<DataSourceType>>,
+    models: Array<AddModelOptions<DataSourceType> | AddImage360CollectionDatamodelsOptions>,
     sourcesToSearch: Source[],
     instanceFilter: InstanceFilter | undefined
   ) => Promise<NodeItem[]>;
 
   filterNodesByMappedTo3d: (
     nodes: InstancesWithView[],
-    models: Array<AddModelOptions<DataSourceType>>,
+    models: Array<AddModelOptions<DataSourceType> | AddImage360CollectionDatamodelsOptions>,
     spacesToSearch: string[]
   ) => Promise<InstancesWithView[]>;
 

react-components/src/data-providers/FdmSDK.ts

@@ -584,15 +584,29 @@ export class FdmSDK {
 
 function hoistInstanceProperties(
   source: Source,
-  instances: Array<EdgeItem<Record<string, any>> | NodeItem<Record<string, any>>>
+  instances: Array<EdgeItem<Record<string, unknown>> | NodeItem<Record<string, unknown>>>
 ): void {
   if (source === undefined) {
     return;
   }
   const propertyKey = `${source.externalId}/${source.version}`;
+
   instances.forEach((instance) => {
-    if (instance.properties[source.space][propertyKey] !== undefined) {
-      instance.properties = instance.properties[source.space][propertyKey];
+    const deepProperties = (instance.properties?.[source.space] as Record<string, unknown>)?.[
+      propertyKey
+    ] as Record<string, unknown>;
+
+    if (deepProperties !== undefined) {
+      Object.entries(deepProperties).reduce(
+        (
+          accumulatedProperties: Record<string, unknown>,
+          [propName, propValue]: [string, unknown]
+        ) => {
+          accumulatedProperties[propName] = propValue;
+          return accumulatedProperties;
+        },
+        instance.properties
+      );
     }
   });
 }

react-components/src/data-providers/core-dm-provider/CoreDm3dDataProvider.test.ts

@@ -0,0 +1,81 @@
+/*!
+ * Copyright 2025 Cognite AS
+ */
+import { describe, expect, it, beforeEach } from 'vitest';
+import { CoreDm3dFdm3dDataProvider } from './CoreDm3dDataProvider';
+import { Mock, It, type IMock } from 'moq.ts';
+import { type FdmSDK } from '../FdmSDK';
+import { restrictToDmsId } from '../../utilities/restrictToDmsId';
+import { type AddImage360CollectionDatamodelsOptions } from '../../components';
+import {
+  modelInstanceFixture0,
+  revisionInstanceFixture0
+} from '../../../tests/tests-utilities/fixtures/dm/model3dData';
+
+const image360CollectionId: AddImage360CollectionDatamodelsOptions = {
+  externalId: 'image360Collection0',
+  space: 'space0',
+  source: 'cdm'
+};
+
+const modelId0 = 1234;
+const revisionId0 = 5678;
+
+describe(CoreDm3dFdm3dDataProvider.name, () => {
+  let fdmSdkMock: IMock<FdmSDK>;
+
+  beforeEach(() => {
+    fdmSdkMock = createFdmSdkMock();
+  });
+
+  it('should fetch model ref for classic input model options', async () => {
+    const coreDmProvider = new CoreDm3dFdm3dDataProvider(fdmSdkMock.object());
+
+    const result = await coreDmProvider.getDMSModels(modelId0);
+
+    expect(result).toEqual([restrictToDmsId(modelInstanceFixture0)]);
+  });
+
+  it('should fetch revision ref for classic input model options', async () => {
+    const coreDmProvider = new CoreDm3dFdm3dDataProvider(fdmSdkMock.object());
+
+    const result = await coreDmProvider.getRevisionRefs([
+      { modelId: modelId0, revisionId: revisionId0 }
+    ]);
+
+    expect(result).toEqual([restrictToDmsId(revisionInstanceFixture0)]);
+  });
+
+  it('should return the input ID when input is CoreDM image360 options', async () => {
+    const coreDmProvider = new CoreDm3dFdm3dDataProvider(fdmSdkMock.object());
+
+    const result = await coreDmProvider.getRevisionRefs([image360CollectionId]);
+
+    expect(result).toEqual([restrictToDmsId(image360CollectionId)]);
+  });
+});
+
+function createFdmSdkMock(): IMock<FdmSDK> {
+  return new Mock<FdmSDK>()
+    .setup(
+      async (p) =>
+        await p.queryNodesAndEdges(
+          It.Is(
+            (query) =>
+              (query as any).with?.models?.nodes?.filter?.and?.[0]?.equals?.value ===
+              `cog_3d_model_${modelId0}`
+          )
+        )
+    )
+    .returns(Promise.resolve({ items: { models: [modelInstanceFixture0] } }))
+    .setup(
+      async (p) =>
+        await p.queryNodesAndEdges(
+          It.Is(
+            (query) =>
+              (query as any).parameters?.revisionExternalId === `cog_3d_revision_${revisionId0}`
+          )
+        )
+    )
+    .returns(Promise.resolve({ items: { revision: [revisionInstanceFixture0] } }));
+}