Like Promise.all([])
but for objects.
import combinePromises from 'combine-promises';
const { user, company } = await combinePromises({
user: fetchUser(),
company: fetchCompany(),
});
Why:
- Insensitive to destructuring order
- Simpler async functional code
Features:
- TypeScript support
- Lightweight
- Feature complete
- Well-tested
- ESM / CJS
ThisWeekInReact.com: the best newsletter to stay up-to-date with the React ecosystem:
npm install combine-promises
// OR
yarn add combine-promises
Good, native and strict TypeScript support:
- Return type correctly inferred from the input object
- All object values should be async
- Only accept objects (reject arrays, null, undefined...)
const result: { user: User; company: Company } = await combinePromises({
user: fetchUser(),
company: fetchCompany(),
});
A common error with Promise.all
is to have a typo in the destructuring order.
// Bad: destructuring order reversed
const [company, user] = await Promise.all([fetchUser(), fetchCompany()]);
This becomes more dangerous as size of the promises array grows.
With combinePromises
, you are using explicit names instead of array indices, which makes the code more robust and not sensitive to destructuring order:
// Good: we don't care about the order anymore
const { company, user } = await combinePromises({
user: fetchUser(),
company: fetchCompany(),
});
Suppose you have an object representing a friendship like {user1: "userId-1", user2: "userId-2"}
, and you want to transform it to {user1: User, user2: User}
.
You can easily do that:
import combinePromises from 'combine-promises';
import { mapValues } from 'lodash'; // can be replaced by vanilla ES if you prefer
const friendsIds = { user1: 'userId-1', user2: 'userId-2' };
const friends = await combinePromises(mapValues(friendsIds, fetchUserById));
Without this library: good luck to keep your code simple.
Name inspired by combineReducers from Redux.