Skip to content

Commit f5e41cc

Browse files
authored
fix(aci): Rename metric medium threshold field (#103202)
Having both medium and high thresholds on the same name was causing issues with listeners downstream. Fixes an issue where switching between threshold and percent changed would detach useMetricDetectorFormField listeners.
1 parent e492836 commit f5e41cc

File tree

1 file changed

+17
-7
lines changed
  • static/app/views/detectors/components/forms/metric

1 file changed

+17
-7
lines changed

static/app/views/detectors/components/forms/metric/metric.tsx

Lines changed: 17 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -228,24 +228,34 @@ function PriorityRow({
228228

229229
const thresholdAriaLabel = isHigh ? t('High threshold') : t('Medium threshold');
230230

231-
const directionField = (
231+
const directionField = isHigh ? (
232232
<DirectionField
233233
aria-label={t('Threshold direction')}
234234
name={METRIC_DETECTOR_FORM_FIELDS.conditionType}
235235
hideLabel
236236
inline
237237
flexibleControlStateSize
238238
choices={conditionChoices}
239-
required={isHigh}
240-
disabled={!isHigh}
241-
defaultValue={conditionType}
239+
required
242240
preserveOnUnmount
243241
/>
242+
) : (
243+
<DirectionField
244+
aria-label={t('Threshold direction')}
245+
name="conditionTypeDisplay"
246+
hideLabel
247+
inline
248+
flexibleControlStateSize
249+
choices={conditionChoices}
250+
value={conditionType}
251+
defaultValue={conditionType}
252+
disabled
253+
/>
244254
);
245255

246256
return (
247257
<PriorityRowContainer>
248-
<PriorityDot $priority={priority} />
258+
<PriorityDot priority={priority} />
249259
<PriorityLabel>
250260
{isHigh ? t('High priority') : t('Medium priority')}
251261
{isHigh && <RequiredAsterisk>*</RequiredAsterisk>}
@@ -677,11 +687,11 @@ const PriorityRowContainer = styled('div')`
677687
gap: ${space(1)};
678688
`;
679689

680-
const PriorityDot = styled('div')<{$priority: 'high' | 'medium'}>`
690+
const PriorityDot = styled('div')<{priority: 'high' | 'medium'}>`
681691
width: 8px;
682692
height: 8px;
683693
border-radius: 50%;
684-
background-color: ${p => (p.$priority === 'high' ? p.theme.red300 : p.theme.yellow400)};
694+
background-color: ${p => (p.priority === 'high' ? p.theme.red300 : p.theme.yellow400)};
685695
flex-shrink: 0;
686696
`;
687697

0 commit comments

Comments
 (0)