Simplify implementation by removing concept of 'first' and 'second' on selected attributes and dataset (#83)

brichet · web-flow · commit e788dfd9a4f2 · 2023-06-23T15:59:07.000+02:00
diff --git a/src/linkPanel/model.ts b/src/linkPanel/model.ts
@@ -8,7 +8,6 @@ import {
   ILinkEditorModel,
   IAdvLinkCategories,
   IAdvLinkDescription,
-  IDatasets,
   ComponentLinkType,
   IdentityLinkFunction
 } from './types';
@@ -25,11 +24,6 @@ export class LinkEditorModel implements ILinkEditorModel {
     this._sharedModel.linksChanged.connect(this.onLinksChanged, this);
     this._sharedModel.datasetChanged.connect(this.onDatasetsChanged, this);
     this._getAdvancedLinksCategories();
-
-    this._currentDatasets = {
-      first: '',
-      second: ''
-    };
   }
 
   get sharedModel(): IGlueSessionSharedModel {
@@ -39,26 +33,26 @@ export class LinkEditorModel implements ILinkEditorModel {
   /**
    * Getter and setter for datasets.
    */
-  get currentDatasets(): IDatasets {
+  get currentDatasets(): [string, string] {
     return this._currentDatasets;
   }
-  set currentDatasets(datasets: IDatasets) {
+  set currentDatasets(datasets: [string, string]) {
     this._currentDatasets = datasets;
     this._datasetsChanged.emit(this._currentDatasets);
   }
 
   /**
    * Replace one current dataset.
    */
-  setCurrentDataset(position: keyof IDatasets, value: string): void {
-    this._currentDatasets[position] = value;
+  setCurrentDataset(index: number, value: string): void {
+    this._currentDatasets[index] = value;
     this._datasetsChanged.emit(this._currentDatasets);
   }
 
   /**
    * A signal emits when current datasets changes
    */
-  get currentDatasetsChanged(): ISignal<this, IDatasets> {
+  get currentDatasetsChanged(): ISignal<this, [string, string]> {
     return this._datasetsChanged;
   }
 
@@ -133,10 +127,10 @@ export class LinkEditorModel implements ILinkEditorModel {
     // Reset the current dataset, with empty values if there is less than 2 datasets.
     if (this._sharedModel.dataset) {
       const datasetsList = Object.keys(this._sharedModel.dataset);
-      this._currentDatasets = {
-        first: datasetsList.length > 1 ? datasetsList[0] : '',
-        second: datasetsList.length > 1 ? datasetsList[1] : ''
-      };
+      this._currentDatasets = [
+        datasetsList.length > 1 ? datasetsList[0] : '',
+        datasetsList.length > 1 ? datasetsList[1] : ''
+      ];
       this._datasetsChanged.emit(this._currentDatasets);
     }
   }
@@ -164,8 +158,8 @@ export class LinkEditorModel implements ILinkEditorModel {
   }
 
   private _sharedModel: IGlueSessionSharedModel;
-  private _currentDatasets: IDatasets;
-  private _datasetsChanged = new Signal<this, IDatasets>(this);
+  private _currentDatasets: [string, string] = ['', ''];
+  private _datasetsChanged = new Signal<this, [string, string]>(this);
   private _advLinksPromise = new PromiseDelegate<IAdvLinkCategories>();
   private _advLinkCategories: IAdvLinkCategories = {};
   private _identityLinks = new Map<string, ILink>();
diff --git a/src/linkPanel/types.ts b/src/linkPanel/types.ts
@@ -12,14 +12,13 @@ export const IdentityLinkUsing = {
   function: IdentityLinkFunction
 };
 
-export const IDatasetsKeys = ['first', 'second'] as (keyof IDatasets)[];
 /**
  * The link editor model.
  */
 export interface ILinkEditorModel {
-  currentDatasets: IDatasets;
-  setCurrentDataset(position: keyof IDatasets, value: string): void;
-  readonly currentDatasetsChanged: ISignal<this, IDatasets>;
+  currentDatasets: [string, string];
+  setCurrentDataset(index: number, value: string): void;
+  readonly currentDatasetsChanged: ISignal<this, [string, string]>;
   readonly identityLinks: Map<string, ILink>;
   readonly advancedLinks: Map<string, ILink>;
   readonly linksChanged: ISignal<this, void>;
@@ -46,11 +45,3 @@ export interface IAdvLinkDescription {
 export interface IAdvLinkCategories {
   [category: string]: IAdvLinkDescription[];
 }
-
-/**
- * Definition of the selected datasets.
- */
-export interface IDatasets {
-  first: string;
-  second: string;
-}
diff --git a/src/linkPanel/widgets/linking.tsx b/src/linkPanel/widgets/linking.tsx
@@ -18,8 +18,6 @@ import {
   // IAdvLinkDescription,
   ILink,
   ILinkEditorModel,
-  IDatasets,
-  IDatasetsKeys,
   // IdentityLinkFunction,
   IdentityLinkUsing
 } from '../types';
@@ -63,11 +61,6 @@ export class Linking extends LinkEditorWidget {
       );
     }
 
-    this._identityAttributes = {
-      first: undefined,
-      second: undefined
-    };
-
     this.updateDatasets();
   }
 
@@ -84,7 +77,10 @@ export class Linking extends LinkEditorWidget {
    * @param _sender - the link editor model.
    * @param selection - the selected datasets.
    */
-  onDatasetChange = (_sender: ILinkEditorModel, selection: IDatasets): void => {
+  onDatasetChange = (
+    _sender: ILinkEditorModel,
+    selection: [string, string]
+  ): void => {
     // this.updateAttributes();
     // this.updateAdvancedLink();
   };
@@ -104,7 +100,7 @@ export class Linking extends LinkEditorWidget {
   updateDatasets(): void {
     const currentDatasets = this._linkEditorModel.currentDatasets;
 
-    IDatasetsKeys.forEach((position, index) => {
+    [0, 1].forEach(index => {
       const datasetsList = Object.keys(this._sharedModel.dataset);
 
       // Remove all the existing datasets.
@@ -121,22 +117,22 @@ export class Linking extends LinkEditorWidget {
         dataset.classList.add('glue-LinkEditor-linkingItem');
         dataset.innerText = value;
         dataset.onclick = () => {
-          this.onDatasetSelected(position, dataset);
+          this.onDatasetSelected(index, dataset);
         };
         this._datasetsPanels[index].append(dataset);
 
         // Select the current dataset if exists.
-        if (currentDatasets[position] === value) {
+        if (currentDatasets[index] === value) {
           selectedDataset = dataset;
         }
       });
 
       // Select a default dataset.
       if (selectedDataset) {
-        this.onDatasetSelected(position, selectedDataset);
+        this.onDatasetSelected(index, selectedDataset);
       } else if (this._datasetsPanels[index].childNodes[index]) {
         this.onDatasetSelected(
-          position,
+          index,
           this._datasetsPanels[index].childNodes[index] as HTMLDivElement
         );
       }
@@ -149,7 +145,7 @@ export class Linking extends LinkEditorWidget {
    * @param position - 'first' or 'second', the column where the widget belongs.
    * @param dataset - Element clicked.
    */
-  onDatasetSelected(position: keyof IDatasets, dataset: HTMLDivElement): void {
+  onDatasetSelected(index: number, dataset: HTMLDivElement): void {
     // no-op if the dataset is already selected.
     if (dataset.classList.contains('selected')) {
       return;
@@ -162,8 +158,8 @@ export class Linking extends LinkEditorWidget {
 
     // Select the dataset.
     dataset.classList.add('selected');
-    this.updateAttributes(IDatasetsKeys.indexOf(position), dataset.title);
-    this._linkEditorModel.setCurrentDataset(position, dataset.title);
+    this.updateAttributes(index, dataset.title);
+    this._linkEditorModel.setCurrentDataset(index, dataset.title);
   }
 
   /**
@@ -202,7 +198,7 @@ export class Linking extends LinkEditorWidget {
       this._attributesPanels[index].append(attribute);
     });
 
-    this._identityAttributes[IDatasetsKeys[index]] = undefined;
+    this._identityAttributes[index] = undefined;
 
     // Enable/disable the Glue button if datasets are different and attributes selected.
     this._updateGlueButtonStatus();
@@ -225,12 +221,12 @@ export class Linking extends LinkEditorWidget {
     // Select the attribute.
     if (!isSelected) {
       attribute.classList.add('selected');
-      this._identityAttributes[IDatasetsKeys[index]] = {
+      this._identityAttributes[index] = {
         name: attribute.title,
         label: attribute.innerText
       };
     } else {
-      this._identityAttributes[IDatasetsKeys[index]] = undefined;
+      this._identityAttributes[index] = undefined;
     }
 
     // Enable/disable the Glue button if datasets are different and attributes selected.
@@ -243,27 +239,27 @@ export class Linking extends LinkEditorWidget {
   private _updateGlueButtonStatus(): void {
     const currentDatasets = this._linkEditorModel.currentDatasets;
     const status =
-      Object.values(this._identityAttributes).every(value => !!value) &&
-      currentDatasets.first !== currentDatasets.second;
+      this._identityAttributes.every(value => !!value) &&
+      currentDatasets[0] !== currentDatasets[1];
     this._reloadGlueButton.emit(!status);
   }
 
   /**
    * Creates identity link.
    */
   glueIdentity = (): void => {
-    if (!(this._identityAttributes.first && this._identityAttributes.second)) {
+    if (!(this._identityAttributes[0] && this._identityAttributes[1])) {
       return;
     }
 
     const link: ILink = {
       _type: ComponentLinkType,
-      cids1: [this._identityAttributes.first.name],
-      cids2: [this._identityAttributes.second.name],
-      cids1_labels: [this._identityAttributes.first.label],
-      cids2_labels: [this._identityAttributes.second.label],
-      data1: this._linkEditorModel.currentDatasets.first,
-      data2: this._linkEditorModel.currentDatasets.second,
+      cids1: [this._identityAttributes[0].name],
+      cids2: [this._identityAttributes[1].name],
+      cids1_labels: [this._identityAttributes[0].label],
+      cids2_labels: [this._identityAttributes[1].label],
+      data1: this._linkEditorModel.currentDatasets[0],
+      data2: this._linkEditorModel.currentDatasets[1],
       inverse: IdentityLinkUsing,
       using: IdentityLinkUsing
     };
@@ -452,7 +448,10 @@ export class Linking extends LinkEditorWidget {
     return panel;
   }
 
-  private _identityAttributes: Private.ISelectedIdentityAttributes;
+  private _identityAttributes: [
+    Private.IAttribute | undefined,
+    Private.IAttribute | undefined
+  ] = [undefined, undefined];
   // private _selectedAdvLink: Private.IAdvancedLinkSelected;
   private _datasetsPanels: [HTMLDivElement, HTMLDivElement];
   private _attributesPanels: [HTMLDivElement, HTMLDivElement];
@@ -478,14 +477,6 @@ namespace Private {
     name: string;
   }
 
-  /**
-   * The selected identity attributes.
-   */
-  export interface ISelectedIdentityAttributes {
-    first?: IAttribute;
-    second?: IAttribute;
-  }
-
   /**
    * The IO types names.
    */
diff --git a/src/linkPanel/widgets/summary.tsx b/src/linkPanel/widgets/summary.tsx
@@ -14,7 +14,7 @@ import {
 import * as React from 'react';
 
 import { LinkEditorWidget } from '../linkEditorWidget';
-import { IDatasets, ILink, ILinkEditorModel } from '../types';
+import { ILink } from '../types';
 
 /**
  * The widget displaying the links for the selected dataset.
@@ -43,27 +43,27 @@ export class Summary extends LinkEditorWidget {
     this._linkEditorModel.linksChanged.connect(this.linksChanged, this);
 
     if (this._linkEditorModel.currentDatasets) {
-      this.updateLinks(this._linkEditorModel.currentDatasets);
+      this.updateLinks();
     }
   }
 
   /**
    * Triggered when links has changed.
    */
   linksChanged(): void {
-    this.updateLinks(this._linkEditorModel.currentDatasets);
+    this.updateLinks();
   }
   /**
    * Callback when the selected datasets change.
    */
-  onDatasetsChange(_sender: ILinkEditorModel, datasets: IDatasets): void {
-    this.updateLinks(datasets);
+  onDatasetsChange(): void {
+    this.updateLinks();
   }
 
   /**
    * Updates the list of links when the selected dataset changes.
    */
-  updateLinks(dataset: IDatasets): void {
+  updateLinks(): void {
     const datasetLinks = new Map<string, Private.ISummaryLink[]>();
 
     // Remove all the existing widgets.
