Skip to content

fix: remove thresholdRange label in double-range tool settings#5931

Open
GhadeerAlbattarni wants to merge 2 commits intoOHIF:masterfrom
GhadeerAlbattarni:fix/5894-threshold-range-overlap
Open

fix: remove thresholdRange label in double-range tool settings#5931
GhadeerAlbattarni wants to merge 2 commits intoOHIF:masterfrom
GhadeerAlbattarni:fix/5894-threshold-range-overlap

Conversation

@GhadeerAlbattarni
Copy link
Copy Markdown
Collaborator

@GhadeerAlbattarni GhadeerAlbattarni commented Mar 30, 2026

Context

Fixes #5894

The ThresholdRange label was overlapping with the range values in label maps tools panel.

Changes & Results

Removed the separate label (option.name) from renderDoubleRangeSetting in ToolSettings.tsx.

Before
The label "ThresholdRange" overlapped with the double-range
slider values.

After
The double-range slider renders cleanly without an overlapping label.

Screenshot 2026-03-30 at 11 18 43 AM

Testing

  1. Open a study in Segmentation mode
  2. Click Add Segmentation
  3. Click on Threshold tool
  4. Click Range
  5. verify no label is displayed and only the slider with its values are shown

Checklist

PR

  • [] My Pull Request title is descriptive, accurate and follows the
    semantic-release format and guidelines.

Code

  • [] My code has been well-documented (function documentation, inline comments,
    etc.)

Public Documentation Updates

  • [] The documentation page has been updated as necessary for any public API
    additions or removals.

Tested Environment

  • OS: macOS 10.15.4
  • Node version: v22.13.0
  • Browser: Chrome 83.0.4103.116

Greptile Summary

This PR fixes a UI overlap bug where the "ThresholdRange" label was rendering on top of the double-range slider values in the segmentation tool settings panel. The fix removes the external label wrapper (option.name rendered via renderLabelWithTooltip) from renderDoubleRangeSetting, letting RowDoubleRange render directly without an overlapping heading.

  • All three current consumers of the double-range setting type across modes/tmtv, modes/preclinical-4d, and modes/segmentation are exclusively ThresholdRange sliders — so removing the label has no unintended impact on other settings.
  • RowDoubleRange already exposes built-in label / showLabel props that could be used in the future if a label is ever needed for a double-range setting without overlap issues.
  • The second change in renderSelectSetting is a pure formatting refactor (collapsing a multi-line <div> to one line) with no functional impact.
  • The change is minimal, targeted, and consistent with the screenshot evidence provided in the PR description.

Confidence Score: 5/5

Safe to merge — a minimal, targeted fix with no functional regressions.

The change is a small one-function edit that removes a confirmed overlapping UI element. All existing usages of double-range are for ThresholdRange sliders where the label is redundant. No logic, data, or API contracts are affected.

No files require special attention.

Important Files Changed

Filename Overview
platform/ui-next/src/components/OHIFToolSettings/ToolSettings.tsx Removes the external label wrapper from renderDoubleRangeSetting so RowDoubleRange renders directly without the overlapping "ThresholdRange" label; also collapses a multi-line div in renderSelectSetting to a single line (formatting only).

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[ToolSettings renders option] --> B{option.type}
    B -->|double-range| C[renderDoubleRangeSetting]
    C --> D["RowDoubleRange (direct, no label wrapper)"]
    D --> E["Numeric.Container (doubleRange mode)"]
    E --> F["Numeric.DoubleRange (showNumberInputs)"]

    B -->|range| G[renderRangeSetting]
    G --> H["div wrapper with label + RowInputRange"]

    B -->|select| I[renderSelectSetting]
    I --> J["div wrapper with label + Select"]

    style C fill:#90ee90
    style D fill:#90ee90
Loading

Reviews (1): Last reviewed commit: "Merge remote-tracking branch 'upstream/m..." | Re-trigger Greptile

@netlify
Copy link
Copy Markdown

netlify bot commented Mar 30, 2026

Deploy Preview for ohif-dev ready!

Name Link
🔨 Latest commit d704390
🔍 Latest deploy log https://app.netlify.com/projects/ohif-dev/deploys/69ca9638ff348a0008779c96
😎 Deploy Preview https://deploy-preview-5931--ohif-dev.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug] Label 'ThresholdRange' overlaps with the range value

1 participant