React hooks array destructuring

Following up on this discussion: https://github.com/prettier/prettier/issues/3950.

I’ll reiterate what @sompylasar said - arrays and objects should behave the same in the same scenarios.

The contributor mentioned that this was a behavior that you guys changed because of user feedback. I think you should consider changing it back because of user feedback. Array destructuring is central to the React hooks api, and it’s rather frustrating to have this:

const [ isLoading, setIsLoading ] = useState(false)

Changed to this:

const [isLoading, setIsLoading] = useState(false)

I imagine more users will have a similar complaint as hooks are more widely adopted. Perhaps this should be re-evaluated? If there is strong disagreement about this behavior perhaps it’s a candidate for an option?

And, of course thank you for putting together such a thoughtfully designed library. It really does make my job so much easier. I’m also happy to submit a PR for the change if it’s helpful.

[vtambourine]

Personally, I would prefer better consistency in such scenarios. Seeing two kinds of destructuring line by line feels weird:

const { buttons } = wrapper.state();
const [firstButton, secondButton, thirdButton] = buttons;

Same spaces patterns looks better and raises no question:

const { buttons } = wrapper.state();
const [ firstButton, secondButton, thirdButton ] = buttons;

[vtambourine]

The analysis you linked looks into spaces used around brackets in array literals. The destructuring case is different. In destructuring, the [ a, b, ...c ] syntax doesn’t represent an array, but assignment pattern. Therefore it’s not strictly valid to apply same rules and logic that used to describe arrays style rules.