diff --git a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddSingleValueWidget.tsx b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddSingleValueWidget.tsx index 91ff7b408c..200132fa78 100644 --- a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddSingleValueWidget.tsx +++ b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddSingleValueWidget.tsx @@ -5,6 +5,13 @@ import { ValueChip } from './ValueList.tsx'; import { AddValuesPopover, type OnAddActions } from './AddValuesPopover.tsx'; import type { ConstraintValidatorOutput } from './ConstraintValidatorOutput.ts'; +// No, escape handling doesn't work correctly with chips and popovers in MUI v5. +// This is an intentional trade-off for now because the chip makes it easy to +// use delete/backspace to clear the value and otherwise works pretty well (cf +// https://github.com/Unleash/unleash/pull/9859). +// +// In MUI v6 and onwards this will "just work" +// (https://mui.com/material-ui/migration/upgrade-to-v6/#chip) const StyledChip = styled(ValueChip, { shouldForwardProp: (prop) => prop !== 'hasValue', })<{ hasValue: boolean }>(({ theme, hasValue }) => ({ diff --git a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddValuesPopover.tsx b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddValuesPopover.tsx index 6da67aa321..398470b404 100644 --- a/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddValuesPopover.tsx +++ b/frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint/AddValuesPopover.tsx @@ -80,14 +80,7 @@ export const AddValuesPopover: FC = ({ { - if (inputValue && !initialValue?.trim()) { - // if the input value is not empty and the current value is - // empty or whitespace - setInputValue(''); - } else if (inputValue) { - // select the text in the input field - inputRef?.current?.select(); - } + inputRef?.current?.select(); }} disableScrollLock anchorEl={anchorEl}