add prop to the autocomplete component to indicate if an automatic create action is required

This commit is contained in:
Mohamed Karray
2019-03-27 10:12:05 +01:00
parent 563dfa015e
commit 2f4f1dbe02

View File

@@ -1,6 +1,6 @@
// @flow
import React from "react";
import { AsyncCreatable } from "react-select";
import { AsyncCreatable, Async } from "react-select";
import type { AutocompleteObject, SelectValue } from "@scm-manager/ui-types";
import LabelWithHelpIcon from "./forms/LabelWithHelpIcon";
@@ -13,7 +13,8 @@ type Props = {
value?: SelectValue,
placeholder: string,
loadingMessage: string,
noOptionsMessage: string
noOptionsMessage: string,
creatable?: boolean
};
@@ -42,11 +43,12 @@ class Autocomplete extends React.Component<Props, State> {
};
render() {
const { label, helpText, value, placeholder, loadingMessage, noOptionsMessage, loadSuggestions } = this.props;
const { label, helpText, value, placeholder, loadingMessage, noOptionsMessage, loadSuggestions, creatable } = this.props;
return (
<div className="field">
<LabelWithHelpIcon label={label} helpText={helpText} />
<div className="control">
{creatable?
<AsyncCreatable
cacheOptions
loadOptions={loadSuggestions}
@@ -63,6 +65,18 @@ class Autocomplete extends React.Component<Props, State> {
});
}}
/>
:
<Async
cacheOptions
loadOptions={loadSuggestions}
onChange={this.handleInputChange}
value={value}
placeholder={placeholder}
loadingMessage={() => loadingMessage}
noOptionsMessage={() => noOptionsMessage}
/>
}
</div>
</div>
);