microsoft/tslint-microsoft-contrib

Relax the no-void-expression configuration for arrow functions

astorije opened this issue · 1 comments

Using the recommended ruleset, the no-void-expression rule is enforced (here).

With the recent addition of React Hooks, in particular the useState hook, inlining arrow function has become a lot more frequent. Documentations such as the React doc itself, or Apollo tutorials such as this one use this to make things more concise and palatable.

For example, this format is pretty accepted and convenient:

export const ModalContainer: React.FunctionComponent = props => {
  const [open, setOpen] = React.useState<boolean>(false);

  return <Modal open={open} onClose={() => open(false)} />;
};

(Of course this is just a dumb example, do not challenge me on the why and how of that made up Modal interface lol)
The default ruleset enforces writing this as:

return <Modal open={open} onClose={() => { open(false); }} />

Which Prettier (and maybe this ruleset as well? I am not sure as we have disabled stylistic rules in favor of Prettier) formats it on a dedicated line:

return (
  <Modal
    open={open}
    onClose={() => {
      open(false);
    }}
  />
);

This becomes a little tedious. Would you be open to having the default ruleset be a little more flexible about this?

We are currently adding the following override to our configuration:

no-void-expression:
  - true
  - ignore-arrow-function-shorthand

But we think it would be an acceptable default for the recommended ruleset (and would not introduce a breaking change).

☠️ It's time! ☠️

Per #876, this repository is no longer accepting feature pull requests. TSLint is being deprecated and we recommend you switch to https://typescript-eslint.io.

Thanks for open sourcing with us, everyone!