fix: Revert "refactor: Reduce bundle size (#1575)" (#1622)

This reverts commit 81dcbe294d.

extensions/vtk/src/OHIFVTKViewport.js

@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { getReactVtkjsViewport } from './utils/getReactVtkjsViewport';
+import { getImageData, loadImageData } from 'react-vtkjs-viewport';
 import ConnectedVTKViewport from './ConnectedVTKViewport';
 import LoadingIndicator from './LoadingIndicator.js';
 import OHIF from '@ohif/core';
@@ -69,7 +69,7 @@ class OHIFVTKViewport extends Component {
   };
 
   static defaultProps = {
-    onScroll: () => { },
+    onScroll: () => {},
   };
 
   static id = 'OHIFVTKViewport';
@@ -133,8 +133,7 @@ class OHIFVTKViewport extends Component {
     displaySetInstanceUID,
     SOPClassUID,
     SOPInstanceUID,
-    frameIndex,
-    reactVtkjsViewport
+    frameIndex
   ) => {
     const stack = OHIFVTKViewport.getCornerstoneStack(
       studies,
@@ -145,10 +144,7 @@ class OHIFVTKViewport extends Component {
       frameIndex
     );
 
-    const imageDataObject = reactVtkjsViewport.getImageData(
-      stack.imageIds,
-      displaySetInstanceUID
-    );
+    const imageDataObject = getImageData(stack.imageIds, displaySetInstanceUID);
     let labelmapDataObject;
     let labelmapColorLUT;
 
@@ -261,9 +257,7 @@ class OHIFVTKViewport extends Component {
     return volumeActor;
   }
 
-  async setStateFromProps() {
-    const reactVtkjsViewport = await getReactVtkjsViewport();
-
+  setStateFromProps() {
     const { studies, displaySet } = this.props.viewportData;
     const {
       StudyInstanceUID,
@@ -301,10 +295,8 @@ class OHIFVTKViewport extends Component {
       studies,
       StudyInstanceUID,
       displaySetInstanceUID,
-      sopClassUIDs[0],
       SOPInstanceUID,
-      frameIndex,
-      reactVtkjsViewport
+      frameIndex
     );
 
     this.imageDataObject = imageDataObject;
@@ -325,7 +317,7 @@ class OHIFVTKViewport extends Component {
         dataDetails,
       },
       () => {
-        this.loadProgressively(imageDataObject, reactVtkjsViewport);
+        this.loadProgressively(imageDataObject);
 
         // TODO: There must be a better way to do this.
         // We do this so that if all the data is available the react-vtkjs-viewport
@@ -343,26 +335,26 @@ class OHIFVTKViewport extends Component {
     );
   }
 
-  async componentDidMount() {
-    await this.setStateFromProps();
+  componentDidMount() {
+    this.setStateFromProps();
   }
 
-  async componentDidUpdate(prevProps) {
+  componentDidUpdate(prevProps) {
     const { displaySet } = this.props.viewportData;
     const prevDisplaySet = prevProps.viewportData.displaySet;
 
     if (
       displaySet.displaySetInstanceUID !==
-      prevDisplaySet.displaySetInstanceUID ||
+        prevDisplaySet.displaySetInstanceUID ||
       displaySet.SOPInstanceUID !== prevDisplaySet.SOPInstanceUID ||
       displaySet.frameIndex !== prevDisplaySet.frameIndex
     ) {
-      await this.setStateFromProps();
+      this.setStateFromProps();
     }
   }
 
-  loadProgressively(imageDataObject, reactVtkjsViewport) {
-    reactVtkjsViewport.loadImageData(imageDataObject);
+  loadProgressively(imageDataObject) {
+    loadImageData(imageDataObject);
 
     const { isLoading, insertPixelDataPromises } = imageDataObject;
 

extensions/vtk/src/VTKViewport.js

@@ -1,16 +1,9 @@
 import React, { useEffect, useCallback } from 'react';
-// import { View2D } from 'react-vtkjs-viewport';
+import { View2D } from 'react-vtkjs-viewport';
 import PropTypes from 'prop-types';
-import asyncComponent from './asyncComponent.js';
-import { getReactVtkjsViewport } from './utils/getReactVtkjsViewport';
 
 import './VTKViewport.css';
 
-const View2D = asyncComponent(async () => {
-  const reactVtkjsViewport = await getReactVtkjsViewport();
-  return { default: reactVtkjsViewport.View2D };
-});
-
 const VTKViewport = props => {
   const style = { width: '100%', height: '100%', position: 'relative' };
 
@@ -59,7 +52,7 @@ VTKViewport.propTypes = {
 };
 
 VTKViewport.defaultProps = {
-  onScroll: () => { },
+  onScroll: () => {},
 };
 
 export default VTKViewport;

extensions/vtk/src/commandsModule.js

@@ -1,5 +1,10 @@
 import throttle from 'lodash.throttle';
-import { getReactVtkjsViewport } from './utils/getReactVtkjsViewport';
+import {
+  vtkInteractorStyleMPRCrosshairs,
+  vtkInteractorStyleMPRWindowLevel,
+  vtkInteractorStyleMPRRotate,
+  vtkSVGCrosshairsWidget,
+} from 'react-vtkjs-viewport';
 
 import setMPRLayout from './utils/setMPRLayout.js';
 import setViewportToVTK from './utils/setViewportToVTK.js';
@@ -119,18 +124,16 @@ const commandsModule = ({ commandsManager }) => {
 
       _setView(api, [0, 1, 0], [0, 0, 1]);
     },
-    enableRotateTool: async () => {
-      const reactVtkjsViewport = await getReactVtkjsViewport();
+    enableRotateTool: () => {
       apis.forEach(api => {
-        const istyle = reactVtkjsViewport.vtkInteractorStyleMPRRotate.newInstance();
+        const istyle = vtkInteractorStyleMPRRotate.newInstance();
 
         api.setInteractorStyle({ istyle });
       });
     },
-    enableCrosshairsTool: async () => {
-      const reactVtkjsViewport = await getReactVtkjsViewport();
+    enableCrosshairsTool: () => {
       apis.forEach((api, apiIndex) => {
-        const istyle = reactVtkjsViewport.vtkInteractorStyleMPRCrosshairs.newInstance();
+        const istyle = vtkInteractorStyleMPRCrosshairs.newInstance();
 
         api.setInteractorStyle({
           istyle,
@@ -138,7 +141,7 @@ const commandsModule = ({ commandsManager }) => {
         });
       });
     },
-    enableLevelTool: async () => {
+    enableLevelTool: () => {
       function updateVOI(apis, windowWidth, windowCenter) {
         apis.forEach(api => {
           api.updateVOI(windowWidth, windowCenter);
@@ -159,9 +162,8 @@ const commandsModule = ({ commandsManager }) => {
         },
       };
 
-      const reactVtkjsViewport = await getReactVtkjsViewport();
       apis.forEach(api => {
-        const istyle = reactVtkjsViewport.vtkInteractorStyleMPRWindowLevel.newInstance();
+        const istyle = vtkInteractorStyleMPRWindowLevel.newInstance();
 
         api.setInteractorStyle({ istyle, callbacks });
       });
@@ -258,15 +260,14 @@ const commandsModule = ({ commandsManager }) => {
       }
 
       // Add widgets and set default interactorStyle of each viewport.
-      const reactVtkjsViewport = await getReactVtkjsViewport();
       apis.forEach((api, apiIndex) => {
         api.addSVGWidget(
-          reactVtkjsViewport.vtkSVGCrosshairsWidget.newInstance(),
+          vtkSVGCrosshairsWidget.newInstance(),
           'crosshairsWidget'
         );
 
         const uid = api.uid;
-        const istyle = reactVtkjsViewport.vtkInteractorStyleMPRCrosshairs.newInstance();
+        const istyle = vtkInteractorStyleMPRCrosshairs.newInstance();
 
         api.setInteractorStyle({
           istyle,

extensions/vtk/src/utils/getReactVtkjsViewport.js

@@ -1,5 +0,0 @@
-export function getReactVtkjsViewport() {
-  return import(
-    /* webpackChunkName: "ReactVtkjsViewport" */ 'react-vtkjs-viewport'
-  );
-}