diff --git a/.gitignore b/.gitignore index 4ec8efeb3..2b6dda93f 100644 --- a/.gitignore +++ b/.gitignore @@ -58,3 +58,5 @@ tests/test-results/ tests/playwright-report/ /blob-report/ /playwright/.cache/ + +**/.claude/settings.local.json diff --git a/extensions/default/src/getToolbarModule.tsx b/extensions/default/src/getToolbarModule.tsx index eb52efb8b..9704acc08 100644 --- a/extensions/default/src/getToolbarModule.tsx +++ b/extensions/default/src/getToolbarModule.tsx @@ -1,4 +1,3 @@ -import { ToolbarButton as ToolbarButtonLegacy } from '@ohif/ui'; import { ToolButton, utils } from '@ohif/ui-next'; import ToolbarLayoutSelectorWithServices from './Toolbar/ToolbarLayoutSelector'; @@ -33,28 +32,6 @@ export default function getToolbarModule({ commandsManager, servicesManager }: w name: 'ohif.toolBoxButton', defaultComponent: ToolBoxButtonWrapper, }, - // legacy will get removed in the future - // legacy will get removed in the future - // legacy will get removed in the future - // legacy will get removed in the future - // legacy will get removed in the future - // legacy will get removed in the future - { - name: 'ohif.radioGroup', - defaultComponent: ToolbarButtonLegacy, - }, - { - name: 'ohif.buttonGroup', - defaultComponent: ToolbarButtonGroupWithServicesLegacy, - }, - { - name: 'ohif.divider', - defaultComponent: ToolbarDividerLegacy, - }, - { - name: 'ohif.splitButton', - defaultComponent: ToolbarSplitButtonWithServicesLegacy, - }, // others { name: 'ohif.layoutSelector', diff --git a/platform/app/src/routes/WorkList/WorkList.tsx b/platform/app/src/routes/WorkList/WorkList.tsx index 708e0b59f..be176ee0f 100644 --- a/platform/app/src/routes/WorkList/WorkList.tsx +++ b/platform/app/src/routes/WorkList/WorkList.tsx @@ -18,8 +18,6 @@ import { StudyListTable, StudyListPagination, StudyListFilter, - useSessionStorage, - InvestigationalUseDialog, Button, ButtonEnums, } from '@ohif/ui'; @@ -32,8 +30,10 @@ import { TooltipContent, Clipboard, useModal, + useSessionStorage, Onboarding, ScrollArea, + InvestigationalUseDialog, } from '@ohif/ui-next'; import { Types } from '@ohif/ui'; @@ -60,7 +60,6 @@ function WorkList({ onRefresh, servicesManager, }: withAppTypes) { - const { hotkeyDefinitions, hotkeyDefaults } = hotkeysManager; const { show, hide } = useModal(); const { t } = useTranslation(); // ~ Modes @@ -426,7 +425,7 @@ function WorkList({ }} // to={`${mode.routeName}/dicomweb?StudyInstanceUIDs=${studyInstanceUid}`} > - {/* TODO revisit the completely rounded style of buttons used for launching a mode from the worklist later - for now use LegacyButton*/} + {/* TODO revisit the completely rounded style of buttons used for launching a mode from the worklist later */} - ))} - - ); -} - -ActionButtons.propTypes = { - actions: PropTypes.arrayOf( - PropTypes.shape({ - label: PropTypes.string.isRequired, - onClick: PropTypes.func.isRequired, - disabled: PropTypes.bool, - }) - ).isRequired, - disabled: PropTypes.bool, -}; - -export default ActionButtons; diff --git a/platform/ui/src/components/ActionButtons/index.ts b/platform/ui/src/components/ActionButtons/index.ts deleted file mode 100644 index d3cc681b9..000000000 --- a/platform/ui/src/components/ActionButtons/index.ts +++ /dev/null @@ -1,3 +0,0 @@ -import ActionButtons from './ActionButtons'; - -export default ActionButtons; diff --git a/platform/ui/src/components/AdvancedToolbox/AdvancedToolbox.tsx b/platform/ui/src/components/AdvancedToolbox/AdvancedToolbox.tsx deleted file mode 100644 index aed13ed12..000000000 --- a/platform/ui/src/components/AdvancedToolbox/AdvancedToolbox.tsx +++ /dev/null @@ -1,72 +0,0 @@ -import React, { useState, useEffect } from 'react'; -import classnames from 'classnames'; -import { PanelSection, Tooltip } from '../../components'; -import ToolSettings from './ToolSettings'; -import { Icons } from '@ohif/ui-next'; - -/** - * Use Toolbox component instead of this although it doesn't have "Advanced" in its name - * it is better to use it instead of this one - */ -const AdvancedToolbox = ({ title, items }) => { - const [activeItemName, setActiveItemName] = useState(null); - - useEffect(() => { - // see if any of the items are active from the outside - const activeItem = items?.find(item => item.active); - setActiveItemName(activeItem ? activeItem.name : null); - }, [items]); - - const activeItemOptions = items?.find(item => item.name === activeItemName)?.options; - - return ( - -
-
- {items?.map(item => { - return ( - {item.name}} - key={item.name} - > -
{ - if (item.disabled) { - return; - } - setActiveItemName(item.name); - item.onClick(item.name); - }} - > -
- -
-
- - ); - })} -
-
- -
-
- - ); -}; - -AdvancedToolbox.propTypes = {}; - -export default AdvancedToolbox; diff --git a/platform/ui/src/components/AdvancedToolbox/ToolSettings.tsx b/platform/ui/src/components/AdvancedToolbox/ToolSettings.tsx deleted file mode 100644 index 0d5d339b5..000000000 --- a/platform/ui/src/components/AdvancedToolbox/ToolSettings.tsx +++ /dev/null @@ -1,128 +0,0 @@ -import React from 'react'; -import { ButtonGroup, InputDoubleRange, InputRange } from '../../components'; - -const SETTING_TYPES = { - RANGE: 'range', - RADIO: 'radio', - CUSTOM: 'custom', - DOUBLE_RANGE: 'double-range', -}; - -function ToolSettings({ options }) { - if (!options) { - return null; - } - - if (typeof options === 'function') { - return options(); - } - - return ( -
- {options?.map(option => { - if (option.condition && option.condition?.({ options }) === false) { - return null; - } - - switch (option.type) { - case SETTING_TYPES.RANGE: - return renderRangeSetting(option); - case SETTING_TYPES.RADIO: - return renderRadioSetting(option); - case SETTING_TYPES.DOUBLE_RANGE: - return renderDoubleRangeSetting(option); - case SETTING_TYPES.CUSTOM: - return renderCustomSetting(option); - default: - return null; - } - })} -
- ); -} - -const renderRangeSetting = option => { - return ( -
-
{option.name}
-
- option.commands?.(value)} - allowNumberEdit={true} - showAdjustmentArrows={false} - inputClassName="ml-1 w-4/5 cursor-pointer" - /> -
-
- ); -}; - -const renderRadioSetting = option => { - const renderButtons = option => { - return option.values?.map(({ label, value: optionValue }, index) => ( - - )); - }; - - return ( -
- {option.name} -
- value === option.value) || 0} - > - {renderButtons(option)} - -
-
- ); -}; - -const renderDoubleRangeSetting = option => { - return ( -
- -
- ); -}; - -const renderCustomSetting = option => { - return ( -
- {typeof option.children === 'function' ? option.children() : option.children} -
- ); -}; - -export default ToolSettings; diff --git a/platform/ui/src/components/AdvancedToolbox/__stories__/advancedToolbox.stories.mdx b/platform/ui/src/components/AdvancedToolbox/__stories__/advancedToolbox.stories.mdx deleted file mode 100644 index 551791377..000000000 --- a/platform/ui/src/components/AdvancedToolbox/__stories__/advancedToolbox.stories.mdx +++ /dev/null @@ -1,144 +0,0 @@ -import AdvancedToolbox from '../../AdvancedToolbox'; -import { ArgsTable, Story, Canvas, Meta } from '@storybook/addon-docs'; -import { - createComponentTemplate, - createStoryMetaSettings, -} from '../../../storybook/functions/create-component-story'; - -export const argTypes = { - component: AdvancedToolbox, - title: 'Components/AdvancedToolbox', -}; - - - -export const advancedToolboxTemplate = args => ( -
- -
-); - - - -- [Overview](#overview) -- [Props](#props) -- [Usage](#usage) -- [Contribute](#contribute) - -## Overview - -OHIF advanced toolbox which can host set of tools that require more space for customization. - - - console.log('Brush clicked'), - options: [ - { - name: 'Radius (mm)', - type: 'range', - min: 1, - max: 10, - value: 5, - step: 1, - onChange: value => console.log('Brush size changed', value), - }, - { - name: 'Mode', - type: 'radio', - value: 'Circle', - values: [ - { value: 'Circle', label: 'Circle' }, - { value: 'Sphere', label: 'Sphere' }, - { value: 'Rectangle', label: 'Rectangle' }, - ], - onChange: value => console.log('Brush mode changed', value), - }, - ], - }, - { - name: 'Eraser', - icon: 'icon-tool-eraser', - onClick: () => console.log('eraser clicked'), - options: [ - { - name: 'Mode', - type: 'radio', - value: 'EraserSphere', - values: [ - { value: 'EraserCircle', label: 'Circle' }, - { value: 'EraserSphere', label: 'Sphere' }, - ], - onChange: value => console.log('Brush mode changed', value), - }, - ], - }, - { - name: 'Threshold', - icon: 'icon-tool-threshold', - active: true, - onClick: () => console.log('eraser clicked'), - options: [ - { - name: 'Radius (mm)', - type: 'range', - min: 1, - max: 10, - value: 5, - step: 1, - onChange: value => console.log('Brush size changed', value), - }, - { - name: 'Mode', - type: 'radio', - value: 'Circle', - values: [ - { value: 'Circle', label: 'Circle' }, - { value: 'Sphere', label: 'Sphere' }, - { value: 'Rectangle', label: 'Rectangle' }, - ], - onChange: value => console.log('Brush mode changed', value), - }, - { - name: 'custom', - type: 'custom', - children: () => { - return ( -
-
Custom
- -
- ); - }, - }, - ], - }, - ], - }} - > - {advancedToolboxTemplate.bind({})} - - - -## Props - - - -## Usage - -## Contribute - -