Internationalizable newTagText

[jtojnar]

Different languages use different word order like Create a new tag “{0}” and add it. so it would be useful to support it.

Describe the solution you'd like

The new tag suggestion should allow changing suffix in addition to prefix. And the values should not be separated by spaces from the tag name so that the translations can adjust it.

Then users could just run something like const [newTagPrefix, newTagSuffix] = _('source_tags_create_new').split('{0}'); and pass those.

Describe alternatives you've considered

• react-tags could decide on a string placeholder that it would replace for the tag name

  • but different internationalization systems use different placeholders so that would need to be configurable as well.

• we could replace these lines by something like

  <TagSuggestionWrapperComponent
    item={item}
    classNames={props.classNames}
    suggestionComponent={
      item.disableMarkIt
      ? item.name
      : <SuggestionComponent item={item} query={props.query} />
    }
  />

  which would be something like the following higher order component:

  function CustomTagSuggestionWrapperComponent(props) {
    const _ = useTranslations();
    const [newTagPrefix, newTagSuffix] = _('source_tags_create_new').split('{0}');
    return (
      <React.Fragment>
        {props.item.isNew
          ? <span className={props.classNames.suggestionPrefix}>{newTagPrefix}</span>
          : null}
        {props.suggestionComponent}
        {props.item.isNew
          ? <span className={props.classNames.suggestionSuffix}>{newTagSuffix}</span>
          : null}
      </React.Fragment>
    );
  }

  • Most flexible but also most complex

[i-like-robots]

I plan to the release a beta for v7 of this component later this week. This version supports using a placeholder for various text props, including the newTagText.

https://github.com/i-like-robots/react-tag-autocomplete/

[i-like-robots]

Closing as v7 has now been released and this feature is configurable.