fix(segmentation): Add segment jump for new segments and make panels scrollable (#4928)

This commit is contained in:
Alireza authored and GitHub committed 2025-04-07 16:45:29 -04:00
1 parent a8ac297e16
commit 3653de7487
23 files changed
+491 -368

No files matched your search

@@ -46,8 +46,8 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.8.5",
"@cornerstonejs/core": "^3.8.5",
"@cornerstonejs/adapters": "^3.9.1",
"@cornerstonejs/core": "^3.9.1",
"@kitware/vtk.js": "32.12.0",
"react-color": "^2.19.3"
}
@@ -46,8 +46,8 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.8.5",
"@cornerstonejs/core": "^3.8.5",
"@cornerstonejs/adapters": "^3.9.1",
"@cornerstonejs/core": "^3.9.1",
"@kitware/vtk.js": "32.12.0",
"react-color": "^2.19.3"
}
+3 -3
View File
@@ -46,9 +46,9 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.8.5",
"@cornerstonejs/core": "^3.8.5",
"@cornerstonejs/tools": "^3.8.5",
"@cornerstonejs/adapters": "^3.9.1",
"@cornerstonejs/core": "^3.9.1",
"@cornerstonejs/tools": "^3.9.1",
"classnames": "^2.3.2"
}
}
@@ -42,8 +42,8 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/core": "^3.8.5",
"@cornerstonejs/tools": "^3.8.5",
"@cornerstonejs/core": "^3.9.1",
"@cornerstonejs/tools": "^3.9.1",
"classnames": "^2.3.2"
}
}
+7 -7
View File
@@ -38,7 +38,7 @@
"@cornerstonejs/codec-libjpeg-turbo-8bit": "^1.2.2",
"@cornerstonejs/codec-openjpeg": "^1.2.4",
"@cornerstonejs/codec-openjph": "^2.4.5",
"@cornerstonejs/dicom-image-loader": "^3.8.5",
"@cornerstonejs/dicom-image-loader": "^3.9.1",
"@ohif/core": "3.10.0-beta.151",
"@ohif/ui": "3.10.0-beta.151",
"dcmjs": "*",
@@ -51,12 +51,12 @@
},
"dependencies": {
"@babel/runtime": "^7.20.13",
"@cornerstonejs/adapters": "^3.8.5",
"@cornerstonejs/ai": "^3.8.5",
"@cornerstonejs/core": "^3.8.5",
"@cornerstonejs/labelmap-interpolation": "^3.8.5",
"@cornerstonejs/polymorphic-segmentation": "^3.8.5",
"@cornerstonejs/tools": "^3.8.5",
"@cornerstonejs/adapters": "^3.9.1",
"@cornerstonejs/ai": "^3.9.1",
"@cornerstonejs/core": "^3.9.1",
"@cornerstonejs/labelmap-interpolation": "^3.9.1",
"@cornerstonejs/polymorphic-segmentation": "^3.9.1",
"@cornerstonejs/tools": "^3.9.1",
"@itk-wasm/morphological-contour-interpolation": "1.1.0",
"@kitware/vtk.js": "32.12.0",
"html2canvas": "^1.4.1",
@@ -31,6 +31,7 @@ export default function getSegmentationPanelCustomization({ commandsManager, ser
peakLPS: 'Peak Coord',
volume: 'Volume',
lesionGlycolysis: 'Lesion Glycolysis',
center: 'Center',
},
'segmentationToolbox.config': () => {
// Get initial states based on current configuration
@@ -277,6 +277,11 @@ class SegmentationService extends PubSubService {
): Promise<void> {
const segmentation = this.getSegmentation(segmentationId);
const csViewport = this.getAndValidateViewport(viewportId);
if (!csViewport) {
return;
}
const colorLUTIndex = this._segmentationIdToColorLUTIndexMap.get(segmentationId);
const defaultRepresentationType = csToolsEnums.SegmentationRepresentations.Labelmap;
@@ -1251,7 +1256,8 @@ class SegmentationService extends PubSubService {
const csViewport =
this.servicesManager.services.cornerstoneViewportService.getCornerstoneViewport(viewportId);
if (!csViewport) {
throw new Error(`Viewport with id ${viewportId} not found.`);
console.warn(`Viewport with id ${viewportId} not found.`);
return null;
}
return csViewport;
}
@@ -1766,6 +1772,12 @@ class SegmentationService extends PubSubService {
const { center } = cachedStats;
if (!center) {
return {
world: cachedStats.namedStats.center.value,
};
}
return center;
}
@@ -1,10 +1,8 @@
import React, { useState, useEffect, useCallback } from 'react';
import { useImageViewer } from '@ohif/ui';
import { useViewportGrid } from '@ohif/ui-next';
import { StudyBrowser } from '@ohif/ui-next';
import { useSystem, utils } from '@ohif/core';
import { useNavigate } from 'react-router-dom';
import { Separator } from '@ohif/ui-next';
import { useViewportGrid, StudyBrowser, Separator } from '@ohif/ui-next';
import { PanelStudyBrowserHeader } from './PanelStudyBrowserHeader';
import { defaultActionIcons } from './constants';
import MoreDropdownMenu from '../../Components/MoreDropdownMenu';
@@ -4,7 +4,7 @@ const collapsedOutsideBorderSize = 4;
const collapsedWidth = 25;
const rightPanelInitialExpandedWidth = 280;
const leftPanelInitialExpandedWidth = 282;
const leftPanelInitialExpandedWidth = 292;
const panelGroupDefinition = {
groupId: 'viewerLayoutResizablePanelGroup',
+2 -2
View File
@@ -32,8 +32,8 @@
"start": "yarn run dev"
},
"peerDependencies": {
"@cornerstonejs/core": "^3.8.5",
"@cornerstonejs/tools": "^3.8.5",
"@cornerstonejs/core": "^3.9.1",
"@cornerstonejs/tools": "^3.9.1",
"@ohif/core": "3.10.0-beta.151",
"@ohif/extension-cornerstone-dicom-sr": "3.10.0-beta.151",
"@ohif/extension-default": "3.10.0-beta.151",
@@ -3,6 +3,7 @@ import { useActiveViewportSegmentationRepresentations } from '@ohif/extension-co
import { handleROIThresholding } from '../../utils/handleROIThresholding';
import { debounce } from '@ohif/core/src/utils';
import { useSystem } from '@ohif/core/src';
import { Button } from '@ohif/ui-next';
export default function PanelRoiThresholdSegmentation() {
const { commandsManager, servicesManager } = useSystem();
@@ -11,6 +12,7 @@ export default function PanelRoiThresholdSegmentation() {
useActiveViewportSegmentationRepresentations({ servicesManager });
const segmentationIds = segmentationsInfo?.map(info => info.segmentation.segmentationId) || [];
const segmentations = segmentationsInfo?.map(info => info.segmentation) || [];
useEffect(() => {
const initialRun = async () => {
@@ -54,17 +56,37 @@ export default function PanelRoiThresholdSegmentation() {
const stats = segmentationService.getSegmentationGroupStats(segmentationIds);
const tmtvValue = stats?.tmtv;
const handleExportCSV = () => {
if (!segmentations.length) {
return;
}
commandsManager.runCommand('exportTMTVReportCSV', {
segmentations,
tmtv: tmtvValue,
config: {},
});
};
return (
<div className="mt-2 mb-10 flex flex-col">
<div className="mb-1 flex flex-col">
<div className="invisible-scrollbar overflow-y-auto overflow-x-hidden">
{tmtvValue !== null && tmtvValue !== undefined ? (
<div className="bg-secondary-dark flex items-baseline justify-between px-2 py-1">
<span className="text-base font-bold uppercase tracking-widest text-white">
{'TMTV:'}
</span>
<div className="text-white">{`${tmtvValue?.toFixed(3)} mL`}</div>
<div className="bg-secondary-dark flex items-baseline justify-between px-2 py-1">
<div className="py-1">
<span className="text-muted-foreground text-base font-bold uppercase">{'TMTV: '}</span>
<span className="text-foreground">{tmtvValue ? `${tmtvValue.toFixed(3)} mL` : ''}</span>
</div>
) : null}
<div className="flex items-center">
<Button
size="sm"
variant="ghost"
className="text-blue-500"
onClick={handleExportCSV}
>
<span className="pl-1">CSV</span>
</Button>
</div>
</div>
</div>
</div>
);