React 18 Migration (#108)

* React 18 Migration

* Fix import

* Update package.json

---------

Co-authored-by: Moritz Heckmann <moritz.heckmann@datavisyn.io>
Co-authored-by: oltionchampari <oltion.champari@datavisyn.io>
Co-authored-by: Michael Pühringer <51900829+puehringer@users.noreply.github.com>

package.json

@@ -74,6 +74,12 @@
     "visyn_scripts": "git+ssh://git@github.com/datavisyn/visyn_scripts.git#develop",
     "xxhashjs": "^0.2.2"
   },
+  "resolutions": {
+    "@types/react": "~18.2.0",
+    "@types/react-dom": "~18.2.0",
+    "react": "~18.2.0",
+    "react-dom": "~18.2.0"
+  },
   "visyn": {
     "entries": {
       "app": "./index.js"

src/phovea.ts

@@ -4,7 +4,7 @@
  * Licensed under the new BSD license, available at http://caleydo.org/license
  **************************************************************************** */
 
-import { IRegistry } from 'visyn_core';
+import { IRegistry } from 'visyn_core/plugin';
 import { EP_TDP_CORE_LINEUP_PANEL_TAB, IPanelTabExtensionDesc } from 'tdp_core';
 
 export default function (registry: IRegistry) {
@@ -15,7 +15,7 @@ export default function (registry: IRegistry) {
     EP_TDP_CORE_LINEUP_PANEL_TAB,
     'statisticalAnalysisPanel',
     function () {
-      return import('./app/TouringPanel.js').then((m) => m.TouringPanel);
+      return import('./app/TouringPanel').then((m) => m.TouringPanel);
     },
     <IPanelTabExtensionDesc>{
       cssClass: 'statistical-analysis-tab',

src/phovea_registry.ts

@@ -4,7 +4,7 @@
  * Licensed under the new BSD license, available at http://caleydo.org/license
  **************************************************************************** */
 
-import { PluginRegistry } from 'visyn_core';
+import { PluginRegistry } from 'visyn_core/plugin';
 import reg from './phovea';
 
 /**

src/tasks/ATouringTask.ts

@@ -2,7 +2,7 @@ import * as $ from 'jquery';
 import * as d3v3 from 'd3v3';
 import 'select2';
 import { LocalDataProvider, IColumnDesc, CategoricalColumn, ICategoricalColumnDesc, Column } from 'lineupjs';
-import { IServerColumn } from 'visyn_core';
+import { IServerColumn } from 'visyn_core/base';
 import { UniqueIdManager } from 'tdp_core';
 import { IMeasureResult, ISimilarityMeasure, ISetParameters } from '../base/interfaces';
 import { SCOPE } from '../base/constants';

src/tasks/ColumnComparisonTask.ts

@@ -1,7 +1,7 @@
 import * as XXH from 'xxhashjs';
 import { cloneDeep } from 'lodash';
 import { IColumnDesc } from 'lineupjs';
-import { IServerColumn } from 'visyn_core';
+import { IServerColumn } from 'visyn_core/base';
 import colCmpHtml from '../templates/ColumnComparison.html'; // webpack imports html to variable
 import colCmpIcon from '../assets/colCmp.png';
 

src/tasks/RankingAdapter.ts

@@ -1,5 +1,6 @@
 import { LocalDataProvider, IColumnDesc, ICategory, Column, Ranking, IDataRow, IOrderedGroup } from 'lineupjs';
-import { IServerColumn, IAccessorFunc } from 'tdp_core';
+import { IAccessorFunc } from 'tdp_core';
+import { IServerColumn } from 'visyn_core/base';
 
 import { BaseUtils } from '../base/BaseUtils';
 

src/tasks/RowComparisonTask.ts

@@ -2,7 +2,7 @@ import * as $ from 'jquery';
 import * as d3v3 from 'd3v3';
 import * as XXH from 'xxhashjs';
 import { IColumnDesc, ICategoricalColumnDesc, ICategory } from 'lineupjs';
-import { IServerColumn } from 'visyn_core';
+import { IServerColumn } from 'visyn_core/base';
 import rowCmpHtml from '../templates/RowComparison.html'; // webpack imports html to variable
 import rowCmpIcon from '../assets/rowCmp.png';
 

src/tasks/TaskUtils.ts

@@ -1,6 +1,6 @@
 import * as d3v3 from 'd3v3';
 import { IColumnDesc } from 'lineupjs';
-import { IServerColumn } from 'visyn_core';
+import { IServerColumn } from 'visyn_core/base';
 import { UniqueIdManager } from 'tdp_core';
 import { RankingAdapter } from './RankingAdapter';