Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unify message place holders for autocomplete field #58

Open
ddivin-sc opened this issue Mar 29, 2021 · 0 comments
Open

Unify message place holders for autocomplete field #58

ddivin-sc opened this issue Mar 29, 2021 · 0 comments
Milestone

Comments

@ddivin-sc
Copy link
Contributor

ddivin-sc commented Mar 29, 2021

Description

Now we can different messages between Select2 and react-select components.
We should unify messages for the react autocomplete field as follow

  • when the result is not found show the message Nothing found. Please modify your search criteria.
  • when the result is not loaded Loading failed.
  • when the result is loading Searching...
  • when the search restrictions are to short Please enter {n} or more characters.

I suggest the following implementation for the case with min autocomplete chars

  static propTypes = {
    minAutocompleChars: PropTypes.number
  };

  static defaultProps = {
    minAutocompleChars: 0
  };
  


  getOptions = (atocompleteChars, callback) => {
    const { autocompleteAction, minAutocompleChars } = this.props;
    
    if (atocompleteChars.length >= minAutocompleChars) {
	    autocompleteAction(atocompleteChars).then((result) => {
                  setState({loadingError: false})
	      callback(result)
	    }).catch((anError) {
                    setState({loadingError: true})
            });
    } else {
          setState({loadingError: false})
         callback([options: [], "complete": false])
    }
  };

  render() {

    const {minAutocompleChars} = this.props;
    ...
     noOptionsMessage: ({inputValue: atocompleteChars}) => {
          if (loadingError) {
          return <div class="error">Loading failed</div>
 }
         if (atocompleteChars.length >= minAutocompleChars) {
            return "Please enter {minAutocompleChars} or more characters"
         } else {
            return "No matches found"
         }
    },

    ....
  }

NOTES: After these changes, we should update autocomplete fields in the following grails plugins

  • express-catalog-contract-editor
  • domain-core
  • business-partner
  • classification
  • oraganization
  • contract
  • product-catalog
  • user-info

Original issue: https://opuscapita.atlassian.net/browse/EPROC-20250

@ocmachineuser ocmachineuser added this to the 3.0.16 milestone Apr 8, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants