fix(segmentation): black preview when loading a seg, and crash on opening panel (#4602)

extensions/cornerstone/src/panels/PanelSegmentation.tsx

@@ -243,13 +243,15 @@ export default function PanelSegmentation({
     const firstImageId = referencedImageIds[0];
 
     const instance = metaData.get('instance', firstImageId);
-    const { SOPInstanceUID, SeriesInstanceUID } = instance;
+    const SOPInstanceUID = instance.SOPInstanceUID || instance.SopInstanceUID;
+    const SeriesInstanceUID = instance.SeriesInstanceUID;
 
     const displaySet = displaySetService.getDisplaySetForSOPInstanceUID(
       SOPInstanceUID,
       SeriesInstanceUID
     );
-    const isExportable = displaySet.isReconstructable;
+
+    const isExportable = displaySet?.isReconstructable;
 
     return {
       segmentationId,

extensions/cornerstone/src/services/SegmentationService/SegmentationService.ts

@@ -7,6 +7,7 @@ import {
   imageLoader,
   Types as csTypes,
   utilities as csUtils,
+  metaData,
 } from '@cornerstonejs/core';
 import {
   Enums as csToolsEnums,
@@ -360,11 +361,11 @@ class SegmentationService extends PubSubService {
           options.segments && Object.keys(options.segments).length > 0
             ? options.segments
             : {
-                1: {
-                  label: 'Segment 1',
-                  active: true,
-                },
+              1: {
+                label: 'Segment 1',
+                active: true,
               },
+            },
         cachedStats: {
           info: `S${displaySet.SeriesNumber}: ${displaySet.SeriesDescription}`,
         },
@@ -381,8 +382,8 @@ class SegmentationService extends PubSubService {
       segmentationId?: string;
       type: SegmentationRepresentations;
     } = {
-      type: LABELMAP,
-    }
+        type: LABELMAP,
+      }
   ): Promise<string> {
     const { type } = options;
     let { segmentationId } = options;
@@ -414,7 +415,10 @@ class SegmentationService extends PubSubService {
       imageIds as string[]
     );
 
-    segDisplaySet.images = derivedSegmentationImages;
+    segDisplaySet.images = derivedSegmentationImages.map(image => ({
+      ...image,
+      ...metaData.get('instance', image.referencedImageId),
+    }));
 
     const segmentsInfo = segDisplaySet.segMetadata.data;
 
@@ -531,8 +535,8 @@ class SegmentationService extends PubSubService {
       segmentationId?: string;
       type: SegmentationRepresentations;
     } = {
-      type: CONTOUR,
-    }
+        type: CONTOUR,
+      }
   ): Promise<string> {
     const { type } = options;
     let { segmentationId } = options;

extensions/default/src/DicomLocalDataSource/index.js

@@ -221,7 +221,8 @@ function createDicomLocalApi(dicomLocalConfig) {
       //   return instance.imageId;
       // }
 
-      const { StudyInstanceUID, SeriesInstanceUID, SOPInstanceUID } = instance;
+      const { StudyInstanceUID, SeriesInstanceUID } = instance;
+      const SOPInstanceUID = instance.SOPInstanceUID || instance.SopInstanceUID;
       const storedInstance = DicomMetadataStore.getInstance(
         StudyInstanceUID,
         SeriesInstanceUID,