Allow OHIFCornerstoneExtension to have children passed into it upon declaration

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

@@ -1,6 +1,29 @@
+import React, { Component } from 'react';
 import OHIFCornerstoneViewport from './OHIFCornerstoneViewport.js';
 
+/**
+ * Pass in 'children' to a React component. The purpose of this is to
+ * allow end users of this extension to pass in components which will
+ * be rendered on top of the base components.
+ *
+ * @param WrappedComponent
+ * @param children
+ * @return {function(*): *}
+ */
+function withChildren(WrappedComponent, children) {
+  return function(props) {
+    return <WrappedComponent children={children} { ...props } />;
+  };
+}
+
+// Note: If you are authoring extensions which use stateful libraries (e.g. cornerstone-core, react-redux) as peerDependencies and are also duplicated at the application level, try using 'yalc' to link it to the application, rather than yarn link. This can help fix 'module not found' issues.
+// https://github.com/whitecolor/yalc
+
 export default class OHIFCornerstoneExtension {
+  constructor(children) {
+    this.children = children;
+  }
+
   /**
    * Extension ID is a unique id, might be used for namespacing extension specific redux actions/reducers (?)
    */
@@ -9,6 +32,10 @@ export default class OHIFCornerstoneExtension {
   }
 
   getViewportModule() {
+    if (this.children && this.children.viewport) {
+      return withChildren(OHIFCornerstoneViewport, this.children.viewport);
+    }
+
     return OHIFCornerstoneViewport;
   }
 

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

@@ -41,7 +41,8 @@ class OHIFCornerstoneViewport extends Component {
   static propTypes = {
     studies: PropTypes.object,
     displaySet: PropTypes.object,
-    viewportIndex: PropTypes.number
+    viewportIndex: PropTypes.number,
+    children: PropTypes.node
   };
 
   static id = 'OHIFCornerstoneViewport';
@@ -160,6 +161,7 @@ class OHIFCornerstoneViewport extends Component {
           viewportIndex={this.props.viewportIndex}
         />
       )}
+      {this.props.children}
       </>
     );
   }