@ohif/app 3.9.0-beta.57 → 3.9.0-beta.59

package/dist/{994.bundle.c4709bfb7fd9dcde0551.js → 994.bundle.3b5f396b62cce2990c03.js}

@@ -1329,6 +1329,7 @@ function PanelStudyBrowserTracking({
   const [activeTabName, setActiveTabName] = (0,react.useState)('primary');
   const [expandedStudyInstanceUIDs, setExpandedStudyInstanceUIDs] = (0,react.useState)([...StudyInstanceUIDs]);
   const [studyDisplayList, setStudyDisplayList] = (0,react.useState)([]);
+  const [hasLoadedViewports, setHasLoadedViewports] = (0,react.useState)(false);
   const [displaySets, setDisplaySets] = (0,react.useState)([]);
   const [displaySetsLoadingState, setDisplaySetsLoadingState] = (0,react.useState)({});
   const [thumbnailImageSrcMap, setThumbnailImageSrcMap] = (0,react.useState)({});
@@ -1401,6 +1402,16 @@ function PanelStudyBrowserTracking({
 
   // ~~ Initial Thumbnails
   (0,react.useEffect)(() => {
+    if (!hasLoadedViewports) {
+      if (activeViewportId) {
+        // Once there is an active viewport id, it means the layout is ready
+        // so wait a bit of time to allow the viewports preferential loading
+        // which improves user experience of responsiveness significantly on slower
+        // systems.
+        window.setTimeout(() => setHasLoadedViewports(true), 250);
+      }
+      return;
+    }
     const currentDisplaySets = displaySetService.activeDisplaySets;
     if (!currentDisplaySets.length) {
       return;
@@ -1424,7 +1435,7 @@ function PanelStudyBrowserTracking({
         };
       });
     });
-  }, [displaySetService, dataSource, getImageSrc]);
+  }, [displaySetService, dataSource, getImageSrc, activeViewportId, hasLoadedViewports]);
 
   // ~~ displaySets
   (0,react.useEffect)(() => {
@@ -1458,6 +1469,9 @@ function PanelStudyBrowserTracking({
   (0,react.useEffect)(() => {
     // DISPLAY_SETS_ADDED returns an array of DisplaySets that were added
     const SubscriptionDisplaySetsAdded = displaySetService.subscribe(displaySetService.EVENTS.DISPLAY_SETS_ADDED, data => {
+      if (!hasLoadedViewports) {
+        return;
+      }
       const {
         displaySetsAdded,
         options