* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA. | ||||
*/ | */ | ||||
import styled from '@emotion/styled'; | import styled from '@emotion/styled'; | ||||
import { debounce } from 'lodash'; | |||||
import React from 'react'; | import React from 'react'; | ||||
import { | import { | ||||
ActionMeta, | ActionMeta, | ||||
import { AsyncProps } from 'react-select/async'; | import { AsyncProps } from 'react-select/async'; | ||||
import Select from 'react-select/dist/declarations/src/Select'; | import Select from 'react-select/dist/declarations/src/Select'; | ||||
import tw from 'twin.macro'; | import tw from 'twin.macro'; | ||||
import { DEBOUNCE_DELAY, PopupPlacement, PopupZLevel, themeBorder } from '../../helpers'; | |||||
import { PopupPlacement, PopupZLevel, themeBorder } from '../../helpers'; | |||||
import { InputSizeKeys } from '../../types/theme'; | import { InputSizeKeys } from '../../types/theme'; | ||||
import { DropdownToggler } from '../DropdownToggler'; | import { DropdownToggler } from '../DropdownToggler'; | ||||
import { SearchHighlighterContext } from '../SearchHighlighter'; | import { SearchHighlighterContext } from '../SearchHighlighter'; | ||||
}, | }, | ||||
[minLength, loadOptions], | [minLength, loadOptions], | ||||
); | ); | ||||
const debouncedLoadOptions = React.useRef(debounce(handleLoadOptions, DEBOUNCE_DELAY)); | |||||
const handleInputChange = React.useCallback( | const handleInputChange = React.useCallback( | ||||
(newValue: string, actionMeta: InputActionMeta) => { | (newValue: string, actionMeta: InputActionMeta) => { | ||||
Option: IconOption, | Option: IconOption, | ||||
...rest.components, | ...rest.components, | ||||
}} | }} | ||||
loadOptions={debouncedLoadOptions.current} | |||||
loadOptions={handleLoadOptions} | |||||
menuIsOpen | menuIsOpen | ||||
minLength={minLength} | minLength={minLength} | ||||
onChange={handleChange} | onChange={handleChange} |
import { RadioButtonGroup } from '@sonarsource/echoes-react'; | import { RadioButtonGroup } from '@sonarsource/echoes-react'; | ||||
import { ButtonPrimary, FormField, Modal } from 'design-system'; | import { ButtonPrimary, FormField, Modal } from 'design-system'; | ||||
import * as React from 'react'; | import * as React from 'react'; | ||||
import { getLocalizedMetricName, translate } from '../../../helpers/l10n'; | |||||
import { translate } from '../../../helpers/l10n'; | |||||
import { isDiffMetric } from '../../../helpers/measures'; | import { isDiffMetric } from '../../../helpers/measures'; | ||||
import { useCreateConditionMutation } from '../../../queries/quality-gates'; | import { useCreateConditionMutation } from '../../../queries/quality-gates'; | ||||
import { Condition, Metric, QualityGate } from '../../../types/types'; | import { Condition, Metric, QualityGate } from '../../../types/types'; | ||||
</FormField> | </FormField> | ||||
<FormField | <FormField | ||||
description={selectedMetric && getLocalizedMetricName(selectedMetric)} | |||||
htmlFor="condition-metric" | htmlFor="condition-metric" | ||||
label={translate('quality_gates.conditions.fails_when')} | label={translate('quality_gates.conditions.fails_when')} | ||||
> | > |
optionsWithDomains.push(option); | optionsWithDomains.push(option); | ||||
}); | }); | ||||
const handleAssigneeSearch = React.useCallback( | |||||
const handleMetricsSearch = React.useCallback( | |||||
(query: string, resolve: (options: Options<LabelValueSelectOption<string>>) => void) => { | (query: string, resolve: (options: Options<LabelValueSelectOption<string>>) => void) => { | ||||
resolve(options.filter((opt) => opt.label.toLowerCase().includes(query.toLowerCase()))); | resolve(options.filter((opt) => opt.label.toLowerCase().includes(query.toLowerCase()))); | ||||
}, | }, | ||||
controlSize="full" | controlSize="full" | ||||
inputId="condition-metric" | inputId="condition-metric" | ||||
defaultOptions={optionsWithDomains} | defaultOptions={optionsWithDomains} | ||||
loadOptions={handleAssigneeSearch} | |||||
loadOptions={handleMetricsSearch} | |||||
onChange={handleChange} | onChange={handleChange} | ||||
placeholder={translate('search.search_for_metrics')} | placeholder={translate('search.search_for_metrics')} | ||||
controlLabel={ | controlLabel={ |