fix(bugs): enhancements and bug fixes - more (#4043)

extensions/cornerstone-dynamic-volume/src/panels/DynamicVolumeControls.tsx

@@ -24,7 +24,7 @@ const Header = ({ title, tooltip }) => (
       content={<div className="text-white">{tooltip}</div>}
       position="bottom-left"
       tight={true}
-      tooltipBoxClassName="max-w-xs"
+      tooltipBoxClassName="max-w-xs p-2"
     >
       <Icon
         name="info-link"
@@ -120,7 +120,19 @@ const DynamicVolumeControls = ({
           />
         </div>
         <div className={`mt-6 flex flex-col ${computedView ? '' : 'ohif-disabled'}`}>
-          <Header title="Computed Operation" />
+          <Header
+            title="Computed Operation"
+            tooltip={
+              <div>
+                Operation Buttons (SUM, AVERAGE, SUBTRACT): Select the mathematical operation to be
+                applied to the data set.
+                <br></br> Range Slider: Choose the numeric range within which the operation will be
+                performed.
+                <br></br>Generate Button: Execute the chosen operation on the specified range of
+                data.{' '}
+              </div>
+            }
+          />
           <ButtonGroup
             className={`mt-2 w-full `}
             separated={true}
@@ -187,7 +199,16 @@ function FrameControls({
 
   return (
     <div className={computedView && 'ohif-disabled'}>
-      <Header title="4D Controls" />
+      <Header
+        title="4D Controls"
+        tooltip={
+          <div>
+            Play/Pause Button: Begin or pause the animation of the 4D visualization. <br></br> Frame
+            Selector: Navigate through individual frames of the 4D data. <br></br> FPS (Frames Per
+            Second) Selector: Adjust the playback speed of the animation.
+          </div>
+        }
+      />
       <div className="mt-3 flex justify-between">
         <IconButton
           className="bg-customblue-30 h-[26px] w-[58px] rounded-[4px]"

extensions/cornerstone/src/commandsModule.ts

@@ -415,6 +415,7 @@ function commandsModule({
             onClose: uiModalService.hide,
             cornerstoneViewportService,
           },
+          containerDimensions: 'w-[70%] max-w-[900px]',
         });
       }
     },

extensions/cornerstone/src/components/WindowLevelActionMenu/Colorbar.tsx

@@ -102,6 +102,7 @@ export function Colorbar({
 
   return (
     <div className="all-in-one-menu-item flex w-full justify-center">
+      <div className="mr-2 w-[28px]"></div>
       <SwitchButton
         label="Display Color bar"
         checked={showColorbar}

extensions/cornerstone/src/components/WindowLevelActionMenu/VolumeRenderingOptions.tsx

@@ -25,7 +25,7 @@ export function VolumeRenderingOptions({
         commandsManager={commandsManager}
         serviceManager={serviceManager}
       />
-      <div className="all-in-one-menu-item flex !h-[20px] w-full justify-start">
+      <div className="all-in-one-menu-item mt-2 flex !h-[20px] w-full justify-start">
         <div className="text-aqua-pale text-[13px]">LIGHTING</div>
       </div>
       <div className="bg-primary-dark mt-1 mb-1 h-[2px] w-full"></div>

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);

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;

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={() => {

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,

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',
       });
     },

extensions/tmtv/src/Panels/PanelROIThresholdSegmentation/PanelROIThresholdExport.tsx

@@ -96,7 +96,7 @@ export default function PanelRoiThresholdSegmentation({ servicesManager, command
         </div>
       </div>
       <div
-        className="absolute bottom-1 flex cursor-pointer items-center justify-center text-blue-400 opacity-50 hover:opacity-80"
+        className="absolute bottom-1 left-[50px] flex cursor-pointer items-center justify-center text-blue-400 opacity-50 hover:opacity-80"
         onClick={() => {
           // navigate to a url in a new tab
           window.open('https://github.com/OHIF/Viewers/blob/master/modes/tmtv/README.md', '_blank');