From 7772fee21ae6a65994e1251e2f1d2554b47781be Mon Sep 17 00:00:00 2001 From: Erik Ziegler Date: Wed, 22 Jul 2020 21:10:04 +0200 Subject: [PATCH] fix: Switch DICOMFileUploader to use the UIModalService (#1904) --- .../core/src/services/UIModalService/index.js | 4 +- platform/ui/package.json | 5 +- .../ui/src/contextProviders/ModalProvider.js | 10 ++- .../src/googleCloud/DicomFileUploaderModal.js | 71 ++++++++-------- .../src/googleCloud/DicomStorePickerModal.js | 1 + yarn.lock | 80 ++++++++++++++----- 6 files changed, 108 insertions(+), 63 deletions(-) diff --git a/platform/core/src/services/UIModalService/index.js b/platform/core/src/services/UIModalService/index.js index ed2eab96a..57e308713 100644 --- a/platform/core/src/services/UIModalService/index.js +++ b/platform/core/src/services/UIModalService/index.js @@ -28,13 +28,14 @@ const serviceImplementation = { /** * Show a new UI modal; * - * @param {ModalProps} props { content, contentProps, shouldCloseOnEsc, isOpen, closeButton, title, customClassName } + * @param {ModalProps} props { content, contentProps, shouldCloseOnEsc, isOpen, onClose, closeButton, title, customClassName } */ function _show({ content = null, contentProps = null, shouldCloseOnEsc = false, isOpen = true, + onClose = null, closeButton = true, title = null, customClassName = null, @@ -44,6 +45,7 @@ function _show({ contentProps, shouldCloseOnEsc, isOpen, + onClose, closeButton, title, customClassName, diff --git a/platform/ui/package.json b/platform/ui/package.json index d78d75d0e..94ff3c835 100644 --- a/platform/ui/package.json +++ b/platform/ui/package.json @@ -41,13 +41,14 @@ "@ohif/i18n": "^0.2.3", "browser-detect": "^0.2.28", "classnames": "2.2.6", + "dom-helpers": "^3.3.1", "i18next": "^17.0.3", "i18next-browser-languagedetector": "^3.0.1", "lodash.debounce": "^4.0.8", "lodash.isequal": "4.5.0", "moment": "2.24.0", "prop-types": "15.6.2", - "react-bootstrap-modal": "4.2.0", + "prop-types-extra": "^1.1.1", "react-dates": "21.2.1", "react-dnd": "9.4.0", "react-dnd-html5-backend": "^9.4.0", @@ -56,6 +57,8 @@ "react-error-boundary": "^2.2.1", "react-i18next": "^10.11.0", "react-modal": "^3.11.1", + "react-overlays": "^0.8.0", + "react-transition-group": "2.0.0", "react-with-direction": "1.3.0" }, "devDependencies": { diff --git a/platform/ui/src/contextProviders/ModalProvider.js b/platform/ui/src/contextProviders/ModalProvider.js index e8d65635d..c8b3d90fb 100644 --- a/platform/ui/src/contextProviders/ModalProvider.js +++ b/platform/ui/src/contextProviders/ModalProvider.js @@ -32,6 +32,7 @@ const ModalProvider = ({ children, modal: Modal, service }) => { contentProps: null, shouldCloseOnEsc: false, isOpen: true, + onClose: null, closeButton: true, title: null, customClassName: '', @@ -73,6 +74,7 @@ const ModalProvider = ({ children, modal: Modal, service }) => { content: ModalContent, contentProps, isOpen, + onClose, title, customClassName, shouldCloseOnEsc, @@ -88,7 +90,13 @@ const ModalProvider = ({ children, modal: Modal, service }) => { isOpen={isOpen} title={title} closeButton={closeButton} - onClose={hide} + onClose={() => { + if (onClose) { + onClose(); + } + + hide(); + }} > diff --git a/platform/viewer/src/googleCloud/DicomFileUploaderModal.js b/platform/viewer/src/googleCloud/DicomFileUploaderModal.js index 1f113c683..e7f029483 100644 --- a/platform/viewer/src/googleCloud/DicomFileUploaderModal.js +++ b/platform/viewer/src/googleCloud/DicomFileUploaderModal.js @@ -1,49 +1,44 @@ import React, { Component } from 'react'; import PropTypes from 'prop-types'; -import Modal from 'react-bootstrap-modal'; import DicomUploader from './DicomUploader'; import { withTranslation } from 'react-i18next'; +import { servicesManager } from './../App.js'; -class DicomFileUploaderModal extends Component { - static propTypes = { - url: PropTypes.string, - retrieveAuthHeaderFunction: PropTypes.func, - onClose: PropTypes.func, - }; +function DicomFileUploaderModal({ + isOpen = false, + onClose, + url, + retrieveAuthHeaderFunction, + t, + }) { + const { UIModalService } = servicesManager.services; - state = { - uploaded: false, - }; - - render() { - if (!this.props.url) { - return null; + const showDicomStorePickerModal = () => { + if (!UIModalService) { + return } - return ( - - - - {this.props.t('Upload DICOM Files')} - - - - - - - ); - } + UIModalService.show({ + content: DicomUploader, + title: t('Upload DICOM Files'), + contentProps: { + url, + retrieveAuthHeaderFunction + }, + onClose, + }); + }; + + return ( + {isOpen && showDicomStorePickerModal()} + ); } +DicomFileUploaderModal.propTypes = { + isOpen: PropTypes.bool.isRequired, + retrieveAuthHeaderFunction: PropTypes.func.isRequired, + onClose: PropTypes.func, + url: PropTypes.string, +}; + export default withTranslation('Common')(DicomFileUploaderModal); diff --git a/platform/viewer/src/googleCloud/DicomStorePickerModal.js b/platform/viewer/src/googleCloud/DicomStorePickerModal.js index 5cba3874b..093408a89 100644 --- a/platform/viewer/src/googleCloud/DicomStorePickerModal.js +++ b/platform/viewer/src/googleCloud/DicomStorePickerModal.js @@ -36,6 +36,7 @@ function DicomStorePickerModal({ user, url, }, + onClose }); } }; diff --git a/yarn.lock b/yarn.lock index b80c37c75..1d120838c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1247,13 +1247,34 @@ pirates "^4.0.0" source-map-support "^0.5.9" -"@babel/runtime@7.1.2", "@babel/runtime@7.5.5", "@babel/runtime@7.6.0", "@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.0", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5", "@babel/runtime@^7.6.0", "@babel/runtime@^7.6.3", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.6": +"@babel/runtime@7.1.2": + version "7.1.2" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.1.2.tgz#81c89935f4647706fc54541145e6b4ecfef4b8e3" + integrity sha512-Y3SCjmhSupzFB6wcv1KmmFucH6gDVnI30WjOcicV10ju0cZjak3Jcs67YLIXBrmZYw1xCrVeJPbycFwrqNyxpg== + dependencies: + regenerator-runtime "^0.12.0" + +"@babel/runtime@7.6.0": + version "7.6.0" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.6.0.tgz#4fc1d642a9fd0299754e8b5de62c631cf5568205" + integrity sha512-89eSBLJsxNxOERC0Op4vd+0Bqm6wRMqMbFtV3i0/fbaWw/mJ8Q3eBvgX0G4SyrOOLCtbu98HspF8o09MRT+KzQ== + dependencies: + regenerator-runtime "^0.13.2" + +"@babel/runtime@^7.0.0", "@babel/runtime@^7.1.2", "@babel/runtime@^7.2.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.4.0", "@babel/runtime@^7.4.2", "@babel/runtime@^7.4.4", "@babel/runtime@^7.4.5", "@babel/runtime@^7.5.5": version "7.5.5" resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.5.5.tgz#74fba56d35efbeca444091c7850ccd494fd2f132" integrity sha512-28QvEGyQyNkB0/m2B4FU7IEZGK2NUrcMtT6BZEFALTguLk+AUT6ofsHtPk5QyjAdUkpMJ+/Em+quwz4HOt30AQ== dependencies: regenerator-runtime "^0.13.2" +"@babel/runtime@^7.6.0", "@babel/runtime@^7.6.3", "@babel/runtime@^7.7.2", "@babel/runtime@^7.8.4", "@babel/runtime@^7.8.7", "@babel/runtime@^7.9.6": + version "7.10.5" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.10.5.tgz#303d8bd440ecd5a491eae6117fd3367698674c5c" + integrity sha512-otddXKhdNn7d0ptoFRHtMLa8LqDxLYwTjB4nYgM1yy5N6gU/MUf8zqyyLltCH3yAVitBzmwK4us+DD0l/MauAg== + dependencies: + regenerator-runtime "^0.13.4" + "@babel/template@^7.0.0", "@babel/template@^7.1.0", "@babel/template@^7.4.0", "@babel/template@^7.4.4", "@babel/template@^7.6.0": version "7.6.0" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.6.0.tgz#7f0159c7f5012230dad64cca42ec9bdb5c9536e6" @@ -4992,6 +5013,11 @@ cfb@^1.1.0: crc-32 "~1.2.0" printj "~1.1.2" +chain-function@^1.0.0: + version "1.0.1" + resolved "https://registry.yarnpkg.com/chain-function/-/chain-function-1.0.1.tgz#c63045e5b4b663fb86f1c6e186adaf1de402a1cc" + integrity sha512-SxltgMwL9uCko5/ZCLiyG2B7R9fY4pDZUw7hJ4MhirdjBLosoDqkWABi3XMucddHdLiFJMb7PD2MZifZriuMTg== + chalk@1.1.3, chalk@^1.0.0, chalk@^1.1.1, chalk@^1.1.3: version "1.1.3" resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98" @@ -7247,7 +7273,7 @@ dom-converter@^0.2: dependencies: utila "~0.4" -dom-helpers@^3.2.1, dom-helpers@^3.3.1, dom-helpers@^3.4.0: +dom-helpers@^3.2.0, dom-helpers@^3.2.1, dom-helpers@^3.3.1, dom-helpers@^3.4.0: version "3.4.0" resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-3.4.0.tgz#e9b369700f959f62ecde5a6babde4bccd9169af8" integrity sha512-LnuPJ+dwqKDIyotW1VzmOZ5TONUN7CwkCR5hrgawTUbkBGYdeoNLZo6nNfGkCrjtE1nXXaj7iMMpDa8/d9WoIA== @@ -15293,13 +15319,13 @@ prop-types-exact@^1.2.0: object.assign "^4.1.0" reflect.ownkeys "^0.2.0" -prop-types-extra@^1.0.1, prop-types-extra@^1.1.0: - version "1.1.0" - resolved "https://registry.yarnpkg.com/prop-types-extra/-/prop-types-extra-1.1.0.tgz#32609910ea2dcf190366bacd3490d5a6412a605f" - integrity sha512-QFyuDxvMipmIVKD2TwxLVPzMnO4e5oOf1vr3tJIomL8E7d0lr6phTHd5nkPhFIzTD1idBLLEPeylL9g+rrTzRg== +prop-types-extra@^1.0.1, prop-types-extra@^1.1.1: + version "1.1.1" + resolved "https://registry.yarnpkg.com/prop-types-extra/-/prop-types-extra-1.1.1.tgz#58c3b74cbfbb95d304625975aa2f0848329a010b" + integrity sha512-59+AHNnHYCdiC+vMwY52WmvP5dM3QLeoumYuEyceQDi9aEhtwN9zIQ2ZNo25sMyXnbh32h+P1ezDsUpUH3JAew== dependencies: react-is "^16.3.2" - warning "^3.0.0" + warning "^4.0.0" prop-types@15.6.2: version "15.6.2" @@ -15586,18 +15612,6 @@ re-resizable@^4.11.0: resolved "https://registry.yarnpkg.com/re-resizable/-/re-resizable-4.11.0.tgz#d5df10bda445c4ec0945751a223bf195afb61890" integrity sha512-dye+7rERqNf/6mDT1iwps+4Gf42420xuZgygF33uX178DxffqcyeuHbBuJ382FIcB5iP6mMZOhfW7kI0uXwb/Q== -react-bootstrap-modal@4.2.0: - version "4.2.0" - resolved "https://registry.yarnpkg.com/react-bootstrap-modal/-/react-bootstrap-modal-4.2.0.tgz#010b3ca9230a3c147fa5fc6aa39b6971e34151bd" - integrity sha512-2Xx9yvPEnMNhJIAKCg+t3CECF6w3qt2mmICv1Y1vwDBHeuyyf3OvSFcnRM8E0Tn7pywgopL2qyU4yx0vnGKmdA== - dependencies: - classnames "^2.2.6" - dom-helpers "^3.3.1" - prop-types "^15.6.1" - prop-types-extra "^1.1.0" - react-overlays "^0.8.0" - react-transition-group "^2.0.0" - react-codemirror2@^6.0.0: version "6.0.0" resolved "https://registry.yarnpkg.com/react-codemirror2/-/react-codemirror2-6.0.0.tgz#180065df57a64026026cde569a9708fdf7656525" @@ -15859,7 +15873,12 @@ react-input-autosize@^2.2.2: dependencies: prop-types "^15.5.8" -react-is@^16.3.2, react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.4, react-is@^16.9.0: +react-is@^16.3.2: + version "16.13.1" + resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" + integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== + +react-is@^16.6.0, react-is@^16.7.0, react-is@^16.8.1, react-is@^16.8.4, react-is@^16.9.0: version "16.11.0" resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.11.0.tgz#b85dfecd48ad1ce469ff558a882ca8e8313928fa" integrity sha512-gbBVYR2p8mnriqAwWx9LbuUrShnAuSCNnuPGyc7GJrMVQtPDAh8iLpv7FRuMPFb56KkaVZIYSz1PrjI9q0QPCw== @@ -16016,7 +16035,19 @@ react-simple-code-editor@^0.9.0: resolved "https://registry.yarnpkg.com/react-simple-code-editor/-/react-simple-code-editor-0.9.15.tgz#59e3583832e9e98992d3674b2d7673b4cd1c5709" integrity sha512-M8iKgjBTBZK92tZYgOEfMuR7c3zZ0q0v3QYllSxIPx3SU+w003VofH50txXQSBTu92pSOm2tidON1HbQ1l8BDA== -react-transition-group@^2.0.0, react-transition-group@^2.2.0, react-transition-group@^2.2.1: +react-transition-group@2.0.0: + version "2.0.0" + resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.0.0.tgz#e882e61fce8622ed981b6e31fc7ef52d43a1a06a" + integrity sha1-6ILmH86GIu2YG24x/H71LUOhoGo= + dependencies: + chain-function "^1.0.0" + classnames "^2.2.5" + dom-helpers "^3.2.0" + loose-envify "^1.3.1" + prop-types "^15.5.8" + warning "^3.0.0" + +react-transition-group@^2.2.0, react-transition-group@^2.2.1: version "2.9.0" resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-2.9.0.tgz#df9cdb025796211151a436c69a8f3b97b5b07c8d" integrity sha512-+HzNTCHpeQyl4MJ/bdE0u6XRMe9+XG/+aL4mCxVN4DnPBQ0/5bfHWPDuOZUzYdMj94daZaZdCCc1Dzt9R/xSSg== @@ -16402,6 +16433,11 @@ regenerator-runtime@^0.11.0, regenerator-runtime@^0.11.1: resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9" integrity sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg== +regenerator-runtime@^0.12.0: + version "0.12.1" + resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.12.1.tgz#fa1a71544764c036f8c49b13a08b2594c9f8a0de" + integrity sha512-odxIc1/vDlo4iZcfXqRYFj0vpXFNoGdKMAUieAlFYO6m/nl5e9KR/beGf41z4a1FI+aQgtjhuaSlDxQ0hmkrHg== + regenerator-runtime@^0.13.1, regenerator-runtime@^0.13.2, regenerator-runtime@^0.13.4: version "0.13.5" resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.5.tgz#d878a1d094b4306d10b9096484b33ebd55e26697" @@ -19722,7 +19758,7 @@ warning@^3.0.0: dependencies: loose-envify "^1.0.0" -warning@^4.0.3: +warning@^4.0.0, warning@^4.0.3: version "4.0.3" resolved "https://registry.yarnpkg.com/warning/-/warning-4.0.3.tgz#16e9e077eb8a86d6af7d64aa1e05fd85b4678ca3" integrity sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==