Prettier should have a better opinion on createSelector() calls
See original GitHub issuePrettier 1.14.3 Playground link
--parser babylon
--print-width 120
--tab-width 4
Input:
const getSearchResults = createSelector(
getSearchResultIds,
getAllRooms,
(roomIds, allRooms) => roomIds.map(id => allRooms[id])
);
Output:
const getSearchResults = createSelector(getSearchResultIds, getAllRooms, (roomIds, allRooms) =>
roomIds.map(id => allRooms[id])
);
Expected behavior:
const getSearchResults = createSelector(
getSearchResultIds,
getAllRooms,
(roomIds, allRooms) => roomIds.map(id => allRooms[id])
);
I understand that currently prettier applies its rules regardless of context, but in case of reselect createSelector() calls this really reduces readability. The style that can be found in pretty much all examples of reselect and projects using it is very straightforward: One input selector per line, and then the callback to combine the input.
However, due to prettier’s preference of wrapping a callback argument if everything else fits in the same line (or even fitting everything in the same line), the resulting code is harder to read. It’s also inconsistent if you have multiple selectors in the same file and depending on the length of their arguments they sometimes get wrapped and sometimes they don’t.
One possible option for this could be to have some default overrides for certain function names, e.g. “one argument per line” for createSelector. I realize this might get close to “too much configuration” territory but it could always use a hardcoded list (or sane defaults) - also, easy-to-read/understand code should be a top priority IMHO, and that’s not the case with the current formatting here.
Issue Analytics
- State:
- Created 5 years ago
- Comments:7 (7 by maintainers)
Top GitHub Comments
The fix is available in
1.15.2
.Imports aren’t tracked, and I don’t think we should do that.