InfluxDB: InfluxQL: make nicer custom-select-value UI (#34289)

* influxdb: influxql: make niceer custom-select-value

* add code for missing case

* moved to the right place
This commit is contained in:
Gábor Farkas 2021-05-19 12:31:52 +02:00 committed by GitHub
parent d6c4c2fcd5
commit a9255db370
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -58,6 +58,12 @@ type SelReloadProps = {
allowCustomValue?: boolean;
};
// when a custom value is written into a select-box,
// by default the new value is prefixed with "Create:",
// and that sounds confusing because here we do not create
// anything. we change this to just be the entered string.
const formatCreateLabel = (v: string) => v;
const SelReload = ({ loadOptions, allowCustomValue, onChange, onClose }: SelReloadProps): JSX.Element => {
// here we rely on the fact that writing text into the <AsyncSelect/>
// does not cause a re-render of the current react component.
@ -70,6 +76,7 @@ const SelReload = ({ loadOptions, allowCustomValue, onChange, onClose }: SelRelo
return (
<div className={selectClass}>
<AsyncSelect
formatCreateLabel={formatCreateLabel}
defaultOptions
autoFocus
isOpen
@ -99,6 +106,7 @@ const SelSingleLoad = ({ loadOptions, allowCustomValue, onChange, onClose }: Sel
return (
<div className={selectClass}>
<Select
formatCreateLabel={formatCreateLabel}
autoFocus
isOpen
onCloseMenu={onClose}