Merge branch 'master' into pramodcog/update-translation-key-string-ju…

…ne-release

documentation/package.json

@@ -24,7 +24,7 @@
     "ws:replace": "replace"
   },
   "dependencies": {
-    "@azure/msal-browser": "3.14.0",
+    "@azure/msal-browser": "3.15.0",
     "@codemirror/lang-javascript": "6.2.2",
     "@docusaurus/core": "2.4.3",
     "@docusaurus/preset-classic": "2.4.3",

react-components/package.json

@@ -29,7 +29,7 @@
     "sort-keys": "cdf-i18n-utils-cli sort-local-keys --namespace reveal-react-components --path ./src/common/i18n"
   },
   "peerDependencies": {
-    "@cognite/cogs.js": ">=9",
+    "@cognite/cogs.js": ">=9.84.3",
     "@cognite/reveal": "4.14.5",
     "react": ">=18",
     "react-dom": ">=18",
@@ -43,7 +43,7 @@
   "devDependencies": {
     "@cognite/cdf-i18n-utils": "^0.7.5",
     "@cognite/cdf-utilities": "^3.6.0",
-    "@cognite/cogs.js": "^9.3.0",
+    "@cognite/cogs.js": "^9.84.3",
     "@cognite/reveal": "^4.14.5",
     "@cognite/sdk": "^9.13.0",
     "@playwright/test": "^1.43.1",
@@ -53,7 +53,7 @@
     "@storybook/blocks": "^8.0.9",
     "@storybook/react": "^8.0.9",
     "@storybook/react-vite": "^8.0.9",
-    "@storybook/test": "8.1.3",
+    "@storybook/test": "8.1.5",
     "@tanstack/react-query-devtools": "^5.32.0",
     "@testing-library/react": "^15.0.5",
     "@types/lodash": "^4.17.0",

react-components/src/architecture/base/commands/BaseCommand.ts

@@ -2,31 +2,43 @@
  * Copyright 2024 Cognite AS
  */
 
+import { type TranslateKey } from '../utilities/TranslateKey';
 import { clear, remove } from '../utilities/extensions/arrayExtensions';
 
 type UpdateDelegate = (command: BaseCommand) => void;
 
-export type Tooltip = {
-  key: string;
-  fallback?: string;
-};
-
 /**
  * Base class for all command and tools. Thses are object that can do a
  * user interaction with the system. It also have enough information to
  * generate the UI for the command.
  */
+
 export abstract class BaseCommand {
+  private static _counter: number = 0; // Counter for the unique index
+
   // ==================================================
   // INSTANCE FIELDS
   // ==================================================
 
   private readonly _listeners: UpdateDelegate[] = [];
 
+  // Unique index for the command, used by in React to force rerender
+  // when the command changes for a button.
+  public readonly _uniqueIndex: number;
+
+  public get uniqueIndex(): number {
+    return this._uniqueIndex;
+  }
+
   // ==================================================
   // VIRTUAL METHODS (To be override)
   // =================================================
 
+  constructor() {
+    BaseCommand._counter++;
+    this._uniqueIndex = BaseCommand._counter;
+  }
+
   public get name(): string {
     return this.tooltip.fallback ?? this.tooltip.key;
   }
@@ -35,7 +47,7 @@ export abstract class BaseCommand {
     return undefined;
   }
 
-  public get tooltip(): Tooltip {
+  public get tooltip(): TranslateKey {
     return { key: '' };
   }
 
@@ -51,11 +63,18 @@ export abstract class BaseCommand {
     return this.isEnabled;
   }
 
-  public get isCheckable(): boolean {
+  public get isChecked(): boolean {
     return false;
   }
 
-  public get isChecked(): boolean {
+  /**
+   * Gets a value indicating whether the command has data, for instance a reference
+   * to a specific domain object. Then the command cannot be reused or shared in the user interface.
+   * These command will not be added to the commandsController for updating, so update will
+   * not be done automatically. Typically used when the command is created for a specific domain object
+   * in the DomainObjectPanel.
+   */
+  public get hasData(): boolean {
     return false;
   }
 

react-components/src/architecture/base/commands/BaseTool.ts

@@ -30,10 +30,6 @@ export abstract class BaseTool extends RenderTargetCommand {
   // OVERRIDES
   // =================================================
 
-  public override get isCheckable(): boolean {
-    return true;
-  }
-
   public override get isChecked(): boolean {
     return this.renderTarget.commandsController.activeTool === this;
   }

react-components/src/architecture/base/commands/NavigationTool.ts

@@ -4,8 +4,8 @@
  */
 
 import { BaseTool } from './BaseTool';
-import { type Tooltip } from './BaseCommand';
 import { type IFlexibleCameraManager } from '@cognite/reveal';
+import { type TranslateKey } from '../utilities/TranslateKey';
 
 /**
  * Represents a tool navigation tool used for camera manipulation.
@@ -32,7 +32,7 @@ export class NavigationTool extends BaseTool {
     return 'Grab';
   }
 
-  public override get tooltip(): Tooltip {
+  public override get tooltip(): TranslateKey {
     return { key: 'NAVIGATION', fallback: 'Navigation' };
   }
 

react-components/src/architecture/base/concreteCommands/CopyToClipboardCommand.ts

@@ -0,0 +1,57 @@
+/*!
+ * Copyright 2024 Cognite AS
+ * BaseTool: Base class for the tool are used to interact with the render target.
+ */
+
+import { BaseCommand } from '../commands/BaseCommand';
+import { type TranslateKey } from '../utilities/TranslateKey';
+
+type GetStringDelegate = () => string;
+
+export class CopyToClipboardCommand extends BaseCommand {
+  private readonly _getString: GetStringDelegate;
+
+  // ==================================================
+  // CONSTRUCTOR
+  // ==================================================
+
+  public constructor(getString: GetStringDelegate) {
+    super();
+    this._getString = getString;
+  }
+
+  // ==================================================
+  // OVERRIDES
+  // ==================================================
+
+  public override get tooltip(): TranslateKey {
+    return { key: 'COPY_TO_CLIPBOARD', fallback: 'Copy to clipboard' };
+  }
+
+  public override get icon(): string {
+    return 'Copy';
+  }
+
+  public override get isEnabled(): boolean {
+    return this._getString !== undefined;
+  }
+
+  public override get hasData(): boolean {
+    return true;
+  }
+
+  protected override invokeCore(): boolean {
+    if (this._getString === undefined) {
+      return false;
+    }
+    navigator.clipboard
+      .writeText(this._getString())
+      .then((_result) => {
+        return true;
+      })
+      .catch((error) => {
+        console.error(error);
+      });
+    return true;
+  }
+}

react-components/src/architecture/base/concreteCommands/DeleteDomainObjectCommand.ts

@@ -0,0 +1,42 @@
+/*!
+ * Copyright 2024 Cognite AS
+ * BaseTool: Base class for the tool are used to interact with the render target.
+ */
+
+import { BaseCommand } from '../commands/BaseCommand';
+import { type TranslateKey } from '../utilities/TranslateKey';
+import { type DomainObject } from '../domainObjects/DomainObject';
+
+export class DeleteDomainObjectCommand extends BaseCommand {
+  private readonly _domainObject: DomainObject | undefined = undefined;
+  public constructor(domainObject: DomainObject) {
+    super();
+    this._domainObject = domainObject;
+  }
+  // ==================================================
+  // OVERRIDES
+  // ==================================================
+
+  public override get tooltip(): TranslateKey {
+    return { key: 'DELETE', fallback: 'Delete' };
+  }
+
+  public override get icon(): string {
+    return 'Delete';
+  }
+
+  public override get isEnabled(): boolean {
+    return this._domainObject !== undefined && this._domainObject.canBeRemoved;
+  }
+
+  public override get hasData(): boolean {
+    return true;
+  }
+
+  protected override invokeCore(): boolean {
+    if (this._domainObject === undefined) {
+      return false;
+    }
+    return this._domainObject.removeInteractive();
+  }
+}

react-components/src/architecture/base/concreteCommands/FitViewCommand.ts

@@ -3,14 +3,14 @@
  */
 
 import { RenderTargetCommand } from '../commands/RenderTargetCommand';
-import { type Tooltip } from '../commands/BaseCommand';
+import { type TranslateKey } from '../utilities/TranslateKey';
 
 export class FitViewCommand extends RenderTargetCommand {
   public override get icon(): string {
     return 'ExpandAlternative';
   }
 
-  public override get tooltip(): Tooltip {
+  public override get tooltip(): TranslateKey {
     return { key: 'FIT_VIEW_TOOLTIP', fallback: 'Fit view' };
   }
 

react-components/src/architecture/base/concreteCommands/SetFlexibleControlsTypeCommand.ts

@@ -5,7 +5,8 @@
 import { RenderTargetCommand } from '../commands/RenderTargetCommand';
 import { type RevealRenderTarget } from '../renderTarget/RevealRenderTarget';
 import { FlexibleControlsType } from '@cognite/reveal';
-import { type BaseCommand, type Tooltip } from '../commands/BaseCommand';
+import { type BaseCommand } from '../commands/BaseCommand';
+import { type TranslateKey } from '../utilities/TranslateKey';
 
 export class SetFlexibleControlsTypeCommand extends RenderTargetCommand {
   private readonly _controlsType: FlexibleControlsType;
@@ -49,7 +50,7 @@ export class SetFlexibleControlsTypeCommand extends RenderTargetCommand {
     }
   }
 
-  public override get tooltip(): Tooltip {
+  public override get tooltip(): TranslateKey {
     switch (this._controlsType) {
       case FlexibleControlsType.FirstPerson:
         return { key: 'CONTROLS_TYPE_FIRST_PERSON', fallback: 'Fly' };
@@ -62,10 +63,6 @@ export class SetFlexibleControlsTypeCommand extends RenderTargetCommand {
     }
   }
 
-  public override get isCheckable(): boolean {
-    return true;
-  }
-
   public override get isChecked(): boolean {
     const { renderTarget } = this;
     const { flexibleCameraManager } = renderTarget;

react-components/src/architecture/base/concreteCommands/ToogleMetricUnitsCommand.ts

@@ -0,0 +1,35 @@
+/*!
+ * Copyright 2024 Cognite AS
+ * BaseTool: Base class for the tool are used to interact with the render target.
+ */
+
+import { RenderTargetCommand } from '../commands/RenderTargetCommand';
+import { Changes } from '../domainObjectsHelpers/Changes';
+import { type TranslateKey } from '../utilities/TranslateKey';
+
+export class ToogleMetricUnitsCommand extends RenderTargetCommand {
+  // ==================================================
+  // OVERRIDES of BaseCommand
+  // ==================================================
+
+  public override get icon(): string {
+    return 'RulerAlternative';
+  }
+
+  public override get tooltip(): TranslateKey {
+    return { key: 'TOGGLE_METRIC_UNITS', fallback: 'm/ft' }; // Note: m/ft do not need to be translated!
+  }
+
+  public override get isChecked(): boolean {
+    const { renderTarget } = this;
+    return renderTarget.rootDomainObject.unitSystem.isMetric;
+  }
+
+  protected override invokeCore(): boolean {
+    const { renderTarget } = this;
+    const unitSystem = renderTarget.rootDomainObject.unitSystem;
+    unitSystem.isMetric = !unitSystem.isMetric;
+    renderTarget.rootDomainObject.notifyRecursive(Changes.unit);
+    return true;
+  }
+}