UnitPicker: show custom units on load (#21397)

This commit is contained in:
Ryan McKinley 2020-01-08 07:16:42 -08:00 committed by GitHub
parent cd5d5bcbba
commit 5321e7536f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -26,15 +26,23 @@ export class UnitPicker extends PureComponent<Props> {
render() { render() {
const { value, width } = this.props; const { value, width } = this.props;
// Set the current selection
let current: SelectableValue<string> | undefined = undefined;
// All units
const unitGroups = getValueFormats(); const unitGroups = getValueFormats();
// Need to transform the data structure to work well with Select // Need to transform the data structure to work well with Select
const groupOptions = unitGroups.map(group => { const groupOptions = unitGroups.map(group => {
const options = group.submenu.map(unit => { const options = group.submenu.map(unit => {
return { const sel = {
label: unit.text, label: unit.text,
value: unit.value, value: unit.value,
}; };
if (unit.value === value) {
current = sel;
}
return sel;
}); });
return { return {
@ -43,14 +51,15 @@ export class UnitPicker extends PureComponent<Props> {
}; };
}); });
const valueOption = groupOptions.map(group => { // Show the custom unit
return group.options.find(option => option.value === value); if (value && !current) {
}); current = { value, label: value };
}
return ( return (
<Select <Select
width={width} width={width}
defaultValue={valueOption} defaultValue={current}
isSearchable={true} isSearchable={true}
allowCustomValue={true} allowCustomValue={true}
formatCreateLabel={formatCreateLabel} formatCreateLabel={formatCreateLabel}