Support for `multilineLast` in `jsx-sort-props`

[duhamelgm]

Hello!

We have an use case that its not covered in jsx-sort-props.
For readability purposes we prefer to have multiline props at the bottom. We found that long components become hard to read when following only alphabetical order, and it's prefered to split them by the complexity of the prop instead.

// Current jsx-sort-props 
<Field
  float
  className={classNames(classes.inputWidth, {
    [classes.noBorder]: isActive === "values",
  })}
  disabled={isDisabled}
  initialValue={computePercentage(number, count)}
  InputProps={{
    ...customInputProps,
  }}
  inputProps={{
    className: inputClassName,
  }}
  min="0"
  name="fieldName"
  placeholder={getTranslation("field")}
  validate={validate}
/>

// Using a possible multilineLast rule option
<Field
  float
  disabled={isDisabled}
  initialValue={computePercentage(number, count)}
  min="0"
  name="fieldName"
  placeholder={getTranslation("field")}
  validate={validate}
  className={classNames(classes.inputWidth, {
    [classes.noBorder]: isActive === "values",
  })}
  InputProps={{
    ...customInputProps
  }}
  inputProps={{
    className: inputClassName,
  }}
/>

Should this option be implemented in jsx-sort-props?

[ljharb]

It's an interesting idea, and certainly achievable.

I'm not sure it's common enough to warrant the complexity tho, and it kind of feels like it's papering over the real problem: that a component takes so many props in the first place that reading it alphabetically is difficult.

[duhamelgm]

I think there's no easy way to validate if it's common enough or not, but we can see a use case in some components of commonly used libraries like react-final-form or material-ui which receive multiple props of multilayer complexity.

And I agree that having multiple multiline props in a component might feel like an antipattern for some people, but I think that if you want to enforce that behavior in your codebase you should use a different rule set that checks that for you. IMO jsx-sort-props should only care about props readability and not prop complexity conventions.

[ljharb]

I suppose an option that treats multiline props as a separate group, allows it to be configured "first" or "last", and sorts each group of (multiline, single-line) props according to all the other rules, would be reasonable.

The PR adding it should please provide extensive test cases, potentially duplicating every other existing tested scenario.