Auto converting the tags that a user enters to lower case, rather than giving a validation error

[TimCliff]

This is an enhancement issue to track a community developer task.

[TAMustafa]

It looks like the code change need to happen in the following file:
src/app/components/cards/CategorySelector.jsx

At Line 84:
cats.find(c => /[A-Z]/.test(c)) ? tt('category_selector_jsx.use_only_lowercase_letters') :

Can the result of the input be passed to a function that uses the toLowerCase() method?

//Function to convert tags into LowerCase

function toLower(tag){
 return tag.toLowerCase();
}

//And use .map method to apply array to toLower function
var tagToLower = c.map(toLower);

I try to get condenser running to test this approach.

[voorash]

I think the code at line 84 is only testing that the tag is all lowercase. It needs to be converted to lower case before the validation is run.

[voorash]

I wrote some code that fixed the issue but after reading more info I realized I need a better feel for redux and then I could fix this in a more appropriate fashion.

[stephanmullerNL]

So when should this transformation occur? It could be done onChange (every uppercase letter is directly transformed to lowercase), but maybe onBlur is less intrusive?

[voorash]

Making these two changes fixes the issue. My only issue was I wasn't sure if it was ok to make that change directly to the event or if I needed to make a copy and then change that and then pass it to onChange.

this.categoryInputOnChange = (e) => {
          e.preventDefault()
          e.target.value = e.target.value.toLowerCase()
          this.props.onChange(e)
        }

const categoryInput =
          <input type="text" {...cleanReduxInput(impProps)} ref="categoryRef" tabIndex={tabIndex} disabled={disabled} onChange={this.categoryInputOnChange}/>

[voorash]

Oh and that first function is added to the CategorySelector constructor right after categorySelectOnChange

[stephanmullerNL]

Ha that's exactly the solution I came up with, but then the "no uppercase" validation warning still remains even though it's converted?

I don't think modifying the event should be a problem by the way.

Oh and if you also add .replace(/\s+/g, ' ') to it also strips double spaces (which it counts as an extra tag)

[voorash]

I don't get the error message anymore with that change

[voorash]

hmm, the extra space removal is a good idea although I had already committed and tested my code so you might want to do a second PR after mine is done.

[stephanmullerNL]

Alright, will do!

I got the error because I didn't use e.preventDefault() by the way, so that explains :)

[plink01001]

Closing in favor of #2061