Merge pull request #375 from OHIF/viewport-custom-props

feat(vewportOverlay): Update the extension to be able to pass custom …

Packages-react/extensions/ohif-cornerstone-extension/package.json

@@ -92,6 +92,6 @@
     "@babel/runtime": "^7.2.0",
     "classnames": "^2.2.6",
     "lodash.throttle": "^4.1.1",
-    "react-cornerstone-viewport": "^0.1.23"
+    "react-cornerstone-viewport": "^0.1.24"
   }
 }

Packages-react/extensions/ohif-cornerstone-extension/rollup.config.js

@@ -13,6 +13,7 @@ const globals =  {
   'react-dom': 'ReactDOM',
   'react-redux': 'ReactRedux',
   'react-resize-detector': 'ReactResizeDetector',
+  'react-viewerbase': 'reactViewerbase',
   'prop-types': 'PropTypes',
   'cornerstone-core': 'cornerstone',
   'cornerstone-wado-image-loader': 'cornerstoneWADOImageLoader',

Packages-react/extensions/ohif-cornerstone-extension/src/OHIFCornerstoneExtension.js

@@ -11,9 +11,18 @@ import ToolbarModule from './ToolbarModule.js';
  * @param children
  * @return {function(*): *}
  */
-function withChildren(WrappedComponent, children) {
+function componentWithProps(WrappedComponent, children, customProps) {
   return function(props) {
-    return <WrappedComponent children={children} { ...props } />;
+    const extraProps = {
+      customProps
+    };
+    if (children.viewport) {
+      extraProps.children = children.viewport;
+    }
+
+    const mergedProps = Object.assign({}, props, extraProps);
+
+    return <WrappedComponent {...mergedProps} />;
   };
 }
 
@@ -21,8 +30,10 @@ function withChildren(WrappedComponent, children) {
 // https://github.com/whitecolor/yalc
 
 export default class OHIFCornerstoneExtension {
-  constructor(children) {
+  constructor(props) {
+    const { children = {}, customProps = {} } = props;
     this.children = children;
+    this.customProps = customProps;
   }
 
   /**
@@ -33,11 +44,11 @@ export default class OHIFCornerstoneExtension {
   }
 
   getViewportModule() {
-    if (this.children && this.children.viewport) {
-      return withChildren(OHIFCornerstoneViewport, this.children.viewport);
-    }
-
-    return OHIFCornerstoneViewport;
+    return componentWithProps(
+      OHIFCornerstoneViewport,
+      this.children,
+      this.customProps
+    );
   }
 
   getSopClassHandler() {

Packages-react/extensions/ohif-cornerstone-extension/src/OHIFCornerstoneViewport.js

@@ -32,11 +32,16 @@ class OHIFCornerstoneViewport extends Component {
     viewportData: null
   };
 
+  static defaultProps = {
+    customProps: {}
+  };
+
   static propTypes = {
     studies: PropTypes.object,
     displaySet: PropTypes.object,
     viewportIndex: PropTypes.number,
-    children: PropTypes.node
+    children: PropTypes.node,
+    customProps: PropTypes.object
   };
 
   static id = 'OHIFCornerstoneViewport';
@@ -226,6 +231,7 @@ class OHIFCornerstoneViewport extends Component {
           <ConnectedCornerstoneViewport
             viewportData={this.state.viewportData}
             viewportIndex={this.props.viewportIndex}
+            {...this.props.customProps}
           />
         )}
         {childrenWithProps}