Rule for sort JSX props

[ceopaludetto]

Describe the need
I want to sort JSX props based on several options, this can improve readability and keeps solid specific props in order, just like eslint-plugin-react does

Suggested Solution
Create a rule to sort props which will consider refs, directives, asc/desc order, multiline props and callbacks

[joshwilsonvu]

Hi, thanks for writing up the feature request. I'm a little hesitant to add rules for formatting concerns rather than for actual problems, now that Prettier is the most common way to do formatting, but if there's significant demand then that could change.

Have you tried enabling eslint-plugin-react's version of the rule on your Solid code? Many of that plugin's rules still work on Solid code because the syntax is so similar. If you give that a try and it works, please let us know in this thread so anyone else who is interested can find it 🙂 If not, a plugin for Prettier might be a better fit.

[ceopaludetto]

Hi, thank you for the quick response. I agree to delegate the responsibility of style rules to prettier, however, I found an old issue that states it is not possible prettier/prettier#323, I don't know if that still holds true today. Regarding the react rule, it works well, but solid has some minor differences in terms of event listeners naming, apparently sort gets confused a bit. Also, I am not very fond of the idea of installing a react rule in a solid project.

[joshwilsonvu]

Okay, I guess once this rule is ported it wouldn't be much of a maintenance burden, so I'm opening up to adding it, off by default. I'm sure people would find value in it. Perhaps a simplified, opinionated version without all the options since they greatly expand the number of tests required.

Can you provide specifics and/or examples on how eslint-plugin-react's version is getting tripped up? I'm guessing on:click and the like?

[eagerestwolf]

Wouldn't this be best served by an existing plugin that specializes in sorting, like eslint-plugin-perfectionist(which already has support for JSX props and Solid)?