chore(release): publish [skip ci]

- @ohif/extension-debugging@0.2.2
 - @ohif/extension-dicom-tag-browser@0.2.11
 - @ohif/extension-vtk@1.11.14
 - @ohif/core@2.13.13
 - @ohif/viewer@4.9.20

.circleci/config.yml

@@ -48,12 +48,12 @@ jobs:
       - checkout:
           post:
             - git fetch --all
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       # when lock file changes, use increasingly general patterns to restore cache
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
@@ -107,12 +107,12 @@ jobs:
           post:
             - git fetch --all
 
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       # when lock file changes, use increasingly general patterns to restore cache
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
 
       - run:
           name: Install Dependencies
@@ -143,12 +143,12 @@ jobs:
       - checkout:
           post:
             - git fetch --all
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       # when lock file changes, use increasingly general patterns to restore cache
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
@@ -237,11 +237,11 @@ jobs:
           post:
             - git fetch --all
       # Use increasingly general patterns to restore cache
-      - restore_cache:
-          name: Restore Yarn and Cypress Package Cache
-          keys:
-            - yarn-packages-{{ checksum "yarn.lock" }}
-            - yarn-packages-
+      # - restore_cache:
+      #     name: Restore Yarn and Cypress Package Cache
+      #     keys:
+      #       - yarn-packages-{{ checksum "yarn.lock" }}
+      #       - yarn-packages-
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
@@ -346,7 +346,9 @@ workflows:
           record: true
           store_artifacts: true
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js yarn run build
+          build:
+            npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js
+            yarn run build
           start: yarn run test:e2e:serve
           spec: 'cypress/integration/common/**/*,cypress/integration/pwa/**/*'
           wait-on: 'http://localhost:3000'
@@ -372,7 +374,9 @@ workflows:
           record: true
           store_artifacts: true
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js yarn run build:package
+          build:
+            npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js
+            yarn run build:package
           start: yarn run test:e2e:serve
           spec: 'cypress/integration/common/**/*,cypress/integration/script-tag/**/*'
           wait-on: 'http://localhost:3000'
@@ -403,7 +407,9 @@ workflows:
           yarn: true
           store_artifacts: false
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js yarn run build
+          build:
+            npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js
+            yarn run build
           # start server --> verify running --> percy + chrome + cypress
           command: yarn run test:e2e:dist
           cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
@@ -480,7 +486,9 @@ workflows:
           yarn: true
           store_artifacts: false
           working_directory: platform/viewer
-          build: npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js yarn run build
+          build:
+            npx cross-env QUICK_BUILD=true APP_CONFIG=config/dicomweb-server.js
+            yarn run build
           # start server --> verify running --> percy + chrome + cypress
           command: yarn run test:e2e:dist
           cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'

Dockerfile

@@ -21,7 +21,7 @@
 
 # Stage 1: Build the application
 # docker build -t ohif/viewer:latest .
-FROM node:10.16.3-slim as builder
+FROM node:15.13.0-slim as builder
 
 RUN mkdir /usr/src/app
 WORKDIR /usr/src/app
@@ -39,6 +39,7 @@ COPY package.json /usr/src/app/package.json
 COPY postcss.config.js /usr/src/app/postcss.config.js
 COPY yarn.lock /usr/src/app/yarn.lock
 
+RUN apt-get update && apt-get install -y python make g++
 # Run the install before copying the rest of the files
 RUN yarn config set workspaces-experimental true
 RUN yarn install

README.md

@@ -121,8 +121,7 @@ window.config = {
 };
 ```
 
-- Install the viewer:
-  `window.OHIFViewer.installViewer(window.config);`
+- Install the viewer: `window.OHIFViewer.installViewer(window.config);`
 
 This exact setup is demonstrated in this
 [CodeSandbox](https://codesandbox.io/s/viewer-script-tag-tprch) and in our
@@ -259,6 +258,22 @@ Cancer Institute, Informatics Technology for Cancer Research (ITCR) program,
 under a
 [grant to Dr. Gordon Harris at Massachusetts General Hospital (U24 CA199460)](https://projectreporter.nih.gov/project_info_description.cfm?aid=8971104).
 
+## Projects that contributed to OHIF Viewer
+
+The following is a (partial) list of projects that contributed resources towards
+development of OHIF Viewer:
+
+- [NCI Imaging Data Commons (IDC) project](https://imaging.datacommons.cancer.gov/)
+  supported development of new features and bug fixes marked with
+  ["IDC:priority"](https://github.com/OHIF/Viewers/issues?q=is%3Aissue+is%3Aopen+label%3AIDC%3Apriority),
+  ["IDC:candidate"](https://github.com/OHIF/Viewers/issues?q=is%3Aissue+is%3Aopen+label%3AIDC%3Acandidate)
+  or
+  ["IDC:collaboration"](https://github.com/OHIF/Viewers/issues?q=is%3Aissue+is%3Aopen+label%3AIDC%3Acollaboration).
+  NCI Imaging Data Commons is supported by the contract number 19X037Q from
+  Leidos Biomedical Research under Task Order HHSN26100071 from NCI.
+  [IDC Viewer](https://learn.canceridc.dev/portal/visualization) is a customized
+  version of the OHIF Viewer.
+
 ## License
 
 MIT © [OHIF](https://github.com/OHIF)

docs/latest/book.json

@@ -8,7 +8,6 @@
     "-fontsettings",
     "github",
     "ga",
-    "sitemap",
     "anchors",
     "versions"
   ],
@@ -24,7 +23,8 @@
       "token": "UA-110573590-2"
     },
     "sitemap": {
-      "hostname": "https://docs.ohif.org"
+      "hostname": "https://docs.ohif.org",
+      "todo": "sitemap plugin removed; causing build errors"
     },
     "versions": {
       "gitbookConfigURL": "https://raw.githubusercontent.com/OHIF/Viewers/master/docs/book.json",

docs/v1/book.json

@@ -8,7 +8,6 @@
     "-fontsettings",
     "github",
     "ga",
-    "sitemap",
     "anchors",
     "versions"
   ],
@@ -24,7 +23,8 @@
       "token": "UA-110573590-2"
     },
     "sitemap": {
-      "hostname": "https://docs.ohif.org"
+      "hostname": "https://docs.ohif.org",
+      "todo": "sitemap plugin removed; causing build errors"
     },
     "versions": {
       "gitbookConfigURL": "https://raw.githubusercontent.com/OHIF/Viewers/master/docs/book.json",

extensions/cornerstone/CHANGELOG.md

@@ -3,6 +3,81 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.10.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.8...@ohif/extension-cornerstone@2.10.9) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [2.10.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.7...@ohif/extension-cornerstone@2.10.8) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.6...@ohif/extension-cornerstone@2.10.7) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.5...@ohif/extension-cornerstone@2.10.6) (2021-03-26)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.4...@ohif/extension-cornerstone@2.10.5) (2021-03-15)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.3...@ohif/extension-cornerstone@2.10.4) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.2...@ohif/extension-cornerstone@2.10.3) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.1...@ohif/extension-cornerstone@2.10.2) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [2.10.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.10.0...@ohif/extension-cornerstone@2.10.1) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
 # [2.10.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@2.9.6...@ohif/extension-cornerstone@2.10.0) (2020-12-10)
 
 

extensions/cornerstone/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-cornerstone",
-  "version": "2.10.0",
+  "version": "2.10.9",
   "description": "OHIF extension for Cornerstone",
   "author": "OHIF",
   "license": "MIT",
@@ -36,7 +36,7 @@
     "cornerstone-math": "^0.1.8",
     "cornerstone-tools": "^4.20.1",
     "cornerstone-wado-image-loader": "^3.1.0",
-    "dcmjs": "0.17.0",
+    "dcmjs": "0.18.8",
     "dicom-parser": "^1.8.3",
     "hammerjs": "^2.0.8",
     "prop-types": "^15.6.2",
@@ -51,6 +51,6 @@
     "classnames": "^2.2.6",
     "lodash.merge": "^4.6.2",
     "lodash.throttle": "^4.1.1",
-    "react-cornerstone-viewport": "4.0.4"
+    "react-cornerstone-viewport": "4.0.5"
   }
 }

extensions/cornerstone/src/OHIFCornerstoneViewport.js

@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 
+import OHIFCornerstoneViewportOverlay from './components/OHIFCornerstoneViewportOverlay'
 import ConnectedCornerstoneViewport from './ConnectedCornerstoneViewport';
 import OHIF from '@ohif/core';
 import PropTypes from 'prop-types';
@@ -179,7 +180,7 @@ class OHIFCornerstoneViewport extends Component {
 
     if (
       displaySet.displaySetInstanceUID !==
-      prevDisplaySet.displaySetInstanceUID ||
+        prevDisplaySet.displaySetInstanceUID ||
       displaySet.SOPInstanceUID !== prevDisplaySet.SOPInstanceUID ||
       displaySet.frameIndex !== prevDisplaySet.frameIndex
     ) {
@@ -194,6 +195,7 @@ class OHIFCornerstoneViewport extends Component {
       return null;
     }
     const { viewportIndex } = this.props;
+    const { inconsistencyWarnings } = this.props.viewportData.displaySet;
     const {
       imageIds,
       currentImageIdIndex,
@@ -229,14 +231,19 @@ class OHIFCornerstoneViewport extends Component {
       }
     };
 
+    const warningsOverlay = props => {
+      return <OHIFCornerstoneViewportOverlay {...props} inconsistencyWarnings={inconsistencyWarnings} />
+    };
+
     return (
       <>
         <ConnectedCornerstoneViewport
           viewportIndex={viewportIndex}
           imageIds={imageIds}
           imageIdIndex={currentImageIdIndex}
-          onNewImage={newImageHandler}
-          onNewImageDebounceTime={700}
+          onNewImageDebounced={newImageHandler}
+          onNewImageDebounceTime={300}
+          viewportOverlayComponent={warningsOverlay}
           // ~~ Connected (From REDUX)
           // frameRate={frameRate}
           // isPlaying={false}

extensions/cornerstone/src/commandsModule.js

@@ -268,6 +268,7 @@ const commandsModule = ({ servicesManager }) => {
       SOPInstanceUID,
       frameIndex,
       activeViewportIndex,
+      refreshViewports = true,
     }) => {
       const study = studyMetadataManager.get(StudyInstanceUID);
 
@@ -278,6 +279,10 @@ const commandsModule = ({ servicesManager }) => {
         );
       });
 
+      if (!displaySet) {
+        return;
+      }
+
       displaySet.SOPInstanceUID = SOPInstanceUID;
       displaySet.frameIndex = frameIndex;
 
@@ -285,7 +290,9 @@ const commandsModule = ({ servicesManager }) => {
         setViewportSpecificData(activeViewportIndex, displaySet)
       );
 
-      refreshCornerstoneViewports();
+      if (refreshViewports) {
+        refreshCornerstoneViewports();
+      }
     },
   };
 

extensions/cornerstone/src/components/OHIFCornerstoneViewportOverlay.css

@@ -0,0 +1,69 @@
+.imageViewerViewport.empty ~ .OHIFCornerstoneViewportOverlay {
+  display: none;
+}
+.OHIFCornerstoneViewportOverlay {
+  color: #9ccef9;
+}
+.OHIFCornerstoneViewportOverlay .overlay-element {
+  position: absolute;
+  font-weight: 400;
+  text-shadow: 1px 1px #000;
+  pointer-events: none;
+}
+.OHIFCornerstoneViewportOverlay .top-left {
+  top: 20px;
+  left: 20px;
+}
+.OHIFCornerstoneViewportOverlay .top-center {
+  top: 20px;
+  padding-top: 20px;
+  width: 100%;
+  text-align: center;
+}
+.OHIFCornerstoneViewportOverlay .top-right {
+  top: 20px;
+  right: 20px;
+  text-align: right;
+}
+.OHIFCornerstoneViewportOverlay .bottom-left {
+  bottom: 20px;
+  left: 20px;
+}
+.OHIFCornerstoneViewportOverlay .bottom-left2 {
+  bottom: 140px;
+  left: 20px;
+}
+.OHIFCornerstoneViewportOverlay .bottom-right {
+  bottom: 20px;
+  right: 20px;
+  text-align: right;
+}
+.OHIFCornerstoneViewportOverlay.controlsVisible .topright,
+.OHIFCornerstoneViewportOverlay.controlsVisible .bottomright {
+  right: calc(20px + 19px);
+}
+.OHIFCornerstoneViewportOverlay .warning {
+  position: absolute;
+  font-weight: 400;
+  text-shadow: 1px 1px #000;
+  pointer-events: inherit;
+}
+
+.OHIFCornerstoneViewportOverlay .warning svg {
+  opacity: 1;
+  color: #e29e4a;
+  fill: #e29e4a;
+  stroke: #e29e4a;
+  width: 32px;
+  height: 28px;
+}
+
+.OHIFCornerstoneViewportOverlay svg {
+  color: #9ccef9;
+  fill: #9ccef9;
+  stroke: #9ccef9;
+  background-color: transparent;
+  margin: 2px;
+  width: 18px;
+  height: 18px;
+}

extensions/cornerstone/src/components/OHIFCornerstoneViewportOverlay.js

@@ -0,0 +1,167 @@
+import { PureComponent } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
+import cornerstone from 'cornerstone-core';
+import './OHIFCornerstoneViewportOverlay.css';
+import {
+  isValidNumber,
+  formatNumberPrecision,
+  formatDICOMDate,
+  formatDICOMTime,
+  formatPN,
+  getCompression
+} from '../utils/formatStudy';
+import classNames from 'classnames';
+import { Icon } from '@ohif/ui/src/elements/Icon';
+import { Tooltip } from '@ohif/ui/src/components/tooltip';
+import { OverlayTrigger } from '@ohif/ui/src/components/overlayTrigger';
+
+class OHIFCornerstoneViewportOverlay extends PureComponent {
+  static propTypes = {
+    scale: PropTypes.number.isRequired,
+    windowWidth: PropTypes.oneOfType([
+      PropTypes.number.isRequired,
+      PropTypes.string.isRequired,
+    ]),
+    windowCenter: PropTypes.oneOfType([
+      PropTypes.number.isRequired,
+      PropTypes.string.isRequired,
+    ]),
+    imageId: PropTypes.string.isRequired,
+    imageIndex: PropTypes.number.isRequired,
+    stackSize: PropTypes.number.isRequired,
+    inconsistencyWarnings: PropTypes.array.isRequired
+  };
+
+  render() {
+    const { imageId, scale, windowWidth, windowCenter, inconsistencyWarnings } = this.props;
+
+    if (!imageId) {
+      return null;
+    }
+
+    const zoomPercentage = formatNumberPrecision(scale * 100, 0);
+    const seriesMetadata =
+      cornerstone.metaData.get('generalSeriesModule', imageId) || {};
+    const imagePlaneModule =
+      cornerstone.metaData.get('imagePlaneModule', imageId) || {};
+    const { rows, columns, sliceThickness, sliceLocation } = imagePlaneModule;
+    const { seriesNumber, seriesDescription } = seriesMetadata;
+
+    const generalStudyModule =
+      cornerstone.metaData.get('generalStudyModule', imageId) || {};
+    const { studyDate, studyTime, studyDescription } = generalStudyModule;
+
+    const patientModule =
+      cornerstone.metaData.get('patientModule', imageId) || {};
+    const { patientId, patientName } = patientModule;
+
+    const generalImageModule =
+      cornerstone.metaData.get('generalImageModule', imageId) || {};
+    const { instanceNumber } = generalImageModule;
+
+    const cineModule = cornerstone.metaData.get('cineModule', imageId) || {};
+    const { frameTime } = cineModule;
+
+    const frameRate = formatNumberPrecision(1000 / frameTime, 1);
+    const compression = getCompression(imageId);
+    const wwwc = `W: ${
+      windowWidth.toFixed ? windowWidth.toFixed(0) : windowWidth
+    } L: ${windowWidth.toFixed ? windowCenter.toFixed(0) : windowCenter}`;
+    const imageDimensions = `${columns} x ${rows}`;
+
+    const { imageIndex, stackSize } = this.props;
+
+    const inconsistencyWarningsOn = inconsistencyWarnings && inconsistencyWarnings.length !== 0 ? true : false;
+    const getWarningContent = (warningList) => {
+      if (Array.isArray(warningList)) {
+        const listedWarnings = warningList.map((warn, index) => {
+          return <li key={index}>{warn}</li>;
+        });
+
+        return <ol>{listedWarnings}</ol>;
+      } else {
+        return <React.Fragment>{warningList}</React.Fragment>;
+      }
+    };
+
+    const getWarningInfo = (seriesNumber, inconsistencyWarnings) => {
+      return(
+        <React.Fragment>
+        {inconsistencyWarnings.length != 0 ? (
+          <OverlayTrigger
+            key={seriesNumber}
+            placement="left"
+            overlay={
+              <Tooltip
+                placement="left"
+                className="in tooltip-warning"
+                id="tooltip-left"
+              >
+                <div className="warningTitle">Series Inconsistencies</div>
+                <div className="warningContent">{getWarningContent(inconsistencyWarnings)}</div>
+              </Tooltip>
+            }
+          >
+            <div className={classNames('warning')}>
+              <span className="warning-icon">
+                <Icon name="exclamation-triangle" />
+              </span>
+            </div>
+          </OverlayTrigger>
+        ) : (
+          <React.Fragment></React.Fragment>
+          )}
+      </React.Fragment>
+      );
+    };
+
+    const normal = (
+      <React.Fragment>
+        <div className="top-left overlay-element">
+          <div>{formatPN(patientName)}</div>
+          <div>{patientId}</div>
+        </div>
+        <div className="top-right overlay-element">
+          <div>{studyDescription}</div>
+          <div>
+            {formatDICOMDate(studyDate)} {formatDICOMTime(studyTime)}
+          </div>
+        </div>
+        <div className="bottom-right overlay-element">
+          <div>Zoom: {zoomPercentage}%</div>
+          <div>{wwwc}</div>
+          <div className="compressionIndicator">{compression}</div>
+        </div>
+        <div className="bottom-left2 warning">
+          <div>{inconsistencyWarningsOn ? getWarningInfo(seriesNumber, inconsistencyWarnings) : ''}</div>
+        </div>
+        <div className="bottom-left overlay-element">
+          <div>{seriesNumber >= 0 ? `Ser: ${seriesNumber}` : ''}</div>
+          <div>
+            {stackSize > 1
+              ? `Img: ${instanceNumber} ${imageIndex}/${stackSize}`
+              : ''}
+          </div>
+          <div>
+            {frameRate >= 0 ? `${formatNumberPrecision(frameRate, 2)} FPS` : ''}
+            <div>{imageDimensions}</div>
+            <div>
+              {isValidNumber(sliceLocation)
+                ? `Loc: ${formatNumberPrecision(sliceLocation, 2)} mm `
+                : ''}
+              {sliceThickness
+                ? `Thick: ${formatNumberPrecision(sliceThickness, 2)} mm`
+                : ''}
+            </div>
+            <div>{seriesDescription}</div>
+          </div>
+        </div>
+      </React.Fragment>
+    );
+
+    return <div className="OHIFCornerstoneViewportOverlay">{normal}</div>;
+  }
+}
+
+export default OHIFCornerstoneViewportOverlay;

extensions/cornerstone/src/index.js

@@ -38,7 +38,14 @@ export default {
   },
   getViewportModule({ commandsManager }) {
     const ExtendedOHIFCornerstoneViewport = props => {
+      /**
+       * TODO: This appears to be used to set the redux parameters for
+       * the viewport when new images are loaded. It's very ugly
+       * and we should remove it.
+       */
       const onNewImageHandler = jumpData => {
+        /** Do not trigger all viewports to render unnecessarily */
+        jumpData.refreshViewports = false;
         commandsManager.runCommand('jumpToImage', jumpData);
       };
       return (

extensions/cornerstone/src/utils/formatStudy.js

@@ -0,0 +1,109 @@
+import moment from 'moment';
+
+/**
+ * Checks if value is valid.
+ *
+ * @param {number} value
+ * @returns {boolean} is valid.
+ */
+function isValidNumber(value) {
+  return typeof value === 'number' && !isNaN(value);
+}
+
+/**
+ * Formats number precision.
+ *
+ * @param {number} number
+ * @param {number} precision
+ * @returns {number} formatted number.
+ */
+function formatNumberPrecision(number, precision) {
+  if (number !== null) {
+    return parseFloat(number).toFixed(precision);
+  }
+}
+
+/**
+ * Formats DICOM date.
+ *
+ * @param {string} date
+ * @param {string} strFormat
+ * @returns {string} formatted date.
+ */
+function formatDICOMDate(date, strFormat = 'MMM D, YYYY') {
+  return moment(date, 'YYYYMMDD').format(strFormat);
+}
+
+/**
+ *    DICOM Time is stored as HHmmss.SSS, where:
+ *      HH 24 hour time:
+ *        m mm        0..59   Minutes
+ *        s ss        0..59   Seconds
+ *        S SS SSS    0..999  Fractional seconds
+ *
+ *        Goal: '24:12:12'
+ *
+ * @param {*} time
+ * @param {string} strFormat
+ * @returns {string} formatted name.
+ */
+function formatDICOMTime(time, strFormat = 'HH:mm:ss') {
+  return moment(time, 'HH:mm:ss').format(strFormat);
+}
+
+/**
+ * Formats a patient name for display purposes
+ *
+ * @param {string} name
+ * @returns {string} formatted name.
+ */
+function formatPN(name) {
+  if (!name) {
+    return;
+  }
+
+  // Convert the first ^ to a ', '. String.replace() only affects
+  // the first appearance of the character.
+  const commaBetweenFirstAndLast = name.replace('^', ', ');
+
+  // Replace any remaining '^' characters with spaces
+  const cleaned = commaBetweenFirstAndLast.replace(/\^/g, ' ');
+
+  // Trim any extraneous whitespace
+  return cleaned.trim();
+}
+
+/**
+ * Gets compression type
+ *
+ * @param {number} imageId
+ * @returns {string} comrpession type.
+ */
+function getCompression(imageId) {
+  const generalImageModule =
+    cornerstone.metaData.get('generalImageModule', imageId) || {};
+  const {
+    lossyImageCompression,
+    lossyImageCompressionRatio,
+    lossyImageCompressionMethod,
+  } = generalImageModule;
+
+  if (lossyImageCompression === '01' && lossyImageCompressionRatio !== '') {
+    const compressionMethod = lossyImageCompressionMethod || 'Lossy: ';
+    const compressionRatio = formatNumberPrecision(
+      lossyImageCompressionRatio,
+      2
+    );
+    return compressionMethod + compressionRatio + ' : 1';
+  }
+
+  return 'Lossless / Uncompressed';
+}
+
+export { isValidNumber,
+  formatNumberPrecision,
+  formatDICOMDate,
+  formatDICOMTime,
+  formatPN,
+  getCompression
+};

extensions/debugging/CHANGELOG.md

@@ -3,6 +3,33 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.2.1...@ohif/extension-debugging@0.2.2) (2021-06-03)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+## [0.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.2.0...@ohif/extension-debugging@0.2.1) (2021-03-19)
+
+**Note:** Version bump only for package @ohif/extension-debugging
+
+
+
+
+
+# [0.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.1.6...@ohif/extension-debugging@0.2.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
 ## [0.1.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-debugging@0.1.5...@ohif/extension-debugging@0.1.6) (2020-10-06)
 
 **Note:** Version bump only for package @ohif/extension-debugging

extensions/debugging/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-debugging",
-  "version": "0.1.6",
+  "version": "0.2.2",
   "description": "OHIF extension for debugging.",
   "author": "OHIF",
   "license": "MIT",
@@ -28,13 +28,12 @@
   },
   "peerDependencies": {
     "@ohif/core": "^2.6.0",
-    "dicom-parser": "^1.8.3",
-    "dicomweb-client": "^0.5.2"
+    "dicom-parser": "^1.8.3"
   },
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "detect-browser": "5.1.1",
-    "dicomweb-client": "^0.6.0",
+    "dicomweb-client": "^0.8.1",
     "file-saver": "^2.0.2",
     "jszip": "^3.2.2"
   }

extensions/debugging/src/DebugReportModal.css

@@ -12,3 +12,15 @@
   display: flex;
   flex-direction: row;
 }
+
+.debug-report-modal-container .errors {
+  margin-top: 10px;
+}
+
+.debug-report-modal-container .errors-container {
+  border: 1px solid var(--active-color);
+  border-radius: 5px;
+  padding: 10px;
+  overflow: scroll;
+  max-height: 300px;
+}

extensions/debugging/src/DebugReportModal.js

@@ -10,6 +10,7 @@ const DubugReportModal = ({
   extensionManager,
   mailTo,
   debugModalMessage,
+  errors = [],
 }) => {
   const copyDebugDataToClipboard = () => {
     const body = getEmailBody();
@@ -131,6 +132,19 @@ const DubugReportModal = ({
           {getLayout(viewports)}
         </table>
       </div>
+      <div className="errors">
+        <h3>Errors ({errors.length})</h3>
+        <div className="errors-container">
+          {errors.map(error => {
+            return (
+              <div>
+                <pre>Message: {error.message}</pre>
+                {error.error && <pre>Stack: {error.error.stack}</pre>}
+              </div>
+            );
+          })}
+        </div>
+      </div>
     </div>
   );
 };

extensions/debugging/src/commandsModule.js

@@ -1,4 +1,6 @@
 import OHIF from '@ohif/core';
+import { useLogger } from '@ohif/ui';
+
 import {
   save,
   upload,
@@ -95,6 +97,7 @@ export function getCommands(context, servicesManager, extensionManager) {
       const { UIModalService } = servicesManager.services;
 
       const WrappedDebugReportModal = function() {
+        const { state: loggerState } = useLogger();
         return (
           <DebugReportModal
             viewports={viewports}
@@ -103,6 +106,7 @@ export function getCommands(context, servicesManager, extensionManager) {
             extensionManager={extensionManager}
             mailTo={state.mailTo}
             debugModalMessage={state.debugModalMessage}
+            errors={loggerState.errors}
           />
         );
       };

extensions/debugging/src/state.js

@@ -1,3 +1,3 @@
-const state = { mailTo: undefined, message: undefined };
+const state = { mailTo: undefined, debugModalMessage: undefined };
 
 export default state;

extensions/dicom-html/CHANGELOG.md

@@ -3,6 +3,89 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.3.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.9...@ohif/extension-dicom-html@1.3.10) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [1.3.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.8...@ohif/extension-dicom-html@1.3.9) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.7...@ohif/extension-dicom-html@1.3.8) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.6...@ohif/extension-dicom-html@1.3.7) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.5...@ohif/extension-dicom-html@1.3.6) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.4...@ohif/extension-dicom-html@1.3.5) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.3...@ohif/extension-dicom-html@1.3.4) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.2...@ohif/extension-dicom-html@1.3.3) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.1...@ohif/extension-dicom-html@1.3.2) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
+## [1.3.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.3.0...@ohif/extension-dicom-html@1.3.1) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-html
+
+
+
+
+
 # [1.3.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-html@1.2.9...@ohif/extension-dicom-html@1.3.0) (2020-12-10)
 
 

extensions/dicom-html/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-html",
-  "version": "1.3.0",
+  "version": "1.3.10",
   "description": "OHIF extension for rendering structured reports to HTML",
   "author": "OHIF",
   "license": "MIT",
@@ -29,7 +29,7 @@
   },
   "peerDependencies": {
     "@ohif/core": "^0.50.0",
-    "dcmjs": "0.17.0",
+    "dcmjs": "0.18.8",
     "prop-types": "^15.6.2",
     "react": "^16.8.6",
     "react-dom": "^16.8.6"

extensions/dicom-html/src/DicomHtmlViewport.js

@@ -168,6 +168,16 @@ const getContentSequence = (data, level = 1) => {
   Object.keys(data).forEach(key => {
     const value = data[key];
 
+    if (key === '_meta') {
+      const HeaderDynamicLevel = `h3`;
+      root.push(<hr />);
+      root.push(
+        <HeaderDynamicLevel key="Metadata">
+          DICOM File Meta Information
+        </HeaderDynamicLevel>
+      );
+    }
+
     let content;
     if (value instanceof Object) {
       content = getContentSequence(value, level + 1);
@@ -215,6 +225,7 @@ class DicomHtmlViewport extends Component {
     const dicomData = DicomMessage.readFile(arrayBuffer);
     const dataset = DicomMetaDictionary.naturalizeDataset(dicomData.dict);
     dataset._meta = DicomMetaDictionary.namifyDataset(dicomData.meta);
+    dataset._meta = DicomMetaDictionary.naturalizeDataset(dataset._meta);
 
     const mainData = getMainData(dataset);
     const contentSequence = getContentSequence(dataset);

extensions/dicom-html/src/OHIFDicomHtmlSopClassHandler.js

@@ -9,6 +9,7 @@ const SOP_CLASS_UIDS = {
   MAMMOGRAPHY_CAD_SR: '1.2.840.10008.5.1.4.1.1.88.50',
   CHEST_CAD_SR: '1.2.840.10008.5.1.4.1.1.88.65',
   X_RAY_RADIATION_DOSE_SR: '1.2.840.10008.5.1.4.1.1.88.67',
+  ACQUISITION_CONTEXT_SR_STORAGE: '1.2.840.10008.5.1.4.1.1.88.71',
 };
 
 const sopClassUIDs = Object.values(SOP_CLASS_UIDS);

extensions/dicom-microscopy/CHANGELOG.md

@@ -3,6 +3,25 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.52.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.4...@ohif/extension-dicom-microscopy@0.52.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [0.51.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.3...@ohif/extension-dicom-microscopy@0.51.4) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-microscopy
+
+
+
+
+
 ## [0.51.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-microscopy@0.51.2...@ohif/extension-dicom-microscopy@0.51.3) (2020-09-10)
 
 **Note:** Version bump only for package @ohif/extension-dicom-microscopy

extensions/dicom-microscopy/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-microscopy",
-  "version": "0.51.3",
+  "version": "0.52.0",
   "description": "OHIF extension for Dicom Microscopy",
   "author": "OHIF",
   "license": "MIT",

extensions/dicom-microscopy/src/DicomMicroscopyViewport.js

@@ -62,11 +62,30 @@ class DicomMicroscopyViewport extends Component {
         );
         const microscopyViewer = api.VLWholeSlideMicroscopyImageViewer;
 
-        this.viewer = new microscopyViewer({
-          client: dicomWebClient,
-          metadata,
-          retrieveRendered: false,
-        });
+        try {
+          this.viewer = new microscopyViewer({
+            client: dicomWebClient,
+            metadata,
+            retrieveRendered: false,
+          });
+        } catch (error) {
+          console.error('[Microscopy Viewer] Failed to load:', error);
+          const {
+            UINotificationService,
+            LoggerService,
+          } = this.props.servicesManager.services;
+          if (UINotificationService) {
+            const message =
+              'Failed to load viewport. Please check that you have hardware acceleration enabled.';
+            LoggerService.error({ error, message });
+            UINotificationService.show({
+              autoClose: false,
+              title: 'Microscopy Viewport',
+              message,
+              type: 'error',
+            });
+          }
+        }
 
         this.viewer.render({ container });
       });
@@ -92,8 +111,8 @@ class DicomMicroscopyViewport extends Component {
         {this.state.error ? (
           <h2>{JSON.stringify(this.state.error)}</h2>
         ) : (
-            <div style={style} ref={this.container} />
-          )}
+          <div style={style} ref={this.container} />
+        )}
       </div>
     );
   }

extensions/dicom-microscopy/src/index.js

@@ -6,14 +6,6 @@ const Component = React.lazy(() => {
   return import('./DicomMicroscopyViewport');
 });
 
-const DicomMicroscopyViewport = props => {
-  return (
-    <React.Suspense fallback={<div>Loading...</div>}>
-      <Component {...props} />
-    </React.Suspense>
-  );
-};
-
 export default {
   /**
    * Only required property. Should be a unique value across all extensions.
@@ -21,8 +13,14 @@ export default {
   id: 'microscopy',
   version,
 
-  getViewportModule() {
-    return DicomMicroscopyViewport;
+  getViewportModule({ servicesManager }) {
+    return props => {
+      return (
+        <React.Suspense fallback={<div>Loading...</div>}>
+          <Component {...props} servicesManager={servicesManager} />
+        </React.Suspense>
+      );
+    };
   },
   getSopClassHandlerModule() {
     return DicomMicroscopySopClassHandler;

extensions/dicom-rt/CHANGELOG.md

@@ -3,6 +3,105 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.6.13](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.12...@ohif/extension-dicom-rt@0.6.13) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [0.6.12](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.11...@ohif/extension-dicom-rt@0.6.12) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.10...@ohif/extension-dicom-rt@0.6.11) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.9...@ohif/extension-dicom-rt@0.6.10) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.8...@ohif/extension-dicom-rt@0.6.9) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.7...@ohif/extension-dicom-rt@0.6.8) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.6...@ohif/extension-dicom-rt@0.6.7) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.5...@ohif/extension-dicom-rt@0.6.6) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.4...@ohif/extension-dicom-rt@0.6.5) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.3...@ohif/extension-dicom-rt@0.6.4) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.2...@ohif/extension-dicom-rt@0.6.3) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
+## [0.6.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.1...@ohif/extension-dicom-rt@0.6.2) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-rt
+
+
+
+
+
 ## [0.6.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-rt@0.6.0...@ohif/extension-dicom-rt@0.6.1) (2020-12-10)
 
 

extensions/dicom-rt/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-rt",
-  "version": "0.6.1",
+  "version": "0.6.13",
   "description": "OHIF extension for rendering DICOM RTSTRUCTs on top of cornerstone images.",
   "author": "OHIF",
   "license": "MIT",
@@ -31,7 +31,7 @@
     "@ohif/core": "^0.50.0",
     "cornerstone-core": "^2.2.8",
     "cornerstone-tools": "^4.20.1",
-    "dcmjs": "0.17.0",
+    "dcmjs": "0.18.8",
     "gl-matrix": "^3.3.0",
     "prop-types": "^15.6.2",
     "react": "^16.8.6",

extensions/dicom-rt/src/OHIFDicomRTStructSopClassHandler.js

@@ -71,8 +71,8 @@ const OHIFDicomRTStructSopClassHandler = {
       }
     }
 
-    rtStructDisplaySet.getSourceDisplaySet = function (studies) {
-      return getSourceDisplaySet(studies, rtStructDisplaySet);
+    rtStructDisplaySet.getSourceDisplaySet = function (studies, activateLabelMap = true) {
+      return getSourceDisplaySet(studies, rtStructDisplaySet, activateLabelMap);
     };
 
     rtStructDisplaySet.load = function (referencedDisplaySet, studies) {

extensions/dicom-rt/src/components/PanelSection/PanelSection.css

@@ -39,6 +39,8 @@
   border-radius: 5px;
 }
 
-.icons .angle-double-down, .icons .angle-double-up {
+.icons .angle-double-down,
+.icons .angle-double-up {
   margin-left: 15px;
+  margin-right: -5px;
 }

extensions/dicom-rt/src/components/RTPanel/RTPanel.css

@@ -9,16 +9,21 @@
 
 .dcmrt-panel .dcmrt-panel-header {
   display: flex;
-  flex-direction: row;
+  flex-direction: column;
   justify-content: space-between;
   color: white;
 }
 
+.dcmrt-panel .dcmrt-panel-header h3 {
+  margin-top: 0;
+}
+
 .dcmrt-panel .dcmrt-panel-header .cog-icon {
   align-self: flex-end;
   color: var(--default-color);
   cursor: pointer;
-  margin-bottom: 20px;
+  min-height: 23px;
+  max-height: 23px;
 }
 
 .dcmrt-panel .dcmrt-panel-header .cog-icon:hover {

extensions/dicom-rt/src/components/RTPanel/RTPanel.js

@@ -44,7 +44,7 @@ const RTPanel = ({
   activeContexts = [],
   contexts = {},
   activeViewport,
-  getActiveViewport
+  getActiveViewport,
 }) => {
   const isVTK = () => activeContexts.includes(contexts.VTK);
   const isCornerstone = () => activeContexts.includes(contexts.CORNERSTONE);
@@ -55,7 +55,7 @@ const RTPanel = ({
     referencedDisplaysets: [],
     sets: [],
     selectedSet: null,
-    isLocked: false
+    isLocked: false,
   };
 
   const [state, setState] = useState(DEFAULT_STATE);
@@ -84,12 +84,17 @@ const RTPanel = ({
     document.addEventListener('extensiondicomrtrtloaded', updateStructureSets);
 
     return () => {
-      document.removeEventListener('extensiondicomrtrtloaded', updateStructureSets);
+      document.removeEventListener(
+        'extensiondicomrtrtloaded',
+        updateStructureSets
+      );
     };
   }, []);
 
   useEffect(() => {
-    const studyMetadata = studyMetadataManager.get(activeViewport.StudyInstanceUID);
+    const studyMetadata = studyMetadataManager.get(
+      activeViewport.StudyInstanceUID
+    );
     const referencedDisplaysets = studyMetadata.getDerivedDatasets({
       referencedSeriesInstanceUID: activeViewport.SeriesInstanceUID,
       Modality: 'RTSTRUCT',
@@ -235,7 +240,7 @@ const RTPanel = ({
   return (
     <div className="dcmrt-panel">
       <div className="dcmrt-panel-header">
-        <h3>RT Structure Sets</h3>
+        {' '}
         {!state.isLocked && (
           <Icon
             className="cog-icon"
@@ -245,71 +250,75 @@ const RTPanel = ({
             onClick={() => setShowSettings(true)}
           />
         )}
+        <h3>RT Structure Sets</h3>
       </div>
-      {!state.isLocked && !state.referencedDisplaysets.length && <LoadingIndicator expand height="70px" width="70px" />}
-      {state.sets && state.referencedDisplaysets.map(displaySet => {
-        const { SeriesInstanceUID, metadata, isLoaded } = displaySet;
+      {!state.isLocked && !state.referencedDisplaysets.length && (
+        <LoadingIndicator expand height="70px" width="70px" />
+      )}
+      {state.sets &&
+        state.referencedDisplaysets.map(displaySet => {
+          const { SeriesInstanceUID, metadata, isLoaded } = displaySet;
 
-        const module = cornerstoneTools.getModule('rtstruct');
-        const sets = module.getters.structuresSetsWhichReferenceSeriesInstanceUid(
-          activeViewport.SeriesInstanceUID
-        );
+          const module = cornerstoneTools.getModule('rtstruct');
+          const sets = module.getters.structuresSetsWhichReferenceSeriesInstanceUid(
+            activeViewport.SeriesInstanceUID
+          );
 
-        const loadedSet = sets.find(
-          set => set.SeriesInstanceUID === SeriesInstanceUID
-        );
+          const loadedSet = sets.find(
+            set => set.SeriesInstanceUID === SeriesInstanceUID
+          );
 
-        if (!loadedSet) return null;
+          if (!loadedSet) return null;
 
-        return (
-          <PanelSection
-            key={SeriesInstanceUID}
-            title={metadata.StructureSetLabel}
-            loading={!isLoaded || !loadedSet}
-            visible={isLoaded && loadedSet && loadedSet.visible}
-            hideVisibleButton={!isLoaded}
-            expanded={
-              isLoaded &&
-              loadedSet.SeriesInstanceUID ===
-              state.selectedSet.SeriesInstanceUID
-            }
-            onVisibilityChange={newVisibility => {
-              const module = cornerstoneTools.getModule('rtstruct');
-
-              if (newVisibility) {
-                module.setters.showStructureSet(loadedSet.SeriesInstanceUID);
-              } else {
-                module.setters.hideStructureSet(loadedSet.SeriesInstanceUID);
+          return (
+            <PanelSection
+              key={SeriesInstanceUID}
+              title={metadata.StructureSetLabel}
+              loading={!isLoaded || !loadedSet}
+              visible={isLoaded && loadedSet && loadedSet.visible}
+              hideVisibleButton={!isLoaded}
+              expanded={
+                isLoaded &&
+                loadedSet.SeriesInstanceUID ===
+                  state.selectedSet.SeriesInstanceUID
               }
-              const sets = module.getters.structuresSetsWhichReferenceSeriesInstanceUid(
-                activeViewport.SeriesInstanceUID
-              );
-              setState(state => ({ ...state, sets }));
-              refreshViewport();
-            }}
-            onExpandChange={async () => {
-              if (!isLoaded) {
-                await displaySet.load(activeViewport, studies);
+              onVisibilityChange={newVisibility => {
                 const module = cornerstoneTools.getModule('rtstruct');
+
+                if (newVisibility) {
+                  module.setters.showStructureSet(loadedSet.SeriesInstanceUID);
+                } else {
+                  module.setters.hideStructureSet(loadedSet.SeriesInstanceUID);
+                }
                 const sets = module.getters.structuresSetsWhichReferenceSeriesInstanceUid(
                   activeViewport.SeriesInstanceUID
                 );
-                const selectedSet = sets.find(
-                  set => set.SeriesInstanceUID === SeriesInstanceUID
-                );
-                setState(state => ({ ...state, selectedSet, sets }));
-              }
-            }}
-          >
-            <ScrollableArea>
-              <TableList headless>
-                {isLoaded &&
-                  loadedSet.ROIContours.map(c => toContourItem(c, loadedSet))}
-              </TableList>
-            </ScrollableArea>
-          </PanelSection>
-        );
-      })}
+                setState(state => ({ ...state, sets }));
+                refreshViewport();
+              }}
+              onExpandChange={async () => {
+                if (!isLoaded) {
+                  await displaySet.load(activeViewport, studies);
+                  const module = cornerstoneTools.getModule('rtstruct');
+                  const sets = module.getters.structuresSetsWhichReferenceSeriesInstanceUid(
+                    activeViewport.SeriesInstanceUID
+                  );
+                  const selectedSet = sets.find(
+                    set => set.SeriesInstanceUID === SeriesInstanceUID
+                  );
+                  setState(state => ({ ...state, selectedSet, sets }));
+                }
+              }}
+            >
+              <ScrollableArea>
+                <TableList headless>
+                  {isLoaded &&
+                    loadedSet.ROIContours.map(c => toContourItem(c, loadedSet))}
+                </TableList>
+              </ScrollableArea>
+            </PanelSection>
+          );
+        })}
     </div>
   );
 };

extensions/dicom-rt/src/getSourceDisplaySet.js

@@ -1,38 +1,14 @@
-export default function getSourceDisplaySet(studies, rtStructDisplaySet) {
-  const referencedDisplaySet = _getReferencedDisplaySet(
+import { metadata } from '@ohif/core';
+
+export default function getSourceDisplaySet(studies, rtStructDisplaySet, activateLabelMap = true) {
+  const referencedDisplaySet = metadata.StudyMetadata.getReferencedDisplaySet(
     rtStructDisplaySet,
     studies
   );
 
-  rtStructDisplaySet.load(referencedDisplaySet, studies);
+  if (activateLabelMap) {
+    rtStructDisplaySet.load(referencedDisplaySet, studies);
+  }
 
   return referencedDisplaySet;
 }
-
-const _getReferencedDisplaySet = (rtStructDisplaySet, studies) => {
-  let allDisplaySets = [];
-
-  studies.forEach(study => {
-    allDisplaySets = allDisplaySets.concat(study.displaySets);
-  });
-
-  const otherDisplaySets = allDisplaySets.filter(
-    ds => ds.displaySetInstanceUID !== rtStructDisplaySet.displaySetInstanceUID
-  );
-
-  const ReferencedSeriesSequence = Array.isArray(
-    rtStructDisplaySet.metadata.ReferencedSeriesSequence
-  )
-    ? rtStructDisplaySet.metadata.ReferencedSeriesSequence
-    : [rtStructDisplaySet.metadata.ReferencedSeriesSequence];
-
-  const referencedSeriesInstanceUIDs = ReferencedSeriesSequence.map(
-    ReferencedSeries => ReferencedSeries.SeriesInstanceUID
-  );
-
-  const referencedDisplaySet = otherDisplaySets.find(ds =>
-    referencedSeriesInstanceUIDs.includes(ds.SeriesInstanceUID)
-  );
-
-  return referencedDisplaySet;
-};

extensions/dicom-rt/src/index.js

@@ -5,6 +5,9 @@ import id from './id.js';
 import RTPanel from './components/RTPanel/RTPanel';
 import { version } from '../package.json';
 
+import { utils } from '@ohif/core';
+const { studyMetadataManager } = utils;
+
 export default {
   /**
    * Only required property. Should be a unique value across all extensions.
@@ -45,24 +48,34 @@ export default {
           icon: 'list',
           label: 'RTSTRUCT',
           target: 'rt-panel',
-          isDisabled: studies => {
+          isDisabled: (studies, activeViewport) => {
             if (!studies) {
               return true;
             }
 
-            for (let i = 0; i < studies.length; i++) {
-              const study = studies[i];
-
-              if (study && study.series) {
-                for (let j = 0; j < study.series.length; j++) {
-                  const series = study.series[j];
-                  if (
-                    /* Could be expanded to contain RTPLAN and RTDOSE information in the future */
-                    ['RTSTRUCT'].includes(series.Modality)
-                  ) {
-                    return false;
-                  }
-                }
+            if (activeViewport) {
+              const study = studies.find(
+                s => s.StudyInstanceUID === activeViewport.StudyInstanceUID
+              );
+              const ds = study.displaySets.find(
+                ds =>
+                  ds.displaySetInstanceUID ===
+                  activeViewport.displaySetInstanceUID
+              );
+              const studyMetadata = studyMetadataManager.get(
+                activeViewport.StudyInstanceUID
+              );
+              const referencedDisplaySets = studyMetadata.getDerivedDatasets({
+                referencedSeriesInstanceUID: activeViewport.SeriesInstanceUID,
+                Modality: 'RTSTRUCT',
+              });
+              if (
+                referencedDisplaySets &&
+                referencedDisplaySets.some(ds =>
+                  ['RTSTRUCT'].includes(ds.Modality)
+                )
+              ) {
+                return false;
               }
             }
 

extensions/dicom-segmentation/CHANGELOG.md

@@ -3,6 +3,132 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.6.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.9...@ohif/extension-dicom-segmentation@0.6.10) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [0.6.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.8...@ohif/extension-dicom-segmentation@0.6.9) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.7...@ohif/extension-dicom-segmentation@0.6.8) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.6...@ohif/extension-dicom-segmentation@0.6.7) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.5...@ohif/extension-dicom-segmentation@0.6.6) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.4...@ohif/extension-dicom-segmentation@0.6.5) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.3...@ohif/extension-dicom-segmentation@0.6.4) (2021-04-16)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.2...@ohif/extension-dicom-segmentation@0.6.3) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.1...@ohif/extension-dicom-segmentation@0.6.2) (2021-03-31)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.6.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.6.0...@ohif/extension-dicom-segmentation@0.6.1) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+# [0.6.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.5.4...@ohif/extension-dicom-segmentation@0.6.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [0.5.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.5.3...@ohif/extension-dicom-segmentation@0.5.4) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.5.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.5.2...@ohif/extension-dicom-segmentation@0.5.3) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.5.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.5.1...@ohif/extension-dicom-segmentation@0.5.2) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
+## [0.5.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.5.0...@ohif/extension-dicom-segmentation@0.5.1) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-segmentation
+
+
+
+
+
 # [0.5.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-segmentation@0.4.7...@ohif/extension-dicom-segmentation@0.5.0) (2020-12-10)
 
 

extensions/dicom-segmentation/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-segmentation",
-  "version": "0.5.0",
+  "version": "0.6.10",
   "description": "OHIF extension for viewing segmentations in the 2D MPR view",
   "author": "OHIF",
   "license": "MIT",
@@ -31,7 +31,7 @@
     "@ohif/core": "^0.50.0",
     "cornerstone-core": "^2.2.8",
     "cornerstone-tools": "^4.20.1",
-    "dcmjs": "0.17.0",
+    "dcmjs": "0.18.8",
     "prop-types": "^15.6.2",
     "react": "^16.8.6",
     "react-dom": "^16.8.6"

extensions/dicom-segmentation/src/components/SegmentItem/SegmentItem.js

@@ -24,7 +24,7 @@ const SegmentItem = ({
   onClick,
   itemClass,
   color,
-  visible = true,
+  visible,
   onVisibilityChange,
 }) => {
   const [isVisible, setIsVisible] = useState(visible);
@@ -33,6 +33,15 @@ const SegmentItem = ({
     setIsVisible(visible);
   }, [visible]);
 
+  const onClickHandler = () => onClick(index);
+
+  const onVisibilityChangeHandler = event => {
+    event.stopPropagation();
+    const newVisibility = !isVisible;
+    setIsVisible(newVisibility);
+    onVisibilityChange(newVisibility, index);
+  };
+
   return (
     <div className="dcmseg-segment-item">
       <TableListItem
@@ -42,7 +51,7 @@ const SegmentItem = ({
         itemClass={itemClass}
         itemMeta={<ColoredCircle color={color} />}
         itemMetaClass="segment-color-section"
-        onItemClick={onClick}
+        onItemClick={onClickHandler}
       >
         <div>
           <div className="segment-label" style={{ marginBottom: 4 }}>
@@ -63,12 +72,7 @@ const SegmentItem = ({
               name={isVisible ? 'eye' : 'eye-closed'}
               width="20px"
               height="20px"
-              onClick={event => {
-                event.stopPropagation();
-                const newVisibility = !isVisible;
-                setIsVisible(newVisibility);
-                onVisibilityChange(newVisibility);
-              }}
+              onClick={onVisibilityChangeHandler}
             />
           </div>
           {false && <div className="segment-info">{'...'}</div>}

extensions/dicom-segmentation/src/components/SegmentationPanel/SegmentationPanel.css

@@ -6,6 +6,7 @@
   width: 100%;
   display: flex;
   flex-direction: column;
+  padding: 20px;
 }
 
 .dcmseg-segmentation-panel.disabled {
@@ -14,19 +15,19 @@
 }
 
 .dcmseg-segmentation-panel h3 {
-  padding-left: 20px;
   margin-top: 0;
 }
 
 .dcmseg-segmentation-panel .segmentations {
-  padding: 0 20px 20px 20px;
+  padding-bottom: 10px;
 }
 
 .dcmseg-segmentation-panel .cog-icon {
-  margin: 20px 20px 0 0;
   align-self: flex-end;
   color: var(--default-color);
   cursor: pointer;
+  min-height: 23px;
+  max-height: 23px;
 }
 
 .dcmseg-segmentation-panel .cog-icon:hover {
@@ -48,11 +49,11 @@
   height: 150px;
 }
 
-.dcmseg-segmentation-panel .selector-form>div {
+.dcmseg-segmentation-panel .selector-form > div {
   width: 100%;
 }
 
-.dcmseg-segmentation-panel .selector-form>div:first-of-type {
+.dcmseg-segmentation-panel .selector-form > div:first-of-type {
   display: flex;
   flex-direction: row;
   justify-content: center;
@@ -64,3 +65,61 @@
   flex: unset;
   margin-right: 16px;
 }
+
+.SegmentsSection {
+  display: flex;
+  flex-direction: column;
+  color: var(--text-primary-color);
+  font-size: 12px;
+  margin-bottom: 0px;
+  height: 100%;
+}
+
+.SegmentsSection .header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  background-color: var(--ui-gray-dark);
+  border-radius: 5px;
+  font-weight: bold;
+  padding: 10px 15px;
+}
+
+.SegmentsSection .count {
+  font-size: 15px;
+  color: var(--active-color);
+  margin-left: 15px;
+  border-radius: 5px;
+  background-color: var(--ui-gray-darker);
+  text-align: center;
+  min-width: 25px;
+}
+
+.SegmentsSection .header .eye-icon,
+.SegmentsSection .header .angle-double-down,
+.SegmentsSection .header .angle-double-up {
+  cursor: pointer;
+  color: var(--active-color);
+}
+
+.SegmentsSection .header .eye-icon:hover,
+.SegmentsSection .header .angle-double-down:hover,
+.SegmentsSection .header .angle-double-up:hover {
+  color: var(--hover-color);
+}
+
+.SegmentsSection .header .eye-icon.expanded {
+  color: var(--default-color);
+}
+
+.SegmentsSection .header .icons {
+  display: flex;
+  align-items: center;
+  border-radius: 5px;
+}
+
+.SegmentsSection .header .icons .angle-double-down,
+.SegmentsSection .header .icons .angle-double-up {
+  margin-left: 15px;
+}

extensions/dicom-segmentation/src/components/SegmentationSelect.js

@@ -3,7 +3,7 @@ import Select from 'react-select';
 
 const SegmentationSelect = ({ value, formatOptionLabel, options }) => (
   <Select
-    value={value}
+    value={value === undefined ? null : value}
     formatOptionLabel={formatOptionLabel}
     styles={segmentationSelectStyles}
     options={options}

extensions/dicom-segmentation/src/getOHIFDicomSegSopClassHandler.js

@@ -21,7 +21,7 @@ export default function getSopClassHandlerModule({ servicesManager }) {
     id: 'OHIFDicomSegSopClassHandler',
     type: MODULE_TYPES.SOP_CLASS_HANDLER,
     sopClassUIDs,
-    getDisplaySetFromSeries: function (
+    getDisplaySetFromSeries: function(
       series,
       study,
       dicomWebClient,
@@ -55,6 +55,8 @@ export default function getSopClassHandlerModule({ servicesManager }) {
         referencedDisplaySetUID: null, // Assigned when loaded.
         labelmapIndex: null, // Assigned when loaded.
         isLoaded: false,
+        loadError: false,
+        hasOverlapping: false,
         SeriesDate,
         SeriesTime,
         SeriesNumber,
@@ -62,11 +64,11 @@ export default function getSopClassHandlerModule({ servicesManager }) {
         metadata,
       };
 
-      segDisplaySet.getSourceDisplaySet = function (studies) {
-        return getSourceDisplaySet(studies, segDisplaySet);
+      segDisplaySet.getSourceDisplaySet = function(studies, activateLabelMap = true, onDisplaySetLoadFailureHandler) {
+        return getSourceDisplaySet(studies, segDisplaySet, activateLabelMap, onDisplaySetLoadFailureHandler);
       };
 
-      segDisplaySet.load = async function (referencedDisplaySet, studies) {
+      segDisplaySet.load = async function(referencedDisplaySet, studies) {
         segDisplaySet.isLoaded = true;
         const { StudyInstanceUID } = referencedDisplaySet;
         const segArrayBuffer = await DicomLoaderService.findDicomDataPromise(
@@ -81,28 +83,50 @@ export default function getSopClassHandlerModule({ servicesManager }) {
           StudyInstanceUID,
           referencedDisplaySet.SeriesInstanceUID
         );
-        return new Promise((resolve, reject) => {
-          let results;
-          try {
-            results = _parseSeg(segArrayBuffer, imageIds);
-          } catch (error) {
-            segDisplaySet.isLoaded = false;
-            segDisplaySet.loadError = true;
-            reject(error);
-          }
-          const { labelmapBufferArray, segMetadata, segmentsOnFrame, segmentsOnFrameArray } = results;
 
-          if (labelmapBufferArray.length > 1) {
-            for (let i = 0; i < labelmapBufferArray.length; ++i) {
-              loadSegmentation(imageIds, segDisplaySet, labelmapBufferArray[i], segMetadata, segmentsOnFrame, segmentsOnFrameArray[i]);
-            }
-          } else {
-            loadSegmentation(imageIds, segDisplaySet, labelmapBufferArray[0], segMetadata, segmentsOnFrame, []);
+        const results = await _parseSeg(segArrayBuffer, imageIds);
+        if (results === undefined) {
+          return;
+        }
+        const {
+          labelmapBufferArray,
+          segMetadata,
+          segmentsOnFrame,
+          segmentsOnFrameArray,
+        } = results;
+        let labelmapIndex;
+        if (labelmapBufferArray.length > 1) {
+          let labelmapIndexes = [];
+          for (let i = 0; i < labelmapBufferArray.length; ++i) {
+            labelmapIndexes.push(
+              await loadSegmentation(
+                imageIds,
+                segDisplaySet,
+                labelmapBufferArray[i],
+                segMetadata,
+                segmentsOnFrame,
+                segmentsOnFrameArray[i]
+              )
+            );
           }
-          segDisplaySet.labelmapIndex = 0;
-
-          resolve();
-        });
+          /**
+           * Since overlapping segments have virtual labelmaps,
+           * originLabelMapIndex is used in the panel to select the correct dropdown value.
+           */
+          segDisplaySet.hasOverlapping = true;
+          segDisplaySet.originLabelMapIndex = labelmapIndexes[0];
+          labelmapIndex = labelmapIndexes[0];
+          console.warn('Overlapping segments!');
+        } else {
+          labelmapIndex = await loadSegmentation(
+            imageIds,
+            segDisplaySet,
+            labelmapBufferArray[0],
+            segMetadata,
+            segmentsOnFrame,
+            []
+          );
+        }
       };
 
       return segDisplaySet;

extensions/dicom-segmentation/src/getSourceDisplaySet.js

@@ -1,88 +1,16 @@
 import setActiveLabelmap from './utils/setActiveLabelMap';
-import { classes } from '@ohif/core';
+import { metadata } from '@ohif/core';
 
-const { ImageSet } = classes;
+export default function getSourceDisplaySet(studies, segDisplaySet, activateLabelMap = true, onDisplaySetLoadFailureHandler) {
+  const referencedDisplaySet = metadata.StudyMetadata.getReferencedDisplaySet(segDisplaySet, studies);
 
-export default function getSourceDisplaySet(studies, segDisplaySet) {
-  const referencedDisplaySet = _getReferencedDisplaySet(segDisplaySet, studies);
-
-  setActiveLabelmap(referencedDisplaySet, studies, segDisplaySet);
-
-  return referencedDisplaySet;
-}
-
-const _getReferencedDisplaySet = (segDisplaySet, studies) => {
-  let allDisplaySets = [];
-
-  studies.forEach(study => {
-    allDisplaySets = allDisplaySets.concat(study.displaySets);
-  });
-
-  const otherDisplaySets = allDisplaySets.filter(
-    ds => ds.displaySetInstanceUID !== segDisplaySet.displaySetInstanceUID
-  );
-
-  const { metadata } = segDisplaySet;
-
-  let referencedSeriesInstanceUIDs;
-
-  if (metadata.ReferencedSeriesSequence) {
-    const ReferencedSeriesSequence = _toArray(
-      metadata.ReferencedSeriesSequence
-    );
-
-    referencedSeriesInstanceUIDs = ReferencedSeriesSequence.map(
-      ReferencedSeries => ReferencedSeries.SeriesInstanceUID
-    );
-  } else {
-    const { PerFrameFunctionalGroupsSequence } = metadata;
-
-    let SourceImageSequence;
-
-    if (metadata.SourceImageSequence) {
-      SourceImageSequence = metadata.SourceImageSequence;
-    } else {
-      const firstFunctionalGroups = _toArray(
-        PerFrameFunctionalGroupsSequence
-      )[0];
-      const { DerivationImageSequence } = firstFunctionalGroups;
-
-      SourceImageSequence = DerivationImageSequence;
-    }
-
-    const firstSourceImage = _toArray(SourceImageSequence)[0];
-
-    const { ReferencedSOPInstanceUID } = firstSourceImage;
-
-    referencedSeriesInstanceUIDs = _findReferencedSeriesInstanceUIDsFromSOPInstanceUID(
-      otherDisplaySets,
-      ReferencedSOPInstanceUID
-    );
+  let activatedLabelmapPromise;
+  if (activateLabelMap) {
+    activatedLabelmapPromise = setActiveLabelmap(referencedDisplaySet, studies, segDisplaySet, undefined, onDisplaySetLoadFailureHandler);
   }
 
-  const referencedDisplaySet = otherDisplaySets.find(ds =>
-    referencedSeriesInstanceUIDs.includes(ds.SeriesInstanceUID)
-  );
-
-  return referencedDisplaySet;
-};
-
-const _findReferencedSeriesInstanceUIDsFromSOPInstanceUID = (
-  displaySets,
-  SOPInstanceUID
-) => {
-  const imageSets = displaySets.filter(ds => ds instanceof ImageSet);
-
-  for (let i = 0; i < imageSets.length; i++) {
-    const { images } = imageSets[i];
-    for (let j = 0; j < images.length; j++) {
-      if (images[j].SOPInstanceUID === SOPInstanceUID) {
-        return [images[j].getData().metadata.SeriesInstanceUID];
-      }
-    }
+  return {
+    referencedDisplaySet : referencedDisplaySet,
+    activatedLabelmapPromise : activatedLabelmapPromise
   }
-};
-
-function _toArray(arrayOrObject) {
-  return Array.isArray(arrayOrObject) ? arrayOrObject : [arrayOrObject];
 }

extensions/dicom-segmentation/src/index.js

@@ -25,12 +25,13 @@ export default {
     return toolbarModule;
   },
   getPanelModule({ commandsManager, api, servicesManager }) {
-    const { UINotificationService } = servicesManager.services;
+    const { UINotificationService, LoggerService } = servicesManager.services;
 
     const ExtendedSegmentationPanel = props => {
       const { activeContexts } = api.hooks.useAppContext();
 
       const onDisplaySetLoadFailureHandler = error => {
+        LoggerService.error({ error, message: error.message });
         UINotificationService.show({
           title: 'DICOM Segmentation Loader',
           message: error.message,

extensions/dicom-segmentation/src/loadSegmentation.js

@@ -34,7 +34,11 @@ export default async function loadSegmentation(
    * Cache each labelmap segments.
    * This data is used to determine the active label map when a given segment is activated/clicked.
    */
-  segDisplaySet.labelmapSegments[labelmapIndex] = labelmapSegments.length ? Array.from(new Set(labelmapSegments.filter(a => !!a).reduce((a, b) => a.concat(b)))) : [];
+  segDisplaySet.labelmapSegments[labelmapIndex] = labelmapSegments.length
+    ? Array.from(
+        new Set(labelmapSegments.filter(a => !!a).reduce((a, b) => a.concat(b)))
+      )
+    : [];
   segDisplaySet.labelmapIndex = labelmapIndex;
 
   /*
@@ -57,6 +61,8 @@ export default async function loadSegmentation(
   console.log('Segmentation loaded.');
   const event = new CustomEvent('extensiondicomsegmentationsegloaded');
   document.dispatchEvent(event);
+
+  return labelmapIndex;
 }
 
 function _getNextLabelmapIndex(firstImageId) {

extensions/dicom-segmentation/src/utils/setActiveLabelMap.js

@@ -20,7 +20,7 @@ export default async function setActiveLabelmap(
   displaySet,
   callback = () => {},
   onDisplaySetLoadFailure = err => {
-    throw new Error(err.message);
+    console.error(err.message);
   }
 ) {
   const studyMetadata = studyMetadataManager.get(
@@ -37,31 +37,43 @@ export default async function setActiveLabelmap(
     ? brushStackState.activeLabelmapIndex
     : undefined;
 
-  if (displaySet.labelmapIndex === activeLabelmapIndex) {
+  let labelmapIndex =
+    displaySet.hasOverlapping === true
+      ? displaySet.originLabelMapIndex
+      : displaySet.labelmapIndex;
+
+  if (labelmapIndex === activeLabelmapIndex) {
     log.warn(`${activeLabelmapIndex} is already the active labelmap`);
-    return displaySet.labelmapIndex;
+    return labelmapIndex;
   }
 
   if (!displaySet.isLoaded) {
-    const loadPromise = displaySet.load(referencedDisplaySet, studies);
-
-    loadPromise.catch(error => {
+    try {
+      await displaySet.load(referencedDisplaySet, studies);
+    } catch (error) {
+      displaySet.isLoaded = false;
+      displaySet.loadError = true;
       onDisplaySetLoadFailure(error);
 
-      // Return old index.
-      return activeLabelmapIndex;
-    });
-
-    await loadPromise;
+      return -1;
+    }
   }
 
+  labelmapIndex =
+    displaySet.hasOverlapping === true
+      ? displaySet.originLabelMapIndex
+      : displaySet.labelmapIndex;
+
   // This might have just been created, so need to use the non-cached value.
   state = cornerstoneTools.getModule('segmentation').state;
+
   brushStackState = state.series[firstImageId];
-  brushStackState.activeLabelmapIndex = displaySet.labelmapIndex;
+  if (brushStackState) {
+    brushStackState.activeLabelmapIndex = labelmapIndex;
+  }
 
   refreshViewports();
   callback();
 
-  return displaySet.labelmapIndex;
+  return labelmapIndex;
 }

extensions/dicom-tag-browser/CHANGELOG.md

@@ -3,6 +3,97 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.2.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.10...@ohif/extension-dicom-tag-browser@0.2.11) (2021-06-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.9...@ohif/extension-dicom-tag-browser@0.2.10) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [0.2.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.8...@ohif/extension-dicom-tag-browser@0.2.9) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.7...@ohif/extension-dicom-tag-browser@0.2.8) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.6...@ohif/extension-dicom-tag-browser@0.2.7) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.5...@ohif/extension-dicom-tag-browser@0.2.6) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.4...@ohif/extension-dicom-tag-browser@0.2.5) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.3...@ohif/extension-dicom-tag-browser@0.2.4) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.2...@ohif/extension-dicom-tag-browser@0.2.3) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.1...@ohif/extension-dicom-tag-browser@0.2.2) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
+## [0.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.2.0...@ohif/extension-dicom-tag-browser@0.2.1) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-dicom-tag-browser
+
+
+
+
+
 # [0.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-dicom-tag-browser@0.1.1...@ohif/extension-dicom-tag-browser@0.2.0) (2020-12-10)
 
 

extensions/dicom-tag-browser/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-dicom-tag-browser",
-  "version": "0.2.0",
+  "version": "0.2.11",
   "description": "OHIF extension for checking DICOM headers.",
   "author": "OHIF",
   "license": "MIT",
@@ -28,12 +28,12 @@
   },
   "peerDependencies": {
     "@ohif/core": "^2.6.0",
-    "dcmjs": "0.17.0",
+    "dcmjs": "0.18.8",
     "react": "^16.8.6"
   },
   "dependencies": {
     "@babel/runtime": "^7.5.5",
-    "dicomweb-client": "^0.6.0",
+    "dicomweb-client": "^0.8.1",
     "moment": "2.24.0",
     "react-select": "^3.0.8"
   }

extensions/dicom-tag-browser/src/components/DicomTagBrowser.css

@@ -3,6 +3,11 @@
   margin-left: auto;
 }
 
+.dicom-tag-browser-table-wrapper {
+  height: 500px;
+  overflow-y: scroll;
+}
+
 .dicom-tag-browser-table tr {
   padding-left: 10px;
   padding-right: 10px;
@@ -11,6 +16,20 @@
   white-space: nowrap;
 }
 
+.dicom-tag-browser-content {
+  overflow: hidden;
+  width: 100%;
+  padding-bottom: 50px;
+}
+
+.dicom-tag-browser-instance-range .range {
+  height: 20px;
+}
+
+.dicom-tag-browser-instance-range {
+  padding: 20px 0 20px 0;
+}
+
 .dicom-tag-browser-table td.dicom-tag-browser-table-center {
   text-align: center;
 }

extensions/dicom-tag-browser/src/components/DicomTagBrowser.js

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import { classes, cornerstone as OHIFCornerstone } from '@ohif/core';
+import { Range } from '@ohif/ui';
 import dcmjs from 'dcmjs';
 import DicomBrowserSelect from './DicomBrowserSelect';
 import moment from 'moment';
@@ -99,26 +100,35 @@ const DicomTagBrowser = ({ displaySets, displaySetInstanceUID }) => {
   let instanceSelectList = null;
 
   if (isImageStack) {
-    const selectedInstanceValue = instanceList[activeInstance];
-
     instanceSelectList = (
-      <DicomBrowserSelect
-        value={selectedInstanceValue}
-        formatOptionLabel={DicomBrowserSelectItem}
-        options={instanceList}
-      />
+      <div className="dicom-tag-browser-instance-range">
+        <Range
+          showValue
+          step={1}
+          min={1}
+          max={instanceList.length - 1}
+          value={activeInstance}
+          valueRenderer={value => <p>Instance Number: {value}</p>}
+          onChange={({ target }) => {
+            const instanceIndex = parseInt(target.value);
+            setActiveInstance(instanceIndex);
+          }}
+        />
+      </div>
     );
   }
 
   return (
-    <div>
+    <div className="dicom-tag-browser-content">
       <DicomBrowserSelect
         value={selectedDisplaySetValue}
         formatOptionLabel={DicomBrowserSelectItem}
         options={displaySetList}
       />
       {instanceSelectList}
-      <DicomTagTable tags={tags} meta={meta}></DicomTagTable>
+      <div className="dicom-tag-browser-table-wrapper">
+        <DicomTagTable tags={tags} meta={meta}></DicomTagTable>
+      </div>
     </div>
   );
 };
@@ -127,30 +137,28 @@ function DicomTagTable({ tags, meta }) {
   const rows = getFormattedRowsFromTags(tags, meta);
 
   return (
-    <div>
-      <table className="dicom-tag-browser-table">
-        <tbody>
-          <tr>
-            <th className="dicom-tag-browser-table-left">Tag</th>
-            <th className="dicom-tag-browser-table-left">Value Representation</th>
-            <th className="dicom-tag-browser-table-left">Keyword</th>
-            <th className="dicom-tag-browser-table-left">Value</th>
-          </tr>
-          {rows.map((row, index) => {
-            const className = row.className ? row.className : null;
+    <table className="dicom-tag-browser-table">
+      <tbody>
+        <tr>
+          <th className="dicom-tag-browser-table-left">Tag</th>
+          <th className="dicom-tag-browser-table-left">Value Representation</th>
+          <th className="dicom-tag-browser-table-left">Keyword</th>
+          <th className="dicom-tag-browser-table-left">Value</th>
+        </tr>
+        {rows.map((row, index) => {
+          const className = row.className ? row.className : null;
 
-            return (
-              <tr className={className} key={`DICOMTagRow-${index}`}>
-                <td>{row[0]}</td>
-                <td className="dicom-tag-browser-table-center">{row[1]}</td>
-                <td>{row[2]}</td>
-                <td>{row[3]}</td>
-              </tr>
-            );
-          })}
-        </tbody>
-      </table>
-    </div>
+          return (
+            <tr className={className} key={`DICOMTagRow-${index}`}>
+              <td>{row[0]}</td>
+              <td className="dicom-tag-browser-table-center">{row[1]}</td>
+              <td>{row[2]}</td>
+              <td>{row[3]}</td>
+            </tr>
+          );
+        })}
+      </tbody>
+    </table>
   );
 }
 
@@ -183,12 +191,16 @@ function getFormattedRowsFromTags(tags, meta) {
     } else {
       if (tagInfo.vr === 'xs') {
         try {
-          const dataset = metadataProvider.getStudyDataset(meta.StudyInstanceUID);
+          const dataset = metadataProvider.getStudyDataset(
+            meta.StudyInstanceUID
+          );
           const tag = dcmjs.data.Tag.fromPString(tagInfo.tag).toCleanString();
           const originalTagInfo = dataset[tag];
           tagInfo.vr = originalTagInfo.vr;
         } catch (error) {
-          console.error(`Failed to parse value representation for tag '${tagInfo.keyword}'`);
+          console.error(
+            `Failed to parse value representation for tag '${tagInfo.keyword}'`
+          );
         }
       }
 

extensions/dicom-tag-browser/src/getCommandsModule.js

@@ -21,7 +21,7 @@ export default function getCommandsModule(servicesManager) {
 
       const { UIModalService } = servicesManager.services;
 
-      const WrappedDicomTagBrowser = function () {
+      const WrappedDicomTagBrowser = function() {
         return (
           <DicomTagBrowser
             displaySets={displaySets}
@@ -34,7 +34,7 @@ export default function getCommandsModule(servicesManager) {
         content: WrappedDicomTagBrowser,
         title: `DICOM Tag Browser`,
         fullscreen: true,
-        showScrollbar: true
+        noScroll: true,
       });
     },
   };

extensions/vtk/CHANGELOG.md

@@ -3,6 +3,172 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.11.14](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.13...@ohif/extension-vtk@1.11.14) (2021-06-03)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.13](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.12...@ohif/extension-vtk@1.11.13) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [1.11.12](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.11...@ohif/extension-vtk@1.11.12) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.11](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.10...@ohif/extension-vtk@1.11.11) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.9...@ohif/extension-vtk@1.11.10) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.8...@ohif/extension-vtk@1.11.9) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.8](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.7...@ohif/extension-vtk@1.11.8) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.6...@ohif/extension-vtk@1.11.7) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.5...@ohif/extension-vtk@1.11.6) (2021-04-16)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.4...@ohif/extension-vtk@1.11.5) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.3...@ohif/extension-vtk@1.11.4) (2021-03-26)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.2...@ohif/extension-vtk@1.11.3) (2021-03-25)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.1...@ohif/extension-vtk@1.11.2) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.11.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.11.0...@ohif/extension-vtk@1.11.1) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+# [1.11.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.10.6...@ohif/extension-vtk@1.11.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [1.10.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.10.5...@ohif/extension-vtk@1.10.6) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.10.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.10.4...@ohif/extension-vtk@1.10.5) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.10.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.10.3...@ohif/extension-vtk@1.10.4) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.10.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.10.2...@ohif/extension-vtk@1.10.3) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [1.10.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.10.1...@ohif/extension-vtk@1.10.2) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
 ## [1.10.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@1.10.0...@ohif/extension-vtk@1.10.1) (2020-12-10)
 
 

extensions/vtk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-vtk",
-  "version": "1.10.1",
+  "version": "1.11.14",
   "description": "OHIF extension for VTK.js",
   "author": "OHIF",
   "license": "MIT",
@@ -35,7 +35,7 @@
     "cornerstone-core": "^2.2.8",
     "cornerstone-tools": "^4.20.1",
     "cornerstone-wado-image-loader": "^3.1.0",
-    "dcmjs": "0.17.0",
+    "dcmjs": "0.18.8",
     "dicom-parser": "^1.8.3",
     "i18next": "^17.0.3",
     "i18next-browser-languagedetector": "^3.0.1",
@@ -53,8 +53,8 @@
     "react-vtkjs-viewport": "^0.14.2"
   },
   "devDependencies": {
-    "@ohif/core": "^2.12.0",
-    "@ohif/ui": "^1.8.0",
+    "@ohif/core": "^2.13.13",
+    "@ohif/ui": "^1.9.2",
     "cornerstone-tools": "^4.20.1",
     "cornerstone-wado-image-loader": "^3.1.0",
     "dicom-parser": "^1.8.3",

extensions/vtk/src/OHIFVTKViewport.js

@@ -72,7 +72,7 @@ class OHIFVTKViewport extends Component {
   };
 
   static defaultProps = {
-    onScroll: () => { },
+    onScroll: () => {},
   };
 
   static id = 'OHIFVTKViewport';
@@ -138,6 +138,8 @@ class OHIFVTKViewport extends Component {
     SOPInstanceUID,
     frameIndex
   ) => {
+    const { UINotificationService } = this.props.servicesManager.services;
+
     const stack = OHIFVTKViewport.getCornerstoneStack(
       studies,
       StudyInstanceUID,
@@ -159,11 +161,14 @@ class OHIFVTKViewport extends Component {
       const { activeLabelmapIndex } = brushStackState;
       const labelmap3D = brushStackState.labelmaps3D[activeLabelmapIndex];
 
-      if (brushStackState.labelmaps3D.length > 1 && this.props.viewportIndex === 0) {
-        const { UINotificationService } = this.props.servicesManager.services;
+      if (
+        brushStackState.labelmaps3D.length > 1 &&
+        this.props.viewportIndex === 0
+      ) {
         UINotificationService.show({
           title: 'Overlapping Segmentation Found',
-          message: 'Overlapping segmentations cannot be displayed when in MPR mode',
+          message:
+            'Overlapping segmentations cannot be displayed when in MPR mode',
           type: 'info',
         });
       }
@@ -305,52 +310,82 @@ class OHIFVTKViewport extends Component {
       seriesDescription: displaySet.seriesDescription,
     };
 
-    const {
-      imageDataObject,
-      labelmapDataObject,
-      labelmapColorLUT,
-    } = this.getViewportData(
-      studies,
-      StudyInstanceUID,
-      displaySetInstanceUID,
-      SOPInstanceUID,
-      frameIndex
-    );
+    try {
+      const {
+        imageDataObject,
+        labelmapDataObject,
+        labelmapColorLUT,
+      } = this.getViewportData(
+        studies,
+        StudyInstanceUID,
+        displaySetInstanceUID,
+        SOPInstanceUID,
+        frameIndex
+      );
 
-    this.imageDataObject = imageDataObject;
+      this.imageDataObject = imageDataObject;
 
-    /* TODO: Not currently used until we have drawing tools in vtkjs.
-    if (!labelmap) {
-      labelmap = createLabelMapImageData(data);
-    } */
+      /* TODO: Not currently used until we have drawing tools in vtkjs.
+      if (!labelmap) {
+        labelmap = createLabelMapImageData(data);
+      } */
 
-    const volumeActor = this.getOrCreateVolume(
-      imageDataObject,
-      displaySetInstanceUID
-    );
+      const volumeActor = this.getOrCreateVolume(
+        imageDataObject,
+        displaySetInstanceUID
+      );
 
-    this.setState(
-      {
-        percentComplete: 0,
-        dataDetails,
-      },
-      () => {
-        this.loadProgressively(imageDataObject);
+      this.setState(
+        {
+          percentComplete: 0,
+          dataDetails,
+        },
+        () => {
+          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
-        // Will render _something_ before the volumes are set and the volume
-        // Construction that happens in react-vtkjs-viewport locks up the CPU.
-        setTimeout(() => {
-          this.setState({
-            volumes: [volumeActor],
-            paintFilterLabelMapImageData: labelmapDataObject,
-            paintFilterBackgroundImageData: imageDataObject.vtkImageData,
-            labelmapColorLUT,
-          });
-        }, 200);
+          // 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
+          // Will render _something_ before the volumes are set and the volume
+          // Construction that happens in react-vtkjs-viewport locks up the CPU.
+          setTimeout(() => {
+            this.setState({
+              volumes: [volumeActor],
+              paintFilterLabelMapImageData: labelmapDataObject,
+              paintFilterBackgroundImageData: imageDataObject.vtkImageData,
+              labelmapColorLUT,
+            });
+          }, 200);
+        }
+      );
+    } catch (error) {
+      const errorTitle = 'Failed to load 2D MPR';
+      console.error(errorTitle, error);
+      const {
+        UINotificationService,
+        LoggerService,
+      } = this.props.servicesManager.services;
+      if (this.props.viewportIndex === 0) {
+        const message = error.message.includes('buffer')
+          ? 'Dataset is too big to display in MPR'
+          : error.message;
+        LoggerService.error({ error, message });
+        UINotificationService.show({
+          title: errorTitle,
+          message,
+          type: 'error',
+          autoClose: false,
+          action: {
+            label: 'Exit 2D MPR',
+            onClick: ({ close }) => {
+              // context: 'ACTIVE_VIEWPORT::VTK',
+              close();
+              this.props.commandsManager.runCommand('setCornerstoneLayout');
+            },
+          },
+        });
       }
-    );
+      this.setState({ isLoaded: true });
+    }
   }
 
   componentDidMount() {
@@ -363,7 +398,7 @@ class OHIFVTKViewport extends Component {
 
     if (
       displaySet.displaySetInstanceUID !==
-      prevDisplaySet.displaySetInstanceUID ||
+        prevDisplaySet.displaySetInstanceUID ||
       displaySet.SOPInstanceUID !== prevDisplaySet.SOPInstanceUID ||
       displaySet.frameIndex !== prevDisplaySet.frameIndex
     ) {
@@ -396,11 +431,15 @@ class OHIFVTKViewport extends Component {
     };
 
     const onPixelDataInsertedErrorCallback = error => {
-      const { UINotificationService } = this.props.servicesManager.services;
+      const {
+        UINotificationService,
+        LoggerService,
+      } = this.props.servicesManager.services;
 
       if (!this.hasError) {
         if (this.props.viewportIndex === 0) {
           // Only show the notification from one viewport 1 in MPR2D.
+          LoggerService.error({ error, message: error.message });
           UINotificationService.show({
             title: 'MPR Load Error',
             message: error.message,

extensions/vtk/src/commandsModule.js

@@ -14,7 +14,9 @@ import OHIFVTKViewport from './OHIFVTKViewport';
 
 const { BlendMode } = Constants;
 
-const commandsModule = ({ commandsManager, UINotificationService }) => {
+const commandsModule = ({ commandsManager, servicesManager }) => {
+  const { UINotificationService, LoggerService } = servicesManager.services;
+
   // TODO: Put this somewhere else
   let apis = {};
   let defaultVOI;
@@ -175,7 +177,7 @@ const commandsModule = ({ commandsManager, UINotificationService }) => {
       segmentNumber,
       frameIndex,
       frame,
-      done = () => { },
+      done = () => {},
     }) => {
       let api = apis[viewports.activeViewportIndex];
 
@@ -473,10 +475,12 @@ const commandsModule = ({ commandsManager, UINotificationService }) => {
         const volumeLength = dimensions[0] * dimensions[1] * dimensions[2];
 
         if (volumeLength > maxBufferLengthFloat32) {
+          const message =
+            'This volume is too large to fit in WebGL 1 textures and will display incorrectly. Please use a different browser to view this data';
+          LoggerService.error({ message });
           UINotificationService.show({
             title: 'Browser does not support WebGL 2',
-            message:
-              'This volume is too large to fit in WebGL 1 textures and will display incorrectly. Please use a different browser to view this data',
+            message,
             type: 'error',
             autoClose: false,
           });

extensions/vtk/src/index.js

@@ -9,7 +9,9 @@ import { version } from '../package.json';
 // import loadLocales from './loadLocales';
 
 const OHIFVTKViewport = asyncComponent(() =>
-  retryImport(() => import(/* webpackChunkName: "OHIFVTKViewport" */ './OHIFVTKViewport.js'))
+  retryImport(() =>
+    import(/* webpackChunkName: "OHIFVTKViewport" */ './OHIFVTKViewport.js')
+  )
 );
 
 const vtkExtension = {
@@ -21,7 +23,11 @@ const vtkExtension = {
 
   getViewportModule({ commandsManager, servicesManager }) {
     const ExtendedVTKViewport = props => (
-      <OHIFVTKViewport {...props} servicesManager={servicesManager} />
+      <OHIFVTKViewport
+        {...props}
+        servicesManager={servicesManager}
+        commandsManager={commandsManager}
+      />
     );
     return withCommandsManager(ExtendedVTKViewport, commandsManager);
   },
@@ -29,8 +35,7 @@ const vtkExtension = {
     return toolbarModule;
   },
   getCommandsModule({ commandsManager, servicesManager }) {
-    const { UINotificationService } = servicesManager.services;
-    return commandsModule({ commandsManager, UINotificationService });
+    return commandsModule({ commandsManager, servicesManager });
   },
 };
 

extensions/vtk/src/toolbarComponents/VTKMPRToolbarButton.js

@@ -31,63 +31,7 @@ const _isDisplaySetReconstructable = (viewportSpecificData = {}, activeViewportI
 
   if (!displaySet) {
     return false;
-  }
-
-  // 2D MPR is not currently available for 4D datasets.
-
-  // Assuming that slices at different time have the same position, here we just check if
-  // there are multiple slices for the same ImagePositionPatient and disable MPR.
-
-  // A better heuristic would be checking 4D tags, e.g. the presence of multiple TemporalPositionIdentifier values.
-  // However, some studies (e.g. https://github.com/OHIF/Viewers/issues/2113) do not have such tags.
-
-  for (let ii = 0; ii < displaySet.numImageFrames; ++ii) {
-    const image = displaySet.images[ii];
-    if (!image) continue;
-
-    const imageIdControl = image.getImageId()
-    const instanceMetadataControl = cornerstone.metaData.get('instance', imageIdControl)
-
-    if (!instanceMetadataControl ||
-      instanceMetadataControl === undefined ||
-      !instanceMetadataControl.ImagePositionPatient ||
-      instanceMetadataControl.ImagePositionPatient === undefined) {
-      // if ImagePositionPatient is missing, skip the 4D datasets check.
-      // do not return false, because it could be a 3D dataset.
-      continue;
-    }
-
-    let xImagePositionPatientControl = instanceMetadataControl.ImagePositionPatient[0];
-    let yImagePositionPatientControl = instanceMetadataControl.ImagePositionPatient[1];
-    let zImagePositionPatientControl = instanceMetadataControl.ImagePositionPatient[2];
-
-    for (let jj = ii + 1; jj < displaySet.numImageFrames; ++jj) {
-      const image = displaySet.images[jj];
-      if (!image) continue;
-
-      const imageId = image.getImageId()
-      const instanceMetadata = cornerstone.metaData.get('instance', imageId)
-
-      if (!instanceMetadata ||
-        instanceMetadata === undefined ||
-        !instanceMetadata.ImagePositionPatient ||
-        instanceMetadata.ImagePositionPatient === undefined) {
-        // if ImagePositionPatient is missing, skip the 4D datasets check.
-        // do not return false, because it could be a 3D dataset.
-        continue;
-      }
-
-      let xImagePositionPatient = instanceMetadata.ImagePositionPatient[0];
-      let yImagePositionPatient = instanceMetadata.ImagePositionPatient[1];
-      let zImagePositionPatient = instanceMetadata.ImagePositionPatient[2];
-
-      if (xImagePositionPatientControl === xImagePositionPatient &&
-        yImagePositionPatientControl === yImagePositionPatient &&
-        zImagePositionPatientControl === zImagePositionPatient) {
-        return false;
-      }
-    }
-  }
+  };
 
   return displaySet.isReconstructable;
 };

platform/core/CHANGELOG.md

@@ -3,6 +3,170 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [2.13.13](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.12...@ohif/core@2.13.13) (2021-06-03)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.12](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.11...@ohif/core@2.13.12) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [2.13.11](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.10...@ohif/core@2.13.11) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.10](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.9...@ohif/core@2.13.10) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.9](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.8...@ohif/core@2.13.9) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.8](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.7...@ohif/core@2.13.8) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.7](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.6...@ohif/core@2.13.7) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.6](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.5...@ohif/core@2.13.6) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.5](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.4...@ohif/core@2.13.5) (2021-04-16)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.4](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.3...@ohif/core@2.13.4) (2021-04-15)
+
+
+### Bug Fixes
+
+* **wl:** fix metadata provider window level issues after dicomweb update (string vs number) ([8681036](https://github.com/OHIF/Viewers/commit/8681036b2133cfc325658691a256a86b5e36705f))
+
+
+
+
+
+## [2.13.3](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.2...@ohif/core@2.13.3) (2021-03-26)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.13.2](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.1...@ohif/core@2.13.2) (2021-03-25)
+
+
+### Bug Fixes
+
+* IDC-2288: Update toolbar tabs after derived displayset loaded ([#2307](https://github.com/OHIF/Viewers/issues/2307)) ([6e723eb](https://github.com/OHIF/Viewers/commit/6e723ebced58852007ca553792c740976cfc4201))
+
+
+
+
+
+## [2.13.1](https://github.com/OHIF/Viewers/compare/@ohif/core@2.13.0...@ohif/core@2.13.1) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+# [2.13.0](https://github.com/OHIF/Viewers/compare/@ohif/core@2.12.5...@ohif/core@2.13.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [2.12.5](https://github.com/OHIF/Viewers/compare/@ohif/core@2.12.4...@ohif/core@2.12.5) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.12.4](https://github.com/OHIF/Viewers/compare/@ohif/core@2.12.3...@ohif/core@2.12.4) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.12.3](https://github.com/OHIF/Viewers/compare/@ohif/core@2.12.2...@ohif/core@2.12.3) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.12.2](https://github.com/OHIF/Viewers/compare/@ohif/core@2.12.1...@ohif/core@2.12.2) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
+## [2.12.1](https://github.com/OHIF/Viewers/compare/@ohif/core@2.12.0...@ohif/core@2.12.1) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/core
+
+
+
+
+
 # [2.12.0](https://github.com/OHIF/Viewers/compare/@ohif/core@2.11.1...@ohif/core@2.12.0) (2020-12-10)
 
 

platform/core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/core",
-  "version": "2.12.0",
+  "version": "2.13.13",
   "description": "Generic business logic for web-based medical imaging applications",
   "author": "OHIF Core Team",
   "license": "MIT",
@@ -39,13 +39,14 @@
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "ajv": "^6.10.0",
-    "dcmjs": "0.17.0",
-    "dicomweb-client": "^0.6.0",
+    "dcmjs": "0.18.8",
+    "dicomweb-client": "^0.8.1",
     "immer": "6.0.2",
     "isomorphic-base64": "^1.0.2",
     "lodash.clonedeep": "^4.5.0",
     "lodash.merge": "^4.6.1",
     "mousetrap": "^1.6.3",
+    "retry": "^0.12.0",
     "validate.js": "^0.12.0"
   }
 }

platform/core/src/DICOMSR/handleStructuredReport.js

@@ -6,6 +6,7 @@ import parseDicomStructuredReport from './parseDicomStructuredReport';
 import parseMeasurementsData from './parseMeasurementsData';
 import getAllDisplaySets from './utils/getAllDisplaySets';
 import errorHandler from '../errorHandler';
+import getXHRRetryRequestHook from '../utils/xhrRetryRequestHook';
 
 const VERSION_NAME = 'dcmjs-0.0';
 const TRANSFER_SYNTAX_UID = '1.2.840.10008.1.2.1';
@@ -23,6 +24,7 @@ const retrieveMeasurementFromSR = async (series, studies, serverUrl) => {
     url: serverUrl,
     headers: DICOMWeb.getAuthorizationHeader(),
     errorInterceptor: errorHandler.getHTTPErrorHandler(),
+    requestHooks: [getXHRRetryRequestHook()],
   };
 
   const dicomWeb = new api.DICOMwebClient(config);
@@ -74,6 +76,7 @@ const stowSRFromMeasurements = async (measurements, serverUrl) => {
     url: serverUrl,
     headers: DICOMWeb.getAuthorizationHeader(),
     errorInterceptor: errorHandler.getHTTPErrorHandler(),
+    requestHooks: [getXHRRetryRequestHook()],
   };
 
   const dicomWeb = new api.DICOMwebClient(config);

platform/core/src/DICOMSR/parseDicomStructuredReport.js

@@ -77,7 +77,6 @@ const parseDicomStructuredReport = (part10SRArrayBuffer, displaySets) => {
 
 /**
  * Function to create imagePath with all imageData related
- *
  * @param {string} StudyInstanceUID
  * @param {string} SeriesInstanceUID
  * @param {string} SOPInstanceUID

platform/core/src/classes/HotkeysManager.js

@@ -63,10 +63,15 @@ export class HotkeysManager {
 
       definitions.forEach(definition => this.registerHotkeys(definition));
     } catch (error) {
-      const { UINotificationService } = this._servicesManager.services;
+      const {
+        UINotificationService,
+        LoggerService,
+      } = this._servicesManager.services;
+      const message = 'Erro while setting hotkeys';
+      LoggerService.error({ error, message });
       UINotificationService.show({
         title: 'Hotkeys Manager',
-        message: 'Erro while setting hotkeys',
+        message,
         type: 'error',
       });
     }

platform/core/src/classes/MetadataProvider.js

@@ -4,6 +4,7 @@ import dicomParser from 'dicom-parser';
 import getPixelSpacingInformation from '../utils/metadataProvider/getPixelSpacingInformation';
 import fetchPaletteColorLookupTableData from '../utils/metadataProvider/fetchPaletteColorLookupTableData';
 import fetchOverlayData from '../utils/metadataProvider/fetchOverlayData';
+import validNumber from '../utils/metadataProvider/validNumber';
 
 class MetadataProvider {
   constructor() {
@@ -284,7 +285,7 @@ class MetadataProvider {
 
         break;
       case WADO_IMAGE_LOADER_TAGS.VOI_LUT_MODULE:
-        const { WindowCenter, WindowWidth } = instance;
+        let { WindowCenter, WindowWidth } = instance;
 
         const windowCenter = Array.isArray(WindowCenter)
           ? WindowCenter
@@ -294,15 +295,17 @@ class MetadataProvider {
           : [WindowWidth];
 
         metadata = {
-          windowCenter,
-          windowWidth,
+          windowCenter: validNumber(windowCenter),
+          windowWidth: validNumber(windowWidth),
         };
 
         break;
       case WADO_IMAGE_LOADER_TAGS.MODALITY_LUT_MODULE:
+        const rescaleSlope = validNumber(instance.RescaleSlope);
+        const rescaleIntercept = validNumber(instance.RescaleIntercept);
         metadata = {
-          rescaleIntercept: instance.RescaleIntercept,
-          rescaleSlope: instance.RescaleSlope,
+          rescaleIntercept,
+          rescaleSlope,
           rescaleType: instance.RescaleType,
         };
         break;

platform/core/src/classes/metadata/StudyMetadata.js

@@ -9,11 +9,12 @@ import { SeriesMetadata } from './SeriesMetadata';
 import { api } from 'dicomweb-client';
 // - createStacks
 import { isImage } from '../../utils/isImage';
-import isDisplaySetReconstructable from '../../utils/isDisplaySetReconstructable';
+import { isDisplaySetReconstructable, isSpacingUniform } from '../../utils/isDisplaySetReconstructable';
 import errorHandler from '../../errorHandler';
 import isLowPriorityModality from '../../utils/isLowPriorityModality';
+import getXHRRetryRequestHook from '../../utils/xhrRetryRequestHook';
 
-export class StudyMetadata extends Metadata {
+class StudyMetadata extends Metadata {
   constructor(data, uid) {
     super(data, uid);
     // Initialize Private Properties
@@ -226,6 +227,56 @@ export class StudyMetadata extends Metadata {
     displaySets.map(displaySet => this._derivedDisplaySets.push(displaySet));
   }
 
+
+  /**
+   * Returns the source display set of the derivated display set.
+   * @param {object} derivatedDisplaySet
+   * @param {array[StudyMetadata]} studies
+   * @return {object} source display set.
+   */
+  static getReferencedDisplaySet(derivatedDisplaySet, studies) {
+    let allDisplaySets = [];
+
+    studies.forEach(study => {
+      allDisplaySets = allDisplaySets.concat(study.displaySets);
+    });
+
+    const otherDisplaySets = allDisplaySets.filter(
+      ds => ds.displaySetInstanceUID !== derivatedDisplaySet.displaySetInstanceUID
+    );
+
+    const { metadata } = derivatedDisplaySet;
+
+    let referencedSeriesInstanceUIDs = _findReferencedSeriesInstanceUIDsFromSourceImageSequence
+    (metadata, otherDisplaySets);
+
+    let noReferencedSeriesAvailable = !referencedSeriesInstanceUIDs ||
+      referencedSeriesInstanceUIDs.length === 0;
+    if (noReferencedSeriesAvailable) {
+      referencedSeriesInstanceUIDs =
+        _findReferencedSeriesInstanceUIDsFromReferencedSeriesSequence
+          (metadata);
+    }
+
+    noReferencedSeriesAvailable = !referencedSeriesInstanceUIDs ||
+      referencedSeriesInstanceUIDs.length === 0;
+    if (noReferencedSeriesAvailable) {
+      referencedSeriesInstanceUIDs =
+      _findReferencedSeriesInstanceUIDsFromReferencedImageSequence
+          (metadata, otherDisplaySets);
+    }
+
+    const referencedSeriesAvailable = referencedSeriesInstanceUIDs &&
+      referencedSeriesInstanceUIDs.length !== 0;
+    if (referencedSeriesAvailable) {
+      const referencedDisplaySet = otherDisplaySets.find(ds =>
+        referencedSeriesInstanceUIDs.includes(ds.SeriesInstanceUID)
+      );
+      ;
+      return referencedDisplaySet;
+    }
+  };
+
   /**
    * Returns a list of derived datasets in the study, filtered by the given filter.
    * @param {object} filter An object containing search filters
@@ -252,20 +303,7 @@ export class StudyMetadata extends Metadata {
     if (referencedSeriesInstanceUID) {
       filteredDerivedDisplaySets = filteredDerivedDisplaySets.filter(
         displaySet => {
-          if (!displaySet.metadata.ReferencedSeriesSequence) {
-            return false;
-          }
-
-          const ReferencedSeriesSequence = Array.isArray(
-            displaySet.metadata.ReferencedSeriesSequence
-          )
-            ? displaySet.metadata.ReferencedSeriesSequence
-            : [displaySet.metadata.ReferencedSeriesSequence];
-
-          return ReferencedSeriesSequence.some(
-            ReferencedSeries =>
-              ReferencedSeries.SeriesInstanceUID === referencedSeriesInstanceUID
-          );
+          return StudyMetadata.getReferencedDisplaySet(displaySet, [this]).SeriesInstanceUID === referencedSeriesInstanceUID;
         }
       );
     }
@@ -273,7 +311,7 @@ export class StudyMetadata extends Metadata {
     if (referencedFrameOfReferenceUID) {
       filteredDerivedDisplaySets = filteredDerivedDisplaySets.filter(
         displaySet =>
-          displaySet.ReferencedFrameOfReferenceUID ===
+          displaySet.FrameOfReferenceUID ===
           referencedFrameOfReferenceUID
       );
     }
@@ -767,6 +805,16 @@ const isMultiFrame = instance => {
   return instance.getTagValue('NumberOfFrames') > 1;
 };
 
+/**
+ * Creates a display set for a series.
+ * Checks if a series is reconstructable to a 3D volume.
+ * If reconstructable, the frames are sorted.
+ *
+ * @param {SeriesMetadata} series The series metadata object from which the display sets will be created
+ * @param {Object[]} instances An array of `OHIFInstanceMetadata` objects.
+ *
+ * @returns {Object} imageSet.
+ */
 const makeDisplaySet = (series, instances) => {
   const instance = instances[0];
   const imageSet = new ImageSet(instances);
@@ -786,7 +834,7 @@ const makeDisplaySet = (series, instances) => {
     isMultiFrame: isMultiFrame(instance),
   });
 
-  // Sort the images in this series if needed
+  // Sort the images in this series by instanceNumber
   const shallSort = true; //!OHIF.utils.ObjectPath.get(Meteor, 'settings.public.ui.sortSeriesByIncomingOrder');
   if (shallSort) {
     imageSet.sortBy((a, b) => {
@@ -804,18 +852,32 @@ const makeDisplaySet = (series, instances) => {
     imageSet.getImage(0).getTagValue('InstanceNumber')
   );
 
-  const isReconstructable = isDisplaySetReconstructable(instances);
-
-  imageSet.isReconstructable = isReconstructable.value;
+  const displayReconstructableInfo = isDisplaySetReconstructable(instances);
+  imageSet.isReconstructable = displayReconstructableInfo.value;
 
+  let displaySpacingInfo = undefined;
   if (shallSort && imageSet.isReconstructable) {
+    // sort images by image position
     imageSet.sortByImagePositionPatient();
+
+    // check if the spacing is uniform and update isReconstructable
+    const datasetIs4D = displayReconstructableInfo.reconstructionIssues.find
+      (issue => issue === ReconstructionIssues.DATASET_4D);
+    displaySpacingInfo = isSpacingUniform(imageSet.images, datasetIs4D);
+    imageSet.isReconstructable = displaySpacingInfo.isUniform;
+
+    if (displaySpacingInfo.missingFrames) {
+      // TODO -> This is currently unused, but may be used for reconstructing
+      // Volumes with gaps later on.
+      imageSet.missingFrames = displaySpacingInfo.missingFrames;
+    }
   }
 
-  if (isReconstructable.missingFrames) {
-    // TODO -> This is currently unused, but may be used for reconstructing
-    // Volumes with gaps later on.
-    imageSet.missingFrames = isReconstructable.missingFrames;
+  if (!imageSet.displayReconstructableInfo) {
+    // It is not reconstrabale Save type of warning
+    imageSet.reconstructionIssues = displaySpacingInfo ?
+      displayReconstructableInfo.reconstructionIssues.concat(displaySpacingInfo.reconstructionIssues) :
+        displayReconstructableInfo.reconstructionIssues;
   }
 
   return imageSet;
@@ -878,6 +940,7 @@ function _getDisplaySetFromSopClassModule(
     url: study.getData().wadoRoot,
     headers,
     errorInterceptor,
+    requestHooks: [getXHRRetryRequestHook()],
   });
 
   let displaySet = plugin.getDisplaySetFromSeries(
@@ -892,3 +955,147 @@ function _getDisplaySetFromSopClassModule(
   }
   return displaySet;
 }
+
+/**
+  * Returns the referenced series instance UIDs by searching the information in the
+  * ReferencedSeriesSequence.
+  * @param {object} derivatedDisplaySet.metadata
+  * @return {array[string]} referenced series instance UIDs.
+  */
+function _findReferencedSeriesInstanceUIDsFromReferencedSeriesSequence (
+  metadata,
+) {
+  if (!metadata.ReferencedSeriesSequence) {
+    return;
+  }
+
+  let referencedSeriesInstanceUIDs;
+  const ReferencedSeriesSequence = _toArray(
+    metadata.ReferencedSeriesSequence
+  );
+
+  referencedSeriesInstanceUIDs = ReferencedSeriesSequence.map(
+    ReferencedSeries => ReferencedSeries.SeriesInstanceUID
+  );
+
+  return referencedSeriesInstanceUIDs;
+};
+
+/**
+  * Returns the referenced series instance UIDs by searching the information in the
+  * ReferencedImageSequence.
+  * @param {object} derivatedDisplaySet.metadata
+  * @param {array[object]} displaysets
+  * @return {array[string]} referenced series instance UIDs.
+  */
+function _findReferencedSeriesInstanceUIDsFromReferencedImageSequence (
+  metadata,
+  displaySets
+) {
+  if (!metadata.ReferencedImageSequence) {
+    return;
+  }
+
+  let referencedSeriesInstanceUIDs;
+  const referencedImageArray = _toArray(metadata.ReferencedImageSequence);
+  for (let i = 0; i < referencedImageArray.length; i++) {
+    const { ReferencedSOPInstanceUID } = referencedImageArray[i];
+    if (!ReferencedSOPInstanceUID) {
+      continue;
+    }
+
+    referencedSeriesInstanceUIDs = _findReferencedSeriesInstanceUIDsFromSOPInstanceUID(
+      displaySets,
+      ReferencedSOPInstanceUID
+    );
+
+    if (referencedSeriesInstanceUIDs && referencedSeriesInstanceUIDs.length !== 0) {
+      break;
+    }
+  }
+
+  return referencedSeriesInstanceUIDs;
+};
+
+/**
+  * Returns the referenced series instance UIDs by searching the information in the
+  * SourceImageSequence.
+  * @param {object} derivatedDisplaySet.metadata
+  * @param {array[object]} displaysets
+  * @return {array[string]} referenced series instance UIDs.
+  */
+function _findReferencedSeriesInstanceUIDsFromSourceImageSequence (
+  metadata,
+  displaySets
+) {
+  let SourceImageSequence;
+
+  if (metadata.SourceImageSequence) {
+    SourceImageSequence = metadata.SourceImageSequence;
+  } else {
+    const { PerFrameFunctionalGroupsSequence } = metadata;
+    const firstFunctionalGroups = _toArray(
+      PerFrameFunctionalGroupsSequence
+    )[0];
+    if (firstFunctionalGroups) {
+      const { DerivationImageSequence } = firstFunctionalGroups;
+      SourceImageSequence = DerivationImageSequence;
+    }
+  }
+
+  if (!SourceImageSequence) {
+    return;
+  }
+
+  const sourceImageArray = _toArray(SourceImageSequence);
+
+  let referencedSeriesInstanceUIDs;
+  for (let i = 0; i < sourceImageArray.length; i++) {
+    const { ReferencedSOPInstanceUID } = sourceImageArray[i];
+    referencedSeriesInstanceUIDs = _findReferencedSeriesInstanceUIDsFromSOPInstanceUID(
+      displaySets,
+      ReferencedSOPInstanceUID
+    );
+    if (referencedSeriesInstanceUIDs && referencedSeriesInstanceUIDs.length !== 0) {
+      break;
+    }
+  }
+
+  return referencedSeriesInstanceUIDs;
+};
+
+/**
+  * Returns the referenced series instance UIDs by searching the information in the
+  * SOPInstanceUID of the displaySets.
+  * @param {array[object]} displaysets
+  * @param {string} SOPInstanceUID
+  * @return {array[string]} referenced series instance UIDs.
+  */
+function _findReferencedSeriesInstanceUIDsFromSOPInstanceUID (
+  displaySets,
+  SOPInstanceUID
+) {
+  const imageSets = displaySets.filter(ds => ds instanceof ImageSet);
+
+  for (let i = 0; i < imageSets.length; i++) {
+    const { images } = imageSets[i];
+    if (!images) {
+      continue;
+    }
+    for (let j = 0; j < images.length; j++) {
+      const image = images[j];
+      if (!image) {
+        continue;
+      }
+      if (image.SOPInstanceUID === SOPInstanceUID) {
+        return [image.getData().metadata.SeriesInstanceUID];
+      }
+    }
+  }
+};
+
+function _toArray(arrayOrObject) {
+  return Array.isArray(arrayOrObject) ? arrayOrObject : [arrayOrObject];
+}
+
+export {StudyMetadata};

platform/core/src/enums.js

@@ -0,0 +1,11 @@
+const ReconstructionIssues = {
+  DATASET_4D: 'datasetis4D',
+  VARYING_IMAGESDIMENSIONS: 'imagesdimensionsvarying',
+  VARYING_IMAGESCOMPONENTS: 'imagescomponentsvarying',
+  VARYING_IMAGESORIENTATION: 'imagesorientationvarying',
+  MISSING_FRAMES: 'missingframes',
+  IRREGULAR_SPACING: 'irregularspacing',
+  MULTIFFRAMES: 'multiframe',
+};
+
+export {ReconstructionIssues};

platform/core/src/index.js

@@ -26,6 +26,7 @@ import {
   UIModalService,
   UIDialogService,
   MeasurementService,
+  LoggerService,
 } from './services';
 
 const OHIF = {
@@ -60,6 +61,7 @@ const OHIF = {
   UIModalService,
   UIDialogService,
   MeasurementService,
+  LoggerService,
 };
 
 export {
@@ -93,6 +95,7 @@ export {
   UIModalService,
   UIDialogService,
   MeasurementService,
+  LoggerService,
 };
 
 export { OHIF };

platform/core/src/index.test.js

@@ -14,6 +14,7 @@ describe('Top level exports', () => {
       'UIModalService',
       'UIDialogService',
       'MeasurementService',
+      'LoggerService',
       //
       'utils',
       'hotkeys',

platform/core/src/services/LoggerService/index.js

@@ -0,0 +1,67 @@
+const name = 'LoggerService';
+
+const publicAPI = {
+  name,
+  info: _info,
+  error: _error,
+  setServiceImplementation,
+};
+
+const serviceImplementation = {
+  _info: () => console.warn('info() NOT IMPLEMENTED'),
+  _error: () => console.warn('error() NOT IMPLEMENTED'),
+};
+
+/**
+ * Logs an info
+ *
+ * @param {object} props { message, displayOnConsole }
+ */
+function _info({ message, displayOnConsole }) {
+  return serviceImplementation._info({
+    message,
+    displayOnConsole,
+  });
+}
+
+/**
+ * Logs an error
+ *
+ * @param {object} props { error, stack, message, displayOnConsole }
+ * @returns void
+ */
+function _error({ error, stack, message, displayOnConsole }) {
+  return serviceImplementation._error({
+    error,
+    stack,
+    message,
+    displayOnConsole,
+  });
+}
+
+/**
+ *
+ *
+ * @param {*} {
+ *   info: infoImplementation,
+ *   error: errorImplementation,
+ * }
+ */
+function setServiceImplementation({
+  info: infoImplementation,
+  error: errorImplementation,
+}) {
+  if (infoImplementation) {
+    serviceImplementation._info = infoImplementation;
+  }
+  if (errorImplementation) {
+    serviceImplementation._error = errorImplementation;
+  }
+}
+
+export default {
+  name,
+  create: ({ configuration = {} }) => {
+    return publicAPI;
+  },
+};

platform/core/src/services/UIModalService/index.js

@@ -9,7 +9,8 @@
  * @property {boolean} [closeButton=true] Should the modal body render the close button.
  * @property {string} [title=null] Should the modal render the title independently of the body content.
  * @property {string} [customClassName=null] The custom class to style the modal.
- * @property {boolean} [showScrollbar=null] Show or hide scrollbar.
+ * @property {boolean} [showScrollbar=false] Show or hide scrollbar.
+ * @property {boolean} [noScroll=false] Disable or not the scrollbar.
  */
 
 const name = 'UIModalService';
@@ -29,7 +30,7 @@ const serviceImplementation = {
 /**
  * Show a new UI modal;
  *
- * @param {ModalProps} props { content, contentProps, shouldCloseOnEsc, isOpen, onClose, closeButton, title, customClassName, showScrollbar }
+ * @param {ModalProps} props { content, contentProps, shouldCloseOnEsc, isOpen, onClose, closeButton, title, customClassName, showScrollbar, noScroll }
  */
 function _show({
   content = null,
@@ -41,7 +42,8 @@ function _show({
   title = null,
   fullscreen = false,
   customClassName = null,
-  showScrollbar = false
+  showScrollbar = false,
+  noScroll = false,
 }) {
   return serviceImplementation._show({
     content,
@@ -53,7 +55,8 @@ function _show({
     title,
     fullscreen,
     customClassName,
-    showScrollbar
+    showScrollbar,
+    noScroll,
   });
 }
 

platform/core/src/services/UINotificationService/index.js

@@ -8,6 +8,7 @@
  * @property {string} [position="bottomRight"] -"topLeft" | "topCenter | "topRight" | "bottomLeft" | "bottomCenter" | "bottomRight"
  * @property {string} [type="info"] - "info" | "error" | "warning" | "success"
  * @property {boolean} [autoClose=true]
+ * @property {object} [action=null]
  */
 
 const name = 'UINotificationService';
@@ -34,7 +35,7 @@ const serviceImplementation = {
  * Create and show a new UI notification; returns the
  * ID of the created notification.
  *
- * @param {Notification} notification { title, message, duration, position, type, autoClose}
+ * @param {Notification} notification { title, message, duration, position, type, autoClose, action}
  * @returns {number} id
  */
 function _show({
@@ -44,6 +45,7 @@ function _show({
   position = 'bottomRight',
   type = 'info',
   autoClose = true,
+  action = null,
 }) {
   return serviceImplementation._show({
     title,
@@ -52,6 +54,7 @@ function _show({
     position,
     type,
     autoClose,
+    action,
   });
 }
 

platform/core/src/services/index.js

@@ -3,6 +3,7 @@ import UINotificationService from './UINotificationService';
 import UIModalService from './UIModalService';
 import UIDialogService from './UIDialogService';
 import MeasurementService from './MeasurementService';
+import LoggerService from './LoggerService';
 
 export {
   UINotificationService,
@@ -10,4 +11,5 @@ export {
   UIDialogService,
   ServicesManager,
   MeasurementService,
+  LoggerService,
 };

platform/core/src/studies/services/qido/studies.js

@@ -2,6 +2,7 @@ import { api } from 'dicomweb-client';
 import DICOMWeb from '../../../DICOMWeb/';
 
 import errorHandler from '../../../errorHandler';
+import getXHRRetryRequestHook from '../../../utils/xhrRetryRequestHook';
 
 /**
  * Creates a QIDO date string for a date range query
@@ -118,6 +119,7 @@ export default function Studies(server, filter) {
     url: server.qidoRoot,
     headers: DICOMWeb.getAuthorizationHeader(server),
     errorInterceptor: errorHandler.getHTTPErrorHandler(),
+    requestHooks: [getXHRRetryRequestHook()],
   };
 
   const dicomWeb = new api.DICOMwebClient(config);

platform/core/src/studies/services/wado/retrieveMetadataLoaderAsync.js

@@ -10,6 +10,7 @@ import {
 } from './studyInstanceHelpers';
 
 import errorHandler from '../../../errorHandler';
+import { getXHRRetryRequestHook } from '../../../utils/xhrRetryRequestHook';
 
 const { naturalizeDataset } = dcmjs.data.DicomMetaDictionary;
 
@@ -76,6 +77,7 @@ export default class RetrieveMetadataLoaderAsync extends RetrieveMetadataLoader
       url: server.qidoRoot,
       headers: DICOMWeb.getAuthorizationHeader(server),
       errorInterceptor: errorHandler.getHTTPErrorHandler(),
+      requestHooks: [getXHRRetryRequestHook()],
     });
 
     this.client = client;

platform/core/src/studies/services/wado/retrieveMetadataLoaderSync.js

@@ -4,6 +4,7 @@ import { createStudyFromSOPInstanceList } from './studyInstanceHelpers';
 import RetrieveMetadataLoader from './retrieveMetadataLoader';
 
 import errorHandler from '../../../errorHandler';
+import getXHRRetryRequestHook from '../../../utils/xhrRetryRequestHook';
 
 /**
  * Class for sync load of study metadata.
@@ -61,6 +62,7 @@ export default class RetrieveMetadataLoaderSync extends RetrieveMetadataLoader {
       url: server.wadoRoot,
       headers: DICOMWeb.getAuthorizationHeader(server),
       errorInterceptor: errorHandler.getHTTPErrorHandler(),
+      requestHooks: [getXHRRetryRequestHook()],
     });
 
     this.client = client;

platform/core/src/utils/dicomLoaderService.js

@@ -4,6 +4,7 @@ import { api } from 'dicomweb-client';
 import DICOMWeb from '../DICOMWeb';
 
 import errorHandler from '../errorHandler';
+import getXHRRetryRequestHook from './xhrRetryRequestHook';
 
 const getImageId = imageObj => {
   if (!imageObj) {
@@ -66,6 +67,7 @@ const wadorsRetriever = (
     url,
     headers,
     errorInterceptor,
+    requestHooks: [getXHRRetryRequestHook()],
   };
   const dicomWeb = new api.DICOMwebClient(config);
 

platform/core/src/utils/index.js

@@ -18,6 +18,7 @@ import isDicomUid from './isDicomUid';
 import resolveObjectPath from './resolveObjectPath';
 import * as hierarchicalListUtils from './hierarchicalListUtils';
 import * as progressTrackingUtils from './progressTrackingUtils';
+import xhrRetryRequestHook from './xhrRetryRequestHook';
 
 const utils = {
   guid,
@@ -40,6 +41,7 @@ const utils = {
   resolveObjectPath,
   hierarchicalListUtils,
   progressTrackingUtils,
+  xhrRetryRequestHook,
 };
 
 export {
@@ -63,6 +65,7 @@ export {
   resolveObjectPath,
   hierarchicalListUtils,
   progressTrackingUtils,
+  xhrRetryRequestHook,
 };
 
 export default utils;

platform/core/src/utils/index.test.js

@@ -23,6 +23,7 @@ describe('Top level exports', () => {
       'resolveObjectPath',
       'hierarchicalListUtils',
       'progressTrackingUtils',
+      'xhrRetryRequestHook',
     ].sort();
 
     const exports = Object.keys(utils.default).sort();

platform/core/src/utils/isDisplaySetReconstructable.js

@@ -1,9 +1,14 @@
+import { ReconstructionIssues } from './../enums.js';
+
+
 /**
  * Checks if a series is reconstructable to a 3D volume.
  *
- * @param {Object[]} instances An array of `OHIFInstanceMetadata` objects.
+ * @param {Object[]} An array of `OHIFInstanceMetadata` objects.
+ *
+ * @returns {Object} value, reconstructionIssues.
  */
-export default function isDisplaySetReconstructable(instances) {
+function isDisplaySetReconstructable(instances) {
   if (!instances.length) {
     return { value: false };
   }
@@ -23,31 +28,45 @@ export default function isDisplaySetReconstructable(instances) {
   }
 
   if (isMultiframe) {
-    return processMultiframe(instances[0]);
+    return processMultiframe();
   } else {
     return processSingleframe(instances);
   }
 }
 
-function processMultiframe(instance) {
-  //TODO: deal with multriframe checks! return false for now as can't reconstruct.
-  return { value: false };
+/**
+ * Process reconstructable multiframes checks
+ * TODO: deal with multriframe checks! return false for now as can't reconstruct.
+ * *
+ * @returns {Object} value and reconstructionIssues.
+ */
+function processMultiframe() {
+  const reconstructionIssues = [ReconstructionIssues.MULTIFRAMES];
+  return { value: false, reconstructionIssues };
 }
 
+/**
+ * Process reconstructable single frame checks
+ *
+ * @param {Object[]} An array of `OHIFInstanceMetadata` objects.
+ *
+ * @returns {Object} value and reconstructionIssues.
+ */
 function processSingleframe(instances) {
+  const n = instances.length;
   const firstImage = instances[0].getData().metadata;
   const firstImageRows = firstImage.Rows;
   const firstImageColumns = firstImage.Columns;
   const firstImageSamplesPerPixel = firstImage.SamplesPerPixel;
   const firstImageOrientationPatient = firstImage.ImageOrientationPatient;
-  const firstImagePositionPatient = firstImage.ImagePositionPatient;
 
+  const reconstructionIssues = [];
   // Can't reconstruct if we:
   // -- Have a different dimensions within a displaySet.
   // -- Have a different number of components within a displaySet.
   // -- Have different orientations within a displaySet.
-  for (let i = 1; i < instances.length; i++) {
-    const instance = instances[i].getData().metadata;
+  for (let ii = 1; ii < n; ++ii) {
+    const instance = instances[ii].getData().metadata;
     const {
       Rows,
       Columns,
@@ -55,67 +74,146 @@ function processSingleframe(instances) {
       ImageOrientationPatient,
     } = instance;
 
-    if (
-      Rows !== firstImageRows ||
-      Columns !== firstImageColumns ||
-      SamplesPerPixel !== firstImageSamplesPerPixel ||
-      !_isSameOrientation(ImageOrientationPatient, firstImageOrientationPatient)
-    ) {
-      return { value: false };
+    if (Rows !== firstImageRows || Columns !== firstImageColumns) {
+      reconstructionIssues.push(ReconstructionIssues.VARYING_IMAGESDIMENSIONS);
+    } else if (SamplesPerPixel !== firstImageSamplesPerPixel) {
+      reconstructionIssues.push(ReconstructionIssues.VARYING_IMAGESCOMPONENTS);
+    } else if (!_isSameArray(ImageOrientationPatient, firstImageOrientationPatient)) {
+      reconstructionIssues.push(ReconstructionIssues.VARYING_IMAGESORIENTATION);
+    }
+
+    if (reconstructionIssues.length !== 0) {
+      break;
     }
   }
 
+  // check if dataset is 4D
+  if (_isDataset4D(instances)) {
+    reconstructionIssues.push(ReconstructionIssues.DATASET_4D);
+  }
+
+  return { value: reconstructionIssues.length === 0 ? true : false, reconstructionIssues };
+}
+
+/**
+ *  Check is the spacing is uniform.
+ *  The input metadata array has to be ordered by image position.
+ *
+ * @param {Object[]} An array of `OHIFInstanceMetadata` objects.
+ * @param {boolean} is the dataset 4D.
+ *
+ * @returns {Object} isUniform, reconstructionIssues and missingFrames
+ */
+function isSpacingUniform(instances, datasetIs4D) {
+  const n = instances.length;
+  const firstImage = instances[0].getData().metadata;
+  const firstImagePositionPatient = firstImage.ImagePositionPatient;
+
+  const reconstructionIssues = [];
   let missingFrames = 0;
 
   // Check if frame spacing is approximately equal within a spacingTolerance.
   // If spacing is on a uniform grid but we are missing frames,
   // Allow reconstruction, but pass back the number of missing frames.
-  if (instances.length > 2) {
-    const lastIpp = instances[instances.length - 1].getData().metadata
+  if (n > 2) {
+    const lastIpp = instances[n - 1].getData().metadata
       .ImagePositionPatient;
 
     // We can't reconstruct if we are missing ImagePositionPatient values
-    if (!firstImagePositionPatient || !lastIpp) {
-      return { value: false };
-    }
+    if (firstImagePositionPatient && lastIpp) {
+      const averageSpacingBetweenFrames =
+        _getPerpendicularDistance(firstImagePositionPatient, lastIpp) /
+        (n - 1);
 
-    const averageSpacingBetweenFrames =
-      _getPerpendicularDistance(firstImagePositionPatient, lastIpp) /
-      (instances.length - 1);
+      let previousImagePositionPatient = firstImagePositionPatient;
 
-    let previousImagePositionPatient = firstImagePositionPatient;
+      for (let ii = 1; ii < n; ++ii) {
+        const instance = instances[ii].getData().metadata;
+        const { ImagePositionPatient } = instance;
 
-    for (let i = 1; i < instances.length; i++) {
-      const instance = instances[i].getData().metadata;
-      const { ImagePositionPatient } = instance;
+        const spacingBetweenFrames = _getPerpendicularDistance(
+          ImagePositionPatient,
+          previousImagePositionPatient
+        );
 
-      const spacingBetweenFrames = _getPerpendicularDistance(
-        ImagePositionPatient,
-        previousImagePositionPatient
-      );
-      const spacingIssue = _getSpacingIssue(
-        spacingBetweenFrames,
-        averageSpacingBetweenFrames
-      );
-
-      if (spacingIssue) {
-        const issue = spacingIssue.issue;
-
-        if (issue === reconstructionIssues.MISSING_FRAMES) {
-          missingFrames += spacingIssue.missingFrames;
-        } else if (issue === reconstructionIssues.IRREGULAR_SPACING) {
-          return { value: false };
+        if (datasetIs4D && spacingBetweenFrames < 1.e-3) {
+          // the dataset is 4D, if the distance is zero, means that we are
+          // checking the 4th dimension. Do not return, since we want still to
+          // check the 3rd dimension spacing.
+          continue;
         }
-      }
 
-      previousImagePositionPatient = ImagePositionPatient;
+        const spacingIssue = _getSpacingIssue(
+          spacingBetweenFrames,
+          averageSpacingBetweenFrames
+        );
+
+        if (spacingIssue) {
+          const issue = spacingIssue.issue;
+
+          if (issue === ReconstructionIssues.MISSING_FRAMES) {
+            missingFrames += spacingIssue.missingFrames;
+          } else if (issue === ReconstructionIssues.IRREGULAR_SPACING) {
+            reconstructionIssues.push(issue);
+            break;
+          }
+        }
+
+        previousImagePositionPatient = ImagePositionPatient;
+      }
     }
   }
 
-  return { value: true, missingFrames };
+  return { isUniform: reconstructionIssues.length === 0 ? true : false, missingFrames, reconstructionIssues };
 }
 
-function _isSameOrientation(iop1, iop2) {
+
+/**
+ *  Check if 4D dataset.
+ *
+ *  Assuming that slices at different time have the same position, here we just check if
+ *  there are multiple slices for the same ImagePositionPatient and disable MPR.
+ *
+ *  A better heuristic would be checking 4D tags, e.g. the presence of multiple TemporalPositionIdentifier values.
+ *  However, some studies (e.g. https://github.com/OHIF/Viewers/issues/2113) do not have such tags.
+ *
+ * @param {Object[]} instances An array of `OHIFInstanceMetadata` objects.
+ *
+ * @returns {boolean} dataset4D value.
+ */
+ function _isDataset4D(instances) {
+  const n = instances.length;
+  for (let ii = 0; ii < n; ++ii) {
+    const instanceMetadataControl = instances[ii].getData().metadata;
+    if (
+      !instanceMetadataControl ||
+      instanceMetadataControl === undefined ||
+      !instanceMetadataControl.ImagePositionPatient ||
+      instanceMetadataControl.ImagePositionPatient === undefined
+    ) {
+      continue;
+    }
+    for (let jj = ii + 1; jj < n; ++jj) {
+      const instanceMetadata = instances[jj].getData().metadata;
+      if (
+        !instanceMetadata ||
+        instanceMetadata === undefined ||
+        !instanceMetadata.ImagePositionPatient ||
+        instanceMetadata.ImagePositionPatient === undefined
+      ) {
+        continue;
+      }
+
+      if (_isSameArray(instanceMetadataControl.ImagePositionPatient, instanceMetadata.ImagePositionPatient)) {
+        return true;
+      }
+    }
+  }
+
+  return false;
+}
+
+function _isSameArray(iop1, iop2) {
   if (iop1 === undefined || !iop2 === undefined) {
     return;
   }
@@ -156,12 +254,12 @@ function _getSpacingIssue(spacing, averageSpacing) {
 
   if (errorForEachSpacing < spacingTolerance * averageSpacing) {
     return {
-      issue: reconstructionIssues.MISSING_FRAMES,
+      issue: ReconstructionIssues.MISSING_FRAMES,
       missingFrames: numberOfSpacings - 1,
     };
   }
 
-  return { issue: reconstructionIssues.IRREGULAR_SPACING };
+  return { issue: ReconstructionIssues.IRREGULAR_SPACING };
 }
 
 function _getPerpendicularDistance(a, b) {
@@ -173,7 +271,5 @@ function _getPerpendicularDistance(a, b) {
 }
 
 const constructableModalities = ['MR', 'CT', 'PT', 'NM'];
-const reconstructionIssues = {
-  MISSING_FRAMES: 'missingframes',
-  IRREGULAR_SPACING: 'irregularspacing',
-};
+
+export {isDisplaySetReconstructable, isSpacingUniform};

platform/core/src/utils/loadAndCacheDerivedDisplaySets.js

@@ -45,13 +45,13 @@ import studyMetadataManager from './studyMetadataManager';
  * @param {string} referencedDisplaySet.studyInstanceUid
  * @param {Array} referencedDisplaySet.sopClassUids
  * @param {Study[]} studies Collection of studies
+ * @param {object} logger
+ * @param {object} snackbar
  * @returns void
  */
-const loadAndCacheDerivedDisplaySets = (referencedDisplaySet, studies) => {
+async function loadAndCacheDerivedDisplaySets(referencedDisplaySet, studies, logger, snackbar) {
   const { StudyInstanceUID, SeriesInstanceUID } = referencedDisplaySet;
-
   const promises = [];
-
   const studyMetadata = studyMetadataManager.get(StudyInstanceUID);
 
   if (!studyMetadata) {
@@ -80,11 +80,10 @@ const loadAndCacheDerivedDisplaySets = (referencedDisplaySet, studies) => {
   });
 
   // For each type, see if any are loaded, if not load the most recent.
-  Object.keys(displaySetsPerModality).forEach(key => {
+  await Promise.all(Object.keys(displaySetsPerModality).map(async (key) => {
     const displaySets = displaySetsPerModality[key];
 
     const isLoaded = displaySets.some(displaySet => displaySet.isLoaded);
-
     if (isLoaded) {
       return;
     }
@@ -107,12 +106,34 @@ const loadAndCacheDerivedDisplaySets = (referencedDisplaySet, studies) => {
       }
     });
 
-    recentDisplaySet.isLoading = true;
+    try {
+      if (recentDisplaySet.hasOwnProperty('getSourceDisplaySet') &&
+        typeof recentDisplaySet.getSourceDisplaySet === 'function') {
+        await recentDisplaySet.getSourceDisplaySet(studies);
+      } else {
+        await recentDisplaySet.load(referencedDisplaySet, studies);
+      }
+    } catch (error) {
+      recentDisplaySet.isLoaded = false;
+      recentDisplaySet.loadError = true;
+      logger.error({ error, message: error.message });
+      snackbar.show({
+        title: 'Error loading derived display set:',
+        message: error.message,
+        type: 'error',
+        error,
+        autoClose: false,
+      });
+    }
+  }));
 
-    promises.push(recentDisplaySet.load(referencedDisplaySet, studies));
-  });
-
-  return promises;
+  /*
+  * TODO: Improve the way we notify parts of the app
+  * that depends on derived display sets to be loaded.
+  * (Implement pubsub for better tracking of derived display sets)
+  */
+  const event = new CustomEvent('deriveddisplaysetsloadedandcached');
+  document.dispatchEvent(event);
 };
 
 export default loadAndCacheDerivedDisplaySets;

platform/core/src/utils/metadataProvider/fetchOverlayData.js

@@ -4,6 +4,7 @@ import str2ab from '../str2ab';
 import unpackOverlay from './unpackOverlay';
 
 import errorHandler from '../../errorHandler';
+import getXHRRetryRequestHook from '../xhrRetryRequestHook';
 
 export default async function fetchOverlayData(instance, server) {
   const OverlayDataPromises = [];
@@ -69,6 +70,7 @@ async function _getOverlayData(tag, server) {
     url: server.wadoRoot, //BulkDataURI is absolute, so this isn't used
     headers: DICOMWeb.getAuthorizationHeader(server),
     errorInterceptor: errorHandler.getHTTPErrorHandler(),
+    requestHooks: [getXHRRetryRequestHook()],
   };
   const dicomWeb = new api.DICOMwebClient(config);
   const options = {

platform/core/src/utils/metadataProvider/fetchPaletteColorLookupTableData.js

@@ -3,6 +3,7 @@ import DICOMWeb from '../../DICOMWeb';
 import str2ab from '../str2ab';
 
 import errorHandler from '../../errorHandler';
+import getXHRRetryRequestHook from '../xhrRetryRequestHook';
 
 export default async function fetchPaletteColorLookupTableData(
   instance,
@@ -141,6 +142,7 @@ function _getPaletteColor(server, paletteColorLookupTableData, lutDescriptor) {
       url: server.wadoRoot, //BulkDataURI is absolute, so this isn't used
       headers: DICOMWeb.getAuthorizationHeader(server),
       errorInterceptor: errorHandler.getHTTPErrorHandler(),
+      requestHooks: [getXHRRetryRequestHook()],
     };
     const dicomWeb = new api.DICOMwebClient(config);
     const options = {

platform/core/src/utils/metadataProvider/validNumber.js

@@ -0,0 +1,9 @@
+const validNumber = val => {
+  if (Array.isArray(val)) {
+    return val.map(v => (v !== undefined ? Number(v) : v));
+  } else {
+    return val !== undefined ? Number(val) : val;
+  }
+};
+
+export default validNumber;

platform/core/src/utils/xhrRetryRequestHook.js

@@ -0,0 +1,103 @@
+import retry from 'retry';
+
+const defaultRetryOptions = {
+  retries: 5,
+  factor: 3,
+  minTimeout: 1 * 1000,
+  maxTimeout: 60 * 1000,
+  randomize: true,
+  retryableStatusCodes: [429, 500],
+};
+
+let retryOptions = { ...defaultRetryOptions };
+
+/**
+ * Request hook used to add retry functionality to XHR requests.
+ *
+ * @param {XMLHttpRequest} request XHR request instance
+ * @param {object} metadata Metadata about the request
+ * @param {object} metadata.url URL
+ * @param {object} metadata.method HTTP method
+ * @returns {XMLHttpRequest} request instance optionally modified
+ */
+const xhrRetryRequestHook = (request, metadata) => {
+  const { url, method } = metadata;
+
+  function faultTolerantRequestSend(...args) {
+    const operation = retry.operation(retryOptions);
+
+    operation.attempt(function operationAttempt(currentAttempt) {
+      const originalOnReadyStateChange = request.onreadystatechange;
+
+      /** Overriding/extending XHR function */
+      request.onreadystatechange = function onReadyStateChange(...args) {
+        originalOnReadyStateChange.apply(request, args);
+
+        if (retryOptions.retryableStatusCodes.includes(request.status)) {
+          const errorMessage = `Attempt to request ${url} failed.`;
+          const attemptFailedError = new Error(errorMessage);
+          operation.retry(attemptFailedError);
+        }
+      };
+
+      /** Call open only on retry (after headers and other things were set in the xhr instance) */
+      if (currentAttempt > 1) {
+        console.warn(`Requesting ${url}... (attempt: ${currentAttempt})`);
+        request.open(method, url, true);
+      }
+    });
+
+    originalRequestSend.apply(request, args);
+  }
+
+  /** Overriding/extending XHR function */
+  const originalRequestSend = request.send;
+  request.send = faultTolerantRequestSend;
+
+  return request;
+};
+
+/**
+ * Returns a configured retry request hook function
+ * that can be used to add retry functionality to XHR request.
+ *
+ * Default options:
+ *   retries: 5
+ *   factor: 3
+ *   minTimeout: 1 * 1000
+ *   maxTimeout: 60 * 1000
+ *   randomize: true
+ *
+ * @param {object} options
+ * @param {number} options.retires number of retries
+ * @param {number} options.factor factor
+ * @param {number} options.minTimeout the min timeout
+ * @param {number} options.maxTimeout the max timeout
+ * @param {boolean} options.randomize randomize
+ * @param {array} options.retryableStatusCodes status codes that can trigger retry
+ * @returns {function} the configured retry request function
+ */
+export const getXHRRetryRequestHook = (options = {}) => {
+  retryOptions = { ...defaultRetryOptions };
+  if ('retries' in options) {
+    retryOptions.retries = options.retries;
+  }
+  if ('factor' in options) {
+    retryOptions.factor = options.factor;
+  }
+  if ('minTimeout' in options) {
+    retryOptions.minTimeout = options.minTimeout;
+  }
+  if ('maxTimeout' in options) {
+    retryOptions.maxTimeout = options.maxTimeout;
+  }
+  if ('randomize' in options) {
+    retryOptions.randomize = options.randomize;
+  }
+  if ('retryableStatusCodes' in options) {
+    retryOptions.retryableStatusCodes = options.retryableStatusCodes;
+  }
+  return xhrRetryRequestHook;
+};
+
+export default getXHRRetryRequestHook;

platform/ui/CHANGELOG.md

@@ -3,6 +3,49 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [1.9.2](https://github.com/OHIF/Viewers/compare/@ohif/ui@1.9.1...@ohif/ui@1.9.2) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/ui
+
+
+
+
+
+## [1.9.1](https://github.com/OHIF/Viewers/compare/@ohif/ui@1.9.0...@ohif/ui@1.9.1) (2021-03-26)
+
+**Note:** Version bump only for package @ohif/ui
+
+
+
+
+
+# [1.9.0](https://github.com/OHIF/Viewers/compare/@ohif/ui@1.8.2...@ohif/ui@1.9.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [1.8.2](https://github.com/OHIF/Viewers/compare/@ohif/ui@1.8.1...@ohif/ui@1.8.2) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/ui
+
+
+
+
+
+## [1.8.1](https://github.com/OHIF/Viewers/compare/@ohif/ui@1.8.0...@ohif/ui@1.8.1) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/ui
+
+
+
+
+
 # [1.8.0](https://github.com/OHIF/Viewers/compare/@ohif/ui@1.7.1...@ohif/ui@1.8.0) (2020-12-10)
 
 

platform/ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/ui",
-  "version": "1.8.0",
+  "version": "1.9.2",
   "description": "A set of React components for Medical Imaging Viewers",
   "author": "OHIF Contributors",
   "license": "MIT",

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

@@ -32,6 +32,10 @@
     max-height: 90vh;
     overflow-y: auto;
 
+  &.noScroll &__content {
+    overflow: hidden;
+  }
+
   &:not(.visibleScrollbar) &__content
     overflow-x: hidden;
     scrollbar-width: none;

platform/ui/src/components/snackbar/Snackbar.css

@@ -156,19 +156,50 @@
   transition: all 300ms ease;
 }
 
-.sb-success {
+.sb-item .sb-action,
+.sb-error .sb-action,
+.sb-warning .sb-action,
+.sb-info .sb-action,
+.sb-success .sb-action {
+  margin-top: 10px;
+  display: inline-block;
+  padding: 6px 12px;
+  margin-bottom: 0;
+  font-size: 14px;
+  font-weight: 400;
+  line-height: 1.42857143;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: middle;
+  -ms-touch-action: manipulation;
+  touch-action: manipulation;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  background-image: none;
+  border: none;
+  color: white;
+}
+
+.sb-success,
+.sb-success .sb-action {
   background-color: var(--snackbar-success);
 }
 
-.sb-error {
+.sb-error,
+.sb-error .sb-action {
   background-color: var(--snackbar-error);
 }
 
-.sb-warning {
+.sb-warning,
+.sb-warning .sb-action {
   background-color: var(--snackbar-warning);
 }
 
-.sb-info {
+.sb-info,
+.sb-info .sb-action {
   background-color: var(--snackbar-info);
 }
 

platform/ui/src/components/snackbar/SnackbarItem.js

@@ -1,10 +1,14 @@
-import React, { useState, useEffect } from 'react';
+import React, { useEffect } from 'react';
 
 const SnackbarItem = ({ options, onClose }) => {
   const handleClose = () => {
     onClose(options.id);
   };
 
+  const handleClick = () => {
+    options.action.onClick({ ...options, close: handleClose });
+  };
+
   useEffect(() => {
     if (options.autoClose) {
       setTimeout(() => {
@@ -24,6 +28,11 @@ const SnackbarItem = ({ options, onClose }) => {
       </span>
       {options.title && <div className="sb-title">{options.title}</div>}
       {options.message && <div className="sb-message">{options.message}</div>}
+      {options.action && (
+        <button className="sb-action" onClick={handleClick}>
+          {options.action.label}
+        </button>
+      )}
     </div>
   );
 };

platform/ui/src/components/studyBrowser/ImageThumbnail.js

@@ -3,6 +3,7 @@ import './ImageThumbnail.styl';
 
 import { utils } from '@ohif/core';
 import React, { useState, useEffect, createRef } from 'react';
+import classNames from 'classnames';
 
 import PropTypes from 'prop-types';
 import ViewportErrorIndicator from '../../viewer/ViewportErrorIndicator';
@@ -15,6 +16,7 @@ import ViewportLoadingIndicator from '../../viewer/ViewportLoadingIndicator';
 //import cornerstone from 'cornerstone-core';
 function ImageThumbnail(props) {
   const {
+    active,
     width,
     height,
     imageSrc,
@@ -97,7 +99,7 @@ function ImageThumbnail(props) {
   }, [fetchImagePromise, image.imageId, imageId, purgeCancelablePromise, setImagePromise]);
 
   return (
-    <div className="ImageThumbnail">
+    <div className={classNames('ImageThumbnail', { active: active })}>
       <div className="image-thumbnail-canvas">
         {shouldRenderToCanvas() ? (
           <canvas ref={canvasRef} width={width} height={height} />
@@ -126,6 +128,7 @@ function ImageThumbnail(props) {
 }
 
 ImageThumbnail.propTypes = {
+  active: PropTypes.bool,
   imageSrc: PropTypes.string,
   imageId: PropTypes.string,
   error: PropTypes.bool,
@@ -135,6 +138,7 @@ ImageThumbnail.propTypes = {
 };
 
 ImageThumbnail.defaultProps = {
+  active: false,
   error: false,
   stackPercentComplete: 0,
   width: 217,

platform/ui/src/components/studyBrowser/ImageThumbnail.styl

@@ -6,7 +6,7 @@
   --sidebar-transition: all 0.3s ease;
 }
 
-.ThumbnailEntry.active .ImageThumbnail
+.ImageThumbnail.active
   border-color: var(--active-color);
   box-shadow: none
   transition: var(--sidebar-transition);
@@ -14,7 +14,7 @@
 .ImageThumbnail
   background-color: var(--primary-background-color);
   box-shadow: inset 0 0 0 1px var(--ui-border-color-dark);
-  border: 5px solid transparent
+  border: 2px solid transparent
   border-radius: 12px
   height: 135px
   margin: 0 auto

platform/ui/src/components/studyBrowser/StudyBrowser.js

@@ -20,6 +20,7 @@ function StudyBrowser(props) {
             return study.thumbnails.map((thumb, thumbIndex) => {
               // TODO: Thumb has more props than we care about?
               const {
+                active,
                 altImageText,
                 displaySetInstanceUID,
                 imageId,
@@ -28,6 +29,7 @@ function StudyBrowser(props) {
                 SeriesDescription,
                 SeriesNumber,
                 stackPercentComplete,
+                hasWarnings,
               } = thumb;
 
               return (
@@ -37,6 +39,7 @@ function StudyBrowser(props) {
                   data-cy="thumbnail-list"
                 >
                   <Thumbnail
+                    active={active}
                     supportsDrag={supportsDrag}
                     key={`${studyIndex}_${thumbIndex}`}
                     id={`${studyIndex}_${thumbIndex}`} // Unused?
@@ -50,6 +53,7 @@ function StudyBrowser(props) {
                     numImageFrames={numImageFrames}
                     SeriesDescription={SeriesDescription}
                     SeriesNumber={SeriesNumber}
+                    hasWarnings={hasWarnings}
                     stackPercentComplete={stackPercentComplete}
                     // Events
                     onClick={onThumbnailClick.bind(

platform/ui/src/components/studyBrowser/Thumbnail.js

@@ -1,8 +1,11 @@
-import React from 'react';
+import React, { useState, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { useDrag } from 'react-dnd';
 import ImageThumbnail from './ImageThumbnail';
 import classNames from 'classnames';
+import { Icon } from './../../elements/Icon';
+import { Tooltip } from './../tooltip';
+import { OverlayTrigger } from './../overlayTrigger';
 
 import './Thumbnail.styl';
 
@@ -11,7 +14,22 @@ function ThumbnailFooter({
   SeriesNumber,
   InstanceNumber,
   numImageFrames,
+  hasWarnings
 }) {
+  const [inconsistencyWarnings, inconsistencyWarningsSet] = useState([]);
+
+  useEffect(() => {
+    let unmounted = false
+    hasWarnings.then(response => {
+      if (!unmounted) {
+        inconsistencyWarningsSet(response)
+      }
+    })
+    return () => {
+      unmounted = true
+    }
+  }, [])
+
   const infoOnly = !SeriesDescription;
 
   const getInfo = (value, icon, className = '') => {
@@ -22,28 +40,73 @@ function ThumbnailFooter({
       </div>
     );
   };
+
+  const getWarningContent = (inconsistencyWarnings) => {
+    if (Array.isArray(inconsistencyWarnings)) {
+      const listedWarnings = inconsistencyWarnings.map((warn, index) => {
+        return <li key={index}>{warn}</li>;
+      });
+
+      return <ol>{listedWarnings}</ol>;
+    } else {
+      return <React.Fragment>{inconsistencyWarnings}</React.Fragment>;
+    }
+  };
+
+  const getWarningInfo = (SeriesNumber, inconsistencyWarnings) => {
+      return(
+        <React.Fragment>
+        {inconsistencyWarnings && inconsistencyWarnings.length != 0 ? (
+          <OverlayTrigger
+            key={SeriesNumber}
+            placement="left"
+            overlay={
+              <Tooltip
+                placement="left"
+                className="in tooltip-warning"
+                id="tooltip-left"
+              >
+                <div className="warningTitle">Series Inconsistencies</div>
+                <div className="warningContent">{getWarningContent(inconsistencyWarnings)}</div>
+              </Tooltip>
+            }
+          >
+            <div className={classNames('warning')}>
+              <span className="warning-icon">
+                <Icon name="exclamation-triangle" />
+              </span>
+            </div>
+          </OverlayTrigger>
+        ) : (
+          <React.Fragment></React.Fragment>
+          )}
+      </React.Fragment>
+      );
+  };
   const getSeriesInformation = (
     SeriesNumber,
     InstanceNumber,
-    numImageFrames
+    numImageFrames,
+    inconsistencyWarnings
   ) => {
     if (!SeriesNumber && !InstanceNumber && !numImageFrames) {
       return;
     }
-
-    return (
+    const seriesInformation =
       <div className="series-information">
         {getInfo(SeriesNumber, 'S:')}
         {getInfo(InstanceNumber, 'I:')}
         {getInfo(numImageFrames, '', 'image-frames')}
+        {getWarningInfo(SeriesNumber, inconsistencyWarnings)}
       </div>
-    );
+
+    return (seriesInformation);
   };
 
   return (
     <div className={classNames('series-details', { 'info-only': infoOnly })}>
       <div className="series-description">{SeriesDescription}</div>
-      {getSeriesInformation(SeriesNumber, InstanceNumber, numImageFrames)}
+      {getSeriesInformation(SeriesNumber, InstanceNumber, numImageFrames, inconsistencyWarnings)}
     </div>
   );
 }
@@ -60,6 +123,7 @@ function Thumbnail(props) {
     numImageFrames,
     SeriesDescription,
     SeriesNumber,
+    hasWarnings,
     stackPercentComplete,
     StudyInstanceUID,
     onClick,
@@ -95,6 +159,7 @@ function Thumbnail(props) {
       {/* SHOW IMAGE */}
       {hasImage && (
         <ImageThumbnail
+          active={active}
           imageSrc={imageSrc}
           imageId={imageId}
           error={error}
@@ -126,13 +191,14 @@ Thumbnail.propTypes = {
   stackPercentComplete: PropTypes.number,
   /**
   altImageText will be used when no imageId or imageSrc is provided.
-It will be displayed inside the <div>. This is useful when it is difficult
+  It will be displayed inside the <div>. This is useful when it is difficult
   to make a preview for a type of DICOM series (e.g. DICOM-SR)
   */
   altImageText: PropTypes.string,
   SeriesDescription: PropTypes.string,
   SeriesNumber: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
   InstanceNumber: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+  hasWarnings: PropTypes.instanceOf(Promise),
   numImageFrames: PropTypes.number,
   onDoubleClick: PropTypes.func,
   onClick: PropTypes.func,

platform/ui/src/components/studyBrowser/Thumbnail.styl

@@ -2,8 +2,15 @@
 
 :root {
   --series-count-background-color: #678696;
+  --active-color: #20A5D6;
 }
 
+.thumbnail.active
+  .alt-image-text
+    border-color: var(--active-color);
+    box-shadow: none
+    transition: var(--sidebar-transition);
+
 .thumbnail
   cursor: pointer
   display: table
@@ -16,7 +23,7 @@
     justify-content: center;
     background-color: var(--primary-background-color);
     box-shadow: inset 0 0 0 1px var(--ui-border-color-dark);
-    border: 5px solid transparent;
+    border: 2px solid transparent;
     border-radius: 12px;
     height: 135px;
     margin: 0 auto;
@@ -78,6 +85,17 @@
           height: 11px
           width: 11px
 
+    .warning
+      margin: auto 0;
+      opacity: 1
+      color: #e29e4a;
+
+      svg
+        width: 16px;
+        height: 14px;
+        pointer-events: inherit;
+
+
     .value
       color: var(--text-secondary-color);
       display: inline-block

platform/ui/src/contextProviders/LoggerProvider.js

@@ -0,0 +1,104 @@
+import React, { useState, createContext, useContext, useEffect } from 'react';
+import PropTypes from 'prop-types';
+
+const LoggerContext = createContext(null);
+const { Provider } = LoggerContext;
+
+export const useLogger = () => useContext(LoggerContext);
+
+const LoggerProvider = ({ children, service }) => {
+  const [state, setState] = useState({
+    errors: [],
+    infos: [],
+  });
+
+  useEffect(() => {
+    const onErrorHandler = ({ error: errorObject, message }) => {
+      error({ error: errorObject, message });
+    };
+    window.addEventListener('error', onErrorHandler);
+    return () => {
+      window.removeEventListener('error', onErrorHandler);
+    };
+  }, []);
+
+  /**
+   * Logs an error
+   *
+   * @param {object} props { error, stack, message, displayOnConsole }
+   * @returns void
+   */
+  const error = ({
+    error = {},
+    stack = '',
+    message = '',
+    displayOnConsole = true,
+  }) => {
+    const errorObject = { error, stack, message, displayOnConsole };
+    setState(state => ({ ...state, errors: [...state.errors, errorObject] }));
+
+    if (displayOnConsole) {
+      console.error(error);
+    }
+  };
+
+  /**
+   * Logs an info
+   *
+   * @param {object} props { message, displayOnConsole }
+   * @returns void
+   */
+  const info = ({ message = '', displayOnConsole = true }) => {
+    setState(state => ({
+      ...state,
+      infos: state.infos.push({ message, displayOnConsole }),
+    }));
+
+    if (displayOnConsole) {
+      console.info(message);
+    }
+  };
+
+  /**
+   * Sets the implementation of a log service that can be used by extensions
+   *
+   * @returns void
+   */
+  useEffect(() => {
+    if (service) {
+      service.setServiceImplementation({ error, info });
+    }
+  }, [error, service, info]);
+
+  return <Provider value={{ info, error, state }}>{children}</Provider>;
+};
+
+/**
+ * Higher Order Component to use the log methods through a Class Component
+ *
+ * @returns
+ */
+export const withLogger = Component => {
+  return function WrappedComponent(props) {
+    const { error, info, state } = useLogger();
+    return <Component {...props} logger={{ error, info, state }} />;
+  };
+};
+
+LoggerProvider.defaultProps = {
+  service: null,
+};
+
+LoggerProvider.propTypes = {
+  children: PropTypes.oneOfType([
+    PropTypes.arrayOf(PropTypes.node),
+    PropTypes.node,
+  ]).isRequired,
+  service: PropTypes.shape({
+    setServiceImplementation: PropTypes.func,
+  }),
+};
+
+export default LoggerProvider;
+
+export const LogConsumer = LoggerContext.Consumer;

platform/ui/src/contextProviders/ModalProvider.js

@@ -82,14 +82,20 @@ const ModalProvider = ({ children, modal: Modal, service }) => {
     shouldCloseOnEsc,
     fullscreen,
     closeButton,
-    showScrollbar
+    showScrollbar,
+    noScroll,
   } = options;
 
   return (
     <Provider value={{ show, hide }}>
       {ModalContent && (
         <Modal
-          className={classNames(customClassName, ModalContent.className, { 'visibleScrollbar': showScrollbar })}
+          className={classNames(
+            customClassName,
+            ModalContent.className,
+            { visibleScrollbar: showScrollbar },
+            { noScroll }
+          )}
           shouldCloseOnEsc={shouldCloseOnEsc}
           isOpen={isOpen}
           title={title}

platform/ui/src/contextProviders/SnackbarProvider.js

@@ -22,6 +22,7 @@ const SnackbarProvider = ({ children, service }) => {
     autoClose: true,
     position: 'bottomRight',
     type: SnackbarTypes.INFO,
+    action: null,
   };
 
   const [count, setCount] = useState(1);

platform/ui/src/contextProviders/index.js

@@ -18,3 +18,8 @@ export {
   withDialog,
   useDialog,
 } from './DialogProvider.js';
+export {
+  default as LoggerProvider,
+  withLogger,
+  useLogger,
+} from './LoggerProvider.js';

platform/ui/src/elements/form/Range.js

@@ -28,7 +28,13 @@ class Range extends Component {
           className="range"
         />
         {this.props.showPercentage && <span>{`${this.state.value}%`}</span>}
-        {this.props.showValue && <span>{this.state.value}</span>}
+        {this.props.showValue && (
+          <span>
+            {this.props.valueRenderer
+              ? this.props.valueRenderer(this.state.value)
+              : this.state.value}
+          </span>
+        )}
       </>
     );
   }
@@ -40,6 +46,7 @@ Range.propTypes = {
   max: PropTypes.number.isRequired,
   step: PropTypes.number,
   id: PropTypes.string,
+  valueRenderer: PropTypes.func,
   onChange: PropTypes.func,
   showPercentage: PropTypes.bool,
   showValue: PropTypes.bool,

platform/ui/src/index.js

@@ -30,7 +30,7 @@ import {
   AboutContent,
   OHIFModal,
   ErrorBoundary,
-  ErrorPage
+  ErrorPage,
 } from './components';
 import { useDebounce, useMedia } from './hooks';
 
@@ -66,6 +66,9 @@ import {
   ModalConsumer,
   useModal,
   withModal,
+  LoggerProvider,
+  withLogger,
+  useLogger,
 } from './contextProviders';
 
 export {
@@ -127,11 +130,14 @@ export {
   useDialog,
   ErrorBoundary,
   ErrorPage,
+  LoggerProvider,
+  withLogger,
+  useLogger,
   // Hooks
   useDebounce,
   useMedia,
   // Utils
   ViewerbaseDragDropContext,
   asyncComponent,
-  retryImport
+  retryImport,
 };

platform/viewer/CHANGELOG.md

@@ -3,6 +3,275 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [4.9.20](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.19...@ohif/viewer@4.9.20) (2021-06-03)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.19](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.18...@ohif/viewer@4.9.19) (2021-06-03)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.18](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.17...@ohif/viewer@4.9.18) (2021-06-02)
+
+
+### Bug Fixes
+
+* **dicom-html:** Add parsed dicom meta info section ([#2419](https://github.com/OHIF/Viewers/issues/2419)) ([403688b](https://github.com/OHIF/Viewers/commit/403688b18c52468fc1101166ec0c1734fb710039))
+
+
+
+
+
+## [4.9.17](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.16...@ohif/viewer@4.9.17) (2021-05-17)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+
+## [4.9.16](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.15...@ohif/viewer@4.9.16) (2021-05-14)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.15](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.14...@ohif/viewer@4.9.15) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.14](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.13...@ohif/viewer@4.9.14) (2021-04-22)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.13](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.12...@ohif/viewer@4.9.13) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.12](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.11...@ohif/viewer@4.9.12) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.11](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.10...@ohif/viewer@4.9.11) (2021-04-21)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.10](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.9...@ohif/viewer@4.9.10) (2021-04-16)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.9](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.8...@ohif/viewer@4.9.9) (2021-04-15)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.8](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.7...@ohif/viewer@4.9.8) (2021-03-31)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.7](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.6...@ohif/viewer@4.9.7) (2021-03-26)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.6](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.5...@ohif/viewer@4.9.6) (2021-03-26)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.5](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.4...@ohif/viewer@4.9.5) (2021-03-25)
+
+
+### Bug Fixes
+
+* IDC-2288: Update toolbar tabs after derived displayset loaded ([#2307](https://github.com/OHIF/Viewers/issues/2307)) ([6e723eb](https://github.com/OHIF/Viewers/commit/6e723ebced58852007ca553792c740976cfc4201))
+
+
+
+
+
+## [4.9.4](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.3...@ohif/viewer@4.9.4) (2021-03-19)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.3](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.2...@ohif/viewer@4.9.3) (2021-03-15)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.2](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.1...@ohif/viewer@4.9.2) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.9.1](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.9.0...@ohif/viewer@4.9.1) (2021-03-09)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+# [4.9.0](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.12...@ohif/viewer@4.9.0) (2021-03-04)
+
+
+### Features
+
+* **log:** add new log service ([14d6454](https://github.com/OHIF/Viewers/commit/14d6454eafaa2ccb50e133c2945c9558052ea27e))
+
+
+
+
+
+## [4.8.12](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.11...@ohif/viewer@4.8.12) (2021-03-03)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.11](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.10...@ohif/viewer@4.8.11) (2021-02-25)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.10](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.9...@ohif/viewer@4.8.10) (2021-02-08)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.9](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.8...@ohif/viewer@4.8.9) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.8](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.7...@ohif/viewer@4.8.8) (2021-02-05)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.7](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.6...@ohif/viewer@4.8.7) (2021-01-28)
+
+
+### Bug Fixes
+
+* **config:** Update Google Healthcare API endpoint from v1beta1 to v1 ([#2256](https://github.com/OHIF/Viewers/issues/2256)) ([83b7d9e](https://github.com/OHIF/Viewers/commit/83b7d9e8b4240a928eb43735280000e97f186d90))
+
+
+
+
+
+## [4.8.6](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.5...@ohif/viewer@4.8.6) (2021-01-26)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.5](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.4...@ohif/viewer@4.8.5) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.4](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.3...@ohif/viewer@4.8.4) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.3](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.2...@ohif/viewer@4.8.3) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [4.8.2](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.1...@ohif/viewer@4.8.2) (2021-01-21)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
 ## [4.8.1](https://github.com/OHIF/Viewers/compare/@ohif/viewer@4.8.0...@ohif/viewer@4.8.1) (2020-12-10)
 
 **Note:** Version bump only for package @ohif/viewer