Change modal children order

platform/ui/src/components/ohifModal/OHIFModal.js

@@ -13,7 +13,7 @@ const OHIFModal = ({
   onHide,
   footer: Footer,
   header: Header,
-  children: Component,
+  children,
 }) => (
   <ReactBootstrapModal
     className={classNames('modal fade themed in', className)}
@@ -32,9 +32,7 @@ const OHIFModal = ({
         {Header && <Header hide={onHide} />}
       </ReactBootstrapModal.Header>
     )}
-    <ReactBootstrapModal.Body>
+    <ReactBootstrapModal.Body>{children}</ReactBootstrapModal.Body>
-      {Component && <Component hide={onHide} />}
-    </ReactBootstrapModal.Body>
     {Footer && (
       <ReactBootstrapModal.Footer>
         {' '}
@@ -57,8 +55,6 @@ OHIFModal.propTypes = {
   children: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.node),
     PropTypes.node,
-    PropTypes.object,
-    PropTypes.func,
   ]).isRequired,
 };
 

platform/ui/src/utils/ModalProvider.js

@@ -59,6 +59,8 @@ const ModalProvider = ({ children, modal: Modal, service }) => {
     DEFAULT_OPTIONS,
   ]);
 
+  const { component: Component } = options;
+
   return (
     <Provider value={{ show, hide }}>
       {options.component && (
@@ -76,7 +78,7 @@ const ModalProvider = ({ children, modal: Modal, service }) => {
           footer={options.footer}
           header={options.header}
         >
-          {options.component}
+          <Component {...options} show={show} hide={hide} />
         </Modal>
       )}
       {children}
@@ -92,7 +94,6 @@ ModalProvider.propTypes = {
   children: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.node),
     PropTypes.node,
-    PropTypes.func,
   ]).isRequired,
   modal: PropTypes.oneOfType([
     PropTypes.arrayOf(PropTypes.node),