AutocompleteInput does not respect createLabel prop

[davidhenley]

The createLabel text and selection is missing in version 4.1.3. It is showing correctly on SelectInput but not AutocompleteInput even though it is documented on the AutocompleteInput docs.

https://marmelab.com/react-admin/AutocompleteInput.html

The label for the menu item allowing users to create a new choice. Used when the filter is empty

The end of this list should show "Create New Type" when no input is put in

    <ReferenceInput source="typeId" reference="customer-types">
      <AutocompleteInput
        source="name"
        createLabel="Create New Type"
        createItemLabel="Create %{item}"
        create={<SimpleCreate resource="customer-types"/>}/>
    </ReferenceInput>

[slax57]

Hi,
Thanks for reporting this!
I reproduced, however, I'm unsure how to qualify this.
Currently the AutocompleteInput component only adds the Create option after you enter a filter query, and if the filter does not match exactly with one of the options. I guess the philosophy is different from a SelectInput. With an AutocompleteInput, you expect the user to search for the pre-existence of the item before allowing the creation of a new one.
But I guess this could be debated.

• If it is confirmed this is the expected behaviour, we'll need to update the docs
• If this behaviour is not desired (and we wish to be able to add items at all times) then this is an enhancement we'll need to implement

I'll request the team's pov.

[slax57]

Related code: https://github.com/marmelab/react-admin/blob/master/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx#L387

[davidhenley]

Thanks @slax57

I searched the linked code before creating the issue and the creation stuff looks identical to SelectInput. Couldn't figure it out.

I would debate at least for our purposes that AutocompleteInput should have createLabel, because sometimes we know that we need to add one on the fly before even searching and it makes sense to just click the create button before beginning to type. Especially if there are multiple fields in the new dialog. This is how we've been using it already.

[slax57]

Okay, so here's the bottom line.
Adding ability to handle different conditions for displaying the "Create" option would probably add too much complexity to this already complex component.
In order to make things clearer, we can still make some improvements to the docs:

• Remove references to createLabel from the doc
• Explain that the "Create" option will only appear after you typed something
• Encourage people to add this explanation as the input's placeholder if they expect the 'Create' option to be used often

[davidhenley]

@slax57 Could I ask why this is so much harder to implement than the SelectInput? What are the pain points? I'm trying to look at both to get a better feel for the CreateSuggestionContext and how I can implement it.

https://github.com/marmelab/react-admin/blob/master/packages/ra-ui-materialui/src/input/SelectInput.tsx
https://github.com/marmelab/react-admin/blob/master/packages/ra-ui-materialui/src/input/AutocompleteInput.tsx

[slax57]

@davidhenley It's no really that it would be hard to implement, but rather that this component already handles many props for many cases, and we fear that adding one more would make it too confusing.

Actually we thought of adding a prop like shouldAllowCreate or something in this taste to handle this, but we gave it up for the reason I mentioned.

Still, if you disagree with us, please let us know here, we might change our minds about this 😅

[davidhenley]

So my 2 cents is create/createLabel is much more important to have on AutocompleteInput than SelectInput.

If you are using SelectInput to create new items often enough to have an on-the-fly create prop, that list will definitely grow too large for the SelectInput and you need to eventually change it out to an AutocompleteInput.

[slax57]

So my 2 cents is create/createLabel is much more important to have on AutocompleteInput than SelectInput.

If you are using SelectInput to create new items often enough to have an on-the-fly create prop, that list will definitely grow too large for the SelectInput and you need to eventually change it out to an AutocompleteInput.

Closing this after merging #7844 was intended, since, after internal discussion with the team, we agreed that it would be best not to add complexity to the component, and only improve the docs for this use case.

However, I agree that you make a good point here.

Best I can do is request the opinion of @fzaninotto and @djhi , which are more experience than me with RA, and hence I consider to have a more valuable opinion than mine 😁

If you wish, you may also work on a PR to add this, which may convince us that the complexity is manageable, but I can't promise we will accept it 😅

[davidhenley]

@slax57 we still really need this functionality. I just don't understand why it used to work, but then was taken away. This is such a trivial feature that made it very clear that you can create new items.

All it needs to do is open the dialog, just like the create prop does but pass an empty filter?

It looks like others have mentioned it as well. I would love for this to be fixed.

[slax57]

@davidhenley I agree. Let's track this via #9616