From 3754c224b4dab28182adb0a41e37d890942144d8 Mon Sep 17 00:00:00 2001 From: Ibrahim <93064150+IbrahimCSAE@users.noreply.github.com> Date: Wed, 17 Apr 2024 16:12:40 -0230 Subject: [PATCH] fix(bugs): enhancements and bug fixes - more (#4043) --- .../src/panels/DynamicVolumeControls.tsx | 27 ++++++++-- extensions/cornerstone/src/commandsModule.ts | 1 + .../WindowLevelActionMenu/Colorbar.tsx | 1 + .../VolumeRenderingOptions.tsx | 2 +- .../WindowLevelActionMenu.tsx | 9 +--- .../ColorbarService/ColorbarService.ts | 11 ++-- .../ToolbarButtonGroupWithServices.tsx | 1 + .../default/src/ViewerLayout/ViewerHeader.tsx | 1 + extensions/default/src/commandsModule.ts | 2 +- .../PanelROIThresholdExport.tsx | 2 +- .../src/assets/icons/tool-layout-default.svg | 19 +++---- platform/ui/src/assets/icons/tool-layout.svg | 22 -------- .../AdvancedToolbox/AdvancedToolbox.tsx | 5 +- .../components/ButtonGroup/ButtonGroup.tsx | 6 +-- .../HeaderPatientInfo/HeaderPatientInfo.tsx | 2 +- .../ui/src/components/ListMenu/ListMenu.tsx | 2 +- .../SegmentationConfig.tsx | 17 +++--- .../SegmentationGroupSegment.tsx | 4 +- .../SegmentationGroupTable.tsx | 2 +- .../SegmentationGroupTableExpanded.tsx | 2 +- .../components/SplitButton/SplitButton.tsx | 2 +- .../ui/src/components/StudyItem/StudyItem.tsx | 6 +-- .../ToolbarButton/ToolbarButton.tsx | 4 +- .../ui/src/components/Toolbox/Toolbox.tsx | 6 +++ .../ui/src/components/Toolbox/ToolboxUI.tsx | 53 ++++++++----------- .../components/WindowLevel/WindowLevel.tsx | 2 +- 26 files changed, 105 insertions(+), 106 deletions(-) delete mode 100644 platform/ui/src/assets/icons/tool-layout.svg diff --git a/extensions/cornerstone-dynamic-volume/src/panels/DynamicVolumeControls.tsx b/extensions/cornerstone-dynamic-volume/src/panels/DynamicVolumeControls.tsx index 143b55620..8a72dd593 100644 --- a/extensions/cornerstone-dynamic-volume/src/panels/DynamicVolumeControls.tsx +++ b/extensions/cornerstone-dynamic-volume/src/panels/DynamicVolumeControls.tsx @@ -24,7 +24,7 @@ const Header = ({ title, tooltip }) => ( content={
{tooltip}
} position="bottom-left" tight={true} - tooltipBoxClassName="max-w-xs" + tooltipBoxClassName="max-w-xs p-2" >
-
+
+ Operation Buttons (SUM, AVERAGE, SUBTRACT): Select the mathematical operation to be + applied to the data set. +

Range Slider: Choose the numeric range within which the operation will be + performed. +

Generate Button: Execute the chosen operation on the specified range of + data.{' '} +
+ } + /> -
+
+ Play/Pause Button: Begin or pause the animation of the 4D visualization.

Frame + Selector: Navigate through individual frames of the 4D data.

FPS (Frames Per + Second) Selector: Adjust the playback speed of the animation. + + } + />
+
-
+
LIGHTING
diff --git a/extensions/cornerstone/src/components/WindowLevelActionMenu/WindowLevelActionMenu.tsx b/extensions/cornerstone/src/components/WindowLevelActionMenu/WindowLevelActionMenu.tsx index 6905c9988..c6f20158f 100644 --- a/extensions/cornerstone/src/components/WindowLevelActionMenu/WindowLevelActionMenu.tsx +++ b/extensions/cornerstone/src/components/WindowLevelActionMenu/WindowLevelActionMenu.tsx @@ -52,6 +52,7 @@ export function WindowLevelActionMenu({ } = colorbarProperties; const { colorbarService, cornerstoneViewportService } = serviceManager.services; const viewportInfo = cornerstoneViewportService.getViewportInfo(viewportId); + const viewport = cornerstoneViewportService.getCornerstoneViewport(viewportId); const backgroundColor = viewportInfo.getViewportOptions().background; const isLight = backgroundColor ? utilities.isEqual(backgroundColor, [1, 1, 1]) : false; @@ -93,13 +94,7 @@ export function WindowLevelActionMenu({ colorbarService.removeColorbar(viewportId); onSetColorbar(); }, 0); - }, [viewportId]); - - useEffect(() => { - if (colorbarService.hasColorbar(viewportId)) { - colorbarService.removeColorbar(viewportId); - } - }, [displaySets]); + }, [viewportId, displaySets, viewport]); useEffect(() => { setMenuKey(menuKey + 1); diff --git a/extensions/cornerstone/src/services/ColorbarService/ColorbarService.ts b/extensions/cornerstone/src/services/ColorbarService/ColorbarService.ts index 688abce65..a8a4620ac 100644 --- a/extensions/cornerstone/src/services/ColorbarService/ColorbarService.ts +++ b/extensions/cornerstone/src/services/ColorbarService/ColorbarService.ts @@ -75,10 +75,7 @@ export default class ColorbarService extends PubSubService { displaySetInstanceUIDs.forEach((displaySetInstanceUID, index) => { const actorEntry = actorEntries.find(entry => entry.uid.includes(displaySetInstanceUID)); - if (!actorEntry) { - return; - } - const { uid: volumeId } = actorEntry; + const volumeId = actorEntry?.uid; const properties = viewport?.getProperties(volumeId); const colormap = properties?.colormap; // if there's an initial colormap set, and no colormap on the viewport, set it @@ -194,8 +191,10 @@ export default class ColorbarService extends PubSubService { private setViewportColormap(viewportId, displaySetInstanceUID, colormap, immediate = false) { const renderingEngine = getRenderingEngine(RENDERING_ENGINE_ID); const viewport = renderingEngine.getViewport(viewportId); - const actorEntries = viewport.getActors(); - + const actorEntries = viewport?.getActors(); + if (!viewport || !actorEntries || actorEntries.length === 0) { + return; + } const setViewportProperties = (viewport, uid) => { const actorEntry = actorEntries.find(entry => entry.uid.includes(uid)); const { actor: volumeActor, uid: volumeId } = actorEntry; diff --git a/extensions/default/src/Toolbar/ToolbarButtonGroupWithServices.tsx b/extensions/default/src/Toolbar/ToolbarButtonGroupWithServices.tsx index 42180eaec..0e6ad1cdd 100644 --- a/extensions/default/src/Toolbar/ToolbarButtonGroupWithServices.tsx +++ b/extensions/default/src/Toolbar/ToolbarButtonGroupWithServices.tsx @@ -11,6 +11,7 @@ function ToolbarButtonGroupWithServices({ groupId, items, onInteraction, size }) label={item.label} disabled={item.disabled} className={item.className} + disabledText={item.disabledText} id={item.id} size={size} onClick={() => { diff --git a/extensions/default/src/ViewerLayout/ViewerHeader.tsx b/extensions/default/src/ViewerLayout/ViewerHeader.tsx index 6d5ab60f7..6dd130dd9 100644 --- a/extensions/default/src/ViewerLayout/ViewerHeader.tsx +++ b/extensions/default/src/ViewerLayout/ViewerHeader.tsx @@ -63,6 +63,7 @@ function ViewerHeader({ hotkeysManager, extensionManager, servicesManager, appCo show({ title: t('UserPreferencesModal:User preferences'), content: UserPreferences, + containerDimensions: 'w-[70%] max-w-[900px]', contentProps: { hotkeyDefaults: hotkeysManager.getValidHotkeyDefinitions(hotkeyDefaults), hotkeyDefinitions, diff --git a/extensions/default/src/commandsModule.ts b/extensions/default/src/commandsModule.ts index 7e498726e..e302e860b 100644 --- a/extensions/default/src/commandsModule.ts +++ b/extensions/default/src/commandsModule.ts @@ -448,7 +448,7 @@ const commandsModule = ({ displaySetInstanceUID, onClose: UIModalService.hide, }, - containerDimensions: 'max-w-4xl max-h-4xl', + containerDimensions: 'w-[70%] max-w-[900px]', title: 'DICOM Tag Browser', }); }, diff --git a/extensions/tmtv/src/Panels/PanelROIThresholdSegmentation/PanelROIThresholdExport.tsx b/extensions/tmtv/src/Panels/PanelROIThresholdSegmentation/PanelROIThresholdExport.tsx index 05fa48cb1..44582ed96 100644 --- a/extensions/tmtv/src/Panels/PanelROIThresholdSegmentation/PanelROIThresholdExport.tsx +++ b/extensions/tmtv/src/Panels/PanelROIThresholdSegmentation/PanelROIThresholdExport.tsx @@ -96,7 +96,7 @@ export default function PanelRoiThresholdSegmentation({ servicesManager, command
{ // navigate to a url in a new tab window.open('https://github.com/OHIF/Viewers/blob/master/modes/tmtv/README.md', '_blank'); diff --git a/platform/ui/src/assets/icons/tool-layout-default.svg b/platform/ui/src/assets/icons/tool-layout-default.svg index b8721853d..2ebbcabc6 100644 --- a/platform/ui/src/assets/icons/tool-layout-default.svg +++ b/platform/ui/src/assets/icons/tool-layout-default.svg @@ -1,21 +1,22 @@ - tool-layout-default - + tool-layout + - - - - - + + + + + + + - + - \ No newline at end of file diff --git a/platform/ui/src/assets/icons/tool-layout.svg b/platform/ui/src/assets/icons/tool-layout.svg deleted file mode 100644 index 2ebbcabc6..000000000 --- a/platform/ui/src/assets/icons/tool-layout.svg +++ /dev/null @@ -1,22 +0,0 @@ - - - tool-layout - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/platform/ui/src/components/AdvancedToolbox/AdvancedToolbox.tsx b/platform/ui/src/components/AdvancedToolbox/AdvancedToolbox.tsx index 2748e522b..506a114a7 100644 --- a/platform/ui/src/components/AdvancedToolbox/AdvancedToolbox.tsx +++ b/platform/ui/src/components/AdvancedToolbox/AdvancedToolbox.tsx @@ -19,7 +19,10 @@ const AdvancedToolbox = ({ title, items }) => { const activeItemOptions = items?.find(item => item.name === activeItemName)?.options; return ( - +
{items?.map(item => { diff --git a/platform/ui/src/components/ButtonGroup/ButtonGroup.tsx b/platform/ui/src/components/ButtonGroup/ButtonGroup.tsx index 32b294082..f7cc41e66 100644 --- a/platform/ui/src/components/ButtonGroup/ButtonGroup.tsx +++ b/platform/ui/src/components/ButtonGroup/ButtonGroup.tsx @@ -37,7 +37,7 @@ const ButtonGroup = ({ return (
{!separated && ( @@ -52,7 +52,7 @@ const ButtonGroup = ({ ? 'bg-customblue-40 text-white' : 'text-primary-active bg-black', child.props.className, - disabled ? 'ohif-disabled' : '' + child.props.disabled ? 'ohif-disabled' : '' ), onClick: e => { child.props.onClick && child.props.onClick(e); @@ -76,7 +76,7 @@ const ButtonGroup = ({ ? 'bg-customblue-40 text-white' : 'text-primary-active bg-black border-secondary-light rounded-[5px] border', child.props.className, - disabled ? 'ohif-disabled' : '' + child.props.disabled ? 'ohif-disabled' : '' ), onClick: e => { child.props.onClick && child.props.onClick(e); diff --git a/platform/ui/src/components/HeaderPatientInfo/HeaderPatientInfo.tsx b/platform/ui/src/components/HeaderPatientInfo/HeaderPatientInfo.tsx index e389c97b9..8c545d898 100644 --- a/platform/ui/src/components/HeaderPatientInfo/HeaderPatientInfo.tsx +++ b/platform/ui/src/components/HeaderPatientInfo/HeaderPatientInfo.tsx @@ -94,7 +94,7 @@ function HeaderPatientInfo({ servicesManager, appConfig }) { return (
{ }; return ( -
+
{items.map((item, index) => { return ( { const { t } = useTranslation('SegmentationTable'); return ( -
-
+
+
{t('Active')}
+
@@ -47,9 +48,9 @@ const ActiveSegmentationConfig = ({ value={getRoundedValue(config.outlineOpacity * 100)} onChange={setOutlineOpacityActive} step={1} - containerClassName="mt-[4px] mb-[9px]" + containerClassName="mt-[4px] mb-[9px] w-[100px]" inputClassName="w-[64px]" - labelClassName="text-white text-[12px]" + labelClassName="text-white text-[12px] whitespace-nowrap" unit="%" />
diff --git a/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupSegment.tsx b/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupSegment.tsx index 2e477f1d2..11773a8b7 100644 --- a/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupSegment.tsx +++ b/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupSegment.tsx @@ -70,7 +70,7 @@ const SegmentItem = ({ 'border border-l-0 border-transparent': !isActive, })} style={{ - width: 'calc(100% - 40px)', + width: 'calc(100% - 28px)', }} >
@@ -93,7 +93,7 @@ const SegmentItem = ({
diff --git a/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupTable.tsx b/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupTable.tsx index 58b6d763e..73262d69f 100644 --- a/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupTable.tsx +++ b/platform/ui/src/components/SegmentationGroupTable/SegmentationGroupTable.tsx @@ -75,7 +75,7 @@ const SegmentationGroupTable = ({ const { t } = useTranslation('SegmentationTable'); return ( -
+
+
diff --git a/platform/ui/src/components/StudyItem/StudyItem.tsx b/platform/ui/src/components/StudyItem/StudyItem.tsx index f504d18fb..6e99c48d1 100644 --- a/platform/ui/src/components/StudyItem/StudyItem.tsx +++ b/platform/ui/src/components/StudyItem/StudyItem.tsx @@ -40,9 +40,9 @@ const StudyItem = ({ {numInstances}
-
-
{modalities}
-
{description}
+
+
{modalities}
+
{description}
{!!trackedSeries && ( diff --git a/platform/ui/src/components/ToolbarButton/ToolbarButton.tsx b/platform/ui/src/components/ToolbarButton/ToolbarButton.tsx index 226b1aeae..e68f01cf3 100644 --- a/platform/ui/src/components/ToolbarButton/ToolbarButton.tsx +++ b/platform/ui/src/components/ToolbarButton/ToolbarButton.tsx @@ -39,14 +39,14 @@ const ToolbarButton = ({ { onInteraction({ itemId: id, diff --git a/platform/ui/src/components/Toolbox/Toolbox.tsx b/platform/ui/src/components/Toolbox/Toolbox.tsx index 84e388281..79e0899b8 100644 --- a/platform/ui/src/components/Toolbox/Toolbox.tsx +++ b/platform/ui/src/components/Toolbox/Toolbox.tsx @@ -107,6 +107,12 @@ function Toolbox({ servicesManager, buttonSectionId, commandsManager, title, ... api.handleToolOptionChange(toolName, optionName, newValue); }; + useEffect(() => { + return () => { + api.handleToolSelect(null); + }; + }, []); + return ( - {componentProps.disabled ? ( - -
- -
- - ) : ( -
- -
- )} +
+ +
); })} @@ -90,7 +72,16 @@ function ToolboxUI(props) { ); }; - return useCollapsedPanel ? {render()} : render(); + return useCollapsedPanel ? ( + + {render()} + + ) : ( + render() + ); } export { ToolboxUI }; diff --git a/platform/ui/src/components/WindowLevel/WindowLevel.tsx b/platform/ui/src/components/WindowLevel/WindowLevel.tsx index 3f3ca14db..7fd1c390f 100644 --- a/platform/ui/src/components/WindowLevel/WindowLevel.tsx +++ b/platform/ui/src/components/WindowLevel/WindowLevel.tsx @@ -141,7 +141,7 @@ const WindowLevel = ({
{showOpacitySlider && ( -
+
Opacity