fix(deps): update dependency easy-peasy to v5
This PR contains the following updates:
| Package | Change | Age | Adoption | Passing | Confidence |
|---|---|---|---|---|---|
| easy-peasy (source) | 2.6.6 -> 5.1.0 |
Release Notes
ctrlplusb/easy-peasy
v5.1.0
Minor Changes
- Feat: Adds support for React 18: #769
Patches
- Fix broken links in Thunk docs: #756
- Update computed property docs: #735
- Allow unstable_effectOn effect to return void: #730
- Typo: #749
- Changed from
connectto Hooks :zap:: #652
Credits
Huge thanks to @jmyrland, @avramch, @no-stack-dub-sack, @yethranayeh, and @troglodytto for helping!
v5.0.5
Patches
- Chore: Updates dependencies:
2fab9a2 - Chore: Upgrades dependencies:
c63555c - Optimize computed props: #764
Credits
Huge thanks to @jmyrland for helping!
v5.0.4
Patches
- Updates dependencies:
ea98660 - Upgrades dependencies, removes previously broken TS comment:
444396f - Fixes docs per PR #558:
8640563 - Upgrades dependencies:
8fce26b - UseLocalStorage: Recreate store if dependencies change: #685
- Bump ws from 7.3.1 to 7.5.3: #690
- Bump browserslist from 4.16.1 to 4.16.8: #691
- Bump elliptic from 6.5.3 to 6.5.4: #692
- Remove fast-memoize from docs: #663
- Fix the typo in the action example: #650
- Fixing broken link: #643
- Minor name fix in Thunk docs: #635
- Upgrades dev deps:
f24ab25 - Upgrades dependencies:
68fdfff
Credits
Huge thanks to @fbieler, @mfbx9da4, @yakovlevyuri, @w3bdesign, and @GavinRay97 for helping!
v5.0.3
## Patches
- Fixes computed property caching
v5.0.2
Patches
- Fixes computed property access within actions:
772f1b5
v5.0.1
Patches
- Fixes issue with computed properties not binding correctly
v5.0.0
A new website! https://easy-peasy.dev
Finally! The next major version of Easy Peasy has landed. It's been a long time coming, and we are hopeful that the need for a new major release will be a long way off.
This last year has been a challenging one for me on a personal level, so I want to extend my thanks to the patience that the community has shown in me getting this release together. I am aware that the docs still do not reflect the full updated API reflection of v4. I humbly apologise for this and do promise that parity will be achieved. This release already includes a lot of ground work around revamping the docs. I plan to pump a lot more hours into getting the docs into a much more improved and useful structre.
I've become aware of a critical security issue with the version of Immer currently utilised within Easy Peasy <= v4. For that purpose I am issuing this release earlier than I anticipated.
Whilst this is a major release the breaking changes are very minimal. So I sincerely hope that your upgrade will be as fluid as it can be.
Breaking Changes
- Removed the
memohelper. You'll need to bring your own memoization library, for e.g. memoizerific.
Changes
-
Upgraded to Immer v8 🎉
-
Fixes to support IE11!
You will need to use our new import at the entry of your application to patch Proxy.
import 'easy-peasy/proxy-polyfill'; // The rest of your app code...In addition to this if you use Map or Set in your state then you will need this additional import at the entry of your application.
import 'easy-peasy/proxy-polyfill'; import 'easy-peasy/map-set-support'; // The rest of your app code... -
Improved the bundle size! The Gzip bundle is back down to approximately 10kb.
-
Fixed issue with computed properties throwing errors when being accessed in certain scopes
-
Improved the module exports to improve tree shaking capability
-
Added various bundle type support to the package.json, e.g. "module".
-
Fixed bugs when rehydrating persisted state
v4.0.2
Patches
- Upgrades dependencies:
a72aa7e
v4.0.1
Patches
- [TypeScript] Fixes optional payload declaration for Thunk types.:
b39dd4e
Closes #565
v4.0.0
The long wait is over.
v4 has arrived! 🎉
This release includes an insane amount of improvements and fixes, with an ironing over some of the APIs and features that were introduced in v3.
This release will also include a completely overhauled website. This work is still in progress and is likely to continue even after the v4 release. It's a lot of work and I don't want it to be the sole reason for us holding back on the v4 release.
Unfortunately there are breaking changes, however, I expect the breaking changes will only impact a subset of our userbase that are using the more advanced features of Easy Peasy.
Breaking Change
Replaced createComponentStore with a useLocalStore hook
The API for createComponentStore was a verbose and limited.
Taking learnings from it we have replaced it with a new API; namely useLocalStore.
function MyCounter() {
const [state, actions] = useLocalStore(() => ({
count: 0,
increment: action((_state) => {
_state.count += 1;
}),
}));
return (
<div>
{state.count}
<button onClick={() => actions.increment()}>+</button>
</div>
);
}
Please see the API documentation for more information.
Persist API rewrite
The persist API received a huge overhaul to the point that it should essentially be considered a rewrite.
We suggest that you read the updated docs and update your implementations accordingly.
Some notable changes include:
- API is now always asynchronous in terms of persisting and rehydrating. This allows us to support a single recommended API structure for implementing persisting and rehydration.
- Persist operations are now optimised utilizing a combination of the browser's requestIdleCallback or requestAnimationFrame APIs.
- The merge strategies have been renamed as follows:
- mergeDeep
- mergeShallow
- overwrite
- The mergeDeep strategy is now the default
- Merging strategies are now sensitive to model updates. If we note a type difference comparing the store model's initial state to persisted state we will use the store model's initial state instead as it likely indicates an evolved model. Null or undefined values are excluded from this comparison.
- A "version" number has been introduced on the creatStore config. If you utilize this value we will compare the persisted state version number against the current store version number - if they do not align the persisted state will be ignored. This gives you absolute guarantees if you wish to ship a refactored store model without worrying about breaking clients with already persisted state.
- New APIs and support has been added for managing rehydration of dynamically added models.
- A huge number of bug fixes. Some of these marked as critical.
Upgraded to immer@7
We used to managed a forked version of Immer as it previously did not support computed properties. This is no longer the case! We now rely on the native Immer package.
A side effect of this is that you may experience browser support issues for browsers that do not support support Proxy.
If you require your application to work on such environments (e.g. Internet Explorer 11 or some versions of React Native on Android) then please ensure that you import and execute the enableES5 feature from Immer.
import { enableES5 } from "immer";
enableES5();
Moved internal redux-thunk binding to grant user defined middleware higher priority
This will allow you to influence thunks prior to their execution. For advanced cases.
This likely will have zero impact on anyone, but given the nature of the change we are marking it as breaking.
Thunk action states, error handling, and listener behaviour updates
Easy Peasy will no longer catch any errors within your thunks and dispatch a "failed" state action. If you wish to explicitly mark your thunk as failed, so that an action listener can respond to it accordingly then you need to use the new fail helper that is provided to thunks.
const model = {
myNaughtyThunk: thunk((actions, payload, helpers) => {
try {
await axios.get('/an-endpoint-that-fails');
} catch (err) {
// This will dispatch a @​thunk.myNaughtyThunk(fail) action with the err attached
fail(err);
}
})
};
Error handling is now explicitly your responsibility.
The actions that are dispatch to represent thunk states have been updated. Taking the example above here are the possible action types that will be dispatched and visible in the redux dev tools:
-
@thunk.myThunk(start)Dispatched at the start of a thunk execution.
-
@thunk.myThunk(success)Dispatched when a thunk has completed - i.e. with no uncaught errors occurring.
-
@thunk.myThunk(fail)Dispatched if the
failhelper was called. In this case the@thunk.myThunk(success)would not have been dispatched.
Listeners (actionOn and thunkOn) will now by default only respond to the "success" event of a thunk. If you wish to handle the "fail" events then you will need to explicitly resolve them.
onAddTodoFailed: actionOn(
(actions) => actions.saveTodo.failType,
(state, target) => {
state.auditLog.push(`Failed to save todo: ${target.payload}`);
}
);
New Features
unstable_effectOn
*Note: this is an experimental API. We are pre-releasing it to allow for early feedback. The API is subject to breaking changes with any release of Easy Peasy. As such we have prefixed the API with "unstable*", much like React does with its experimental APIs. Once the API has stabilised the "unstable*" prefix will be removed and semver based releases will be respected.*
Allows you to declare an effect within your model which will execute every time the targeted state changes.
Two arguments are provided to unstable_effectOn; namely the stateResolvers and the handler. The stateResolvers are an array of functions which should resolve the target state that should be tracked. When the tracked state changes the handler function is executed.
The handler can be asynchronous or synchronous. It receives the store actions, a change object containing the prev values for the targeted state and the current values as well as the action that caused the change in state. It additionally receives a helper argument allowing you to access the store state etc.
The handler additionally allows you to return a dispose function, which will be executed prior to the next execution of the handler. This can be useful in performing things like API call cancellation etc.
import { unstable_effectOn } from 'easy-peasy';
const todosModel = {
items: [],
saving: false,
setSaving: action((state, payload) => {
state.saving = payload;
}),
unstable_effectOn(
// Provide an array of "stateResolvers" to resolve the targeted state:
[state => state.items],
// Provide a handler which will execute every time the targeted state changes:
async (actions, change) => {
const [items] = change.current;
actions.setSaving(true);
await todosService.save(items);
actions.setSaving(false);
}
)
};
Context stores now allow you to override injections at runtime
Simply pass your injections as a prop to the Provider for the context store.
See the updated docs for more information.
Fixes
Computed properties are now immutable bound to state
Previously if you executed a computed property it would always resolve against the latest version of the store state. Now it will operate against the state at the moment of time it was pulled out from.
In doing this we also addressed a strange case where you may get an error for invalid computed property access.
Internals rewritten to utilize incoming model definitions immutably
This will address any issues where you may have been providing model definitions to different stores.
TypeScript
Loads of fixes and improvements to the typings
Phew. Too many to mention. Just take our word for it. Tons of nitty issues have been addressed.
Added support for generics in models
Previously if you defined a model containing generic state, like below, TypeScript would break within your actions.
interface StoreModel<K> {
data: K;
updateData: Action<StoreModel<K>, K>;
}
const numberStoreModel: StoreModel<number> = {
data: 1337,
updateData: action((state, payload) => {
// A TypeScript would be thrown at this point
// 👇
state.data = payload;
}),
};
Unfortunately we were unable to directly resolve the case of generic properties due to current limitations with the TypeScript type system. We created a StackOverflow question which details the problem.
In a gist; the issue is that Easy Peasy's underlying State and Action types map over the user provider model types in order to filter down to types that represent state and actions respectively. However, when defining a generic state, TypeScript assumes that the generic state intersects with types that are trying to be filtered out of each case. Therefore the filtering ends up always removing your generic state.
To resolve the case of generic state we have introduce a new API helper. Any time you wish to have a generic state value within your model, simply wrap it with the Generic type, and then assigned the associated value within the model instance using the generic helper.
import { Generic, generic } from "easy-peasy";
interface StoreModel<K> {
data: Generic<K>; // 👈
updateData: Action<StoreModel<K>, K>;
}
const numberStoreModel: StoreModel<number> = {
data: generic(1337), // 👈
updateData: action((state, payload) => {
// Note that you don't need to wrap the payload with the
// helper 👇
state.data = payload;
}),
};
numberStoreModel.getState().data;
// 1337
typeof numberStoreModel.getState().data;
// number
Note how you only need to use the helper at the point of defining the initial value of the generic model state. Within your actions and anywhere you consume the state you would treat the value as the underlying generic value (i.e. a number in the example).
Removed the limit on TypeScript model depth
Previously, if you had a model more than 6 levels deep, in terms of object structure, the TypeScript mapping wouldn't work as expected. This is no longer the case.
Fixed the statemapper eating up "classes"
If you assigned a class instance to your state the typings from getState / useStoreState etc would report your type as being something similar to:
With this fix your state will correctly be reported back as the actual class type (Person in the examples case).
Fixed action mapper so that state isn't display when viewing actions
The VSCode intellisense for actions were showing state. The types have been patched so that only actions will be displayed.
Fixed state mapper where actions were still being represented on state
There were cases if you had a nested action and only primitive state next to it that you would see the nested action. This is no longer the case.
Fixed computed properties state resolvers not inferring resolved types correctly
If you used a state resolver array within your computed properties, whilst using TypeScript, the inferred types based on the resolved state was incorrect. This is now fixed.
v3.3.1
This is a no-op release that just fixes latest on npm due to an accidental publish.
v3.3.0
Minor Changes
- Feat: Shallow equality function as 2nd argument for useStoreState(): #354
Patches
- Update testing-thunks.md: #397
- Bump handlebars from 4.1.2 to 4.5.3: #391
- Fixes typos in Redux interop doc page: #388
- Update the
reducercomment block in the Interop recipe.: #310 - Upgrades dependencies:
e9b4a1b - Remove note about delay: #399
- Merge branch 'master' of https://github.com/ctrlplusb/easy-peasy:
746ed5b - Updates website config:
6c5b8f6 - Upgrades deps:
063ff4a - Upgrades dependencies:
90dec92
Credits
Huge thanks to @joelmoss, @loveforweb, @gamtiq, @jaredmeakin, and @nickmeldrum for helping!
v3.2.6
Patches
- Adds workaround example for generics:
52c396b - Upgrades deps:
81e3c0a - Updates deps:
afe755c - Minor refactoring to reduce KB footprint:
fe617fd - Update docs for store: #366
- Update docs for action: #367
- Update docs for computed: #368
- Update docs for use-store-actions: #369
- Update docs for use-store-state: #370
- Merge branch 'master' of https://github.com/ctrlplusb/easy-peasy:
bb51fc0 - Updates deps:
72e6070 - Small updates to docs: #375
- Fix broken links in docs: #377
- Upgrades dependencies:
51c633f - Adds npmignore:
07abd4c - Bumps version:
3bd3de5 - Updates npmignore:
3b5186b
Credits
Huge thanks to @crissdev for helping!
v3.2.5
v3.2.4
v3.2.3
Patches
- Small fix to mergeDeep persistence rehydrate strategy:
501f237
v3.2.2
Patches
- Minor improvement to types:
16c7d13 - Small fix on mergeDeep strategy for persistence rehydration:
38de869 - Adds more TS test coverage:
01fd077 - Updates deps:
5e033e2
v3.2.1
Patches
- Fixes typescript issue with generics and actions:
bd9e978
v3.2.0
Minor Changes
- Adds store persistence APIs: #343
Patches
v3.1.2
Patches
- Fixes actions allowing them to return new state without explicitly having to disable immer:
7f13514
v3.1.1
Patches
- Fixes compatibility with react-redux provider.:
e199314 - Fixes debug helper, and updates it's docs:
fb63aac
v3.1.0
Minor Changes
- Adds useStore hook:
e128e1e
Patches
- Fixed some lint issues:
740d1a4 - Update testing-actions.md:
52a8561 - 📝 Add comma at action listener example:
5963568 - Update adding-typed-actions.md:
c92ff7c - Update adding-typed-thunks.md:
e0ddb22 - Fix: added html suffix to store links within docs;:
d3cc2b5 - Reduce the number of mapped types used in state mapper:
66da041 - Prevent state updates on unmounted components:
65a2fd8 - Minor tweak to typescript state mapper:
c4efa4f - Upgrades dependencies:
ea8aa83 - Adds generic model typescript case:
08ab8d9
v3.0.3
v3.0.2
Patches
- Updates deps:
ee424b4 - Adds warning about invalid computed property access:
6992dc9 - Bumps deps and version:
a4202a7
v3.0.1
Patches
- Upgrades deps:
6becae1
v3.0.0
v3 is considered the realisation of the "final" Easy Peasy API - taking all the evolution and learning from v2 to produce a long term stable API that we will commit to supporting and will do our best to avoid breaking changes moving forward.
New Features
Hot reloading support
Hot reloading is supported via the store.reconfigure(model) API. See #168
New actionOn and thunkOn APIs
These are the new and only APIs by which to define action/thunk listeners with.
The v3 website has been updated with tutorials and API docs introducing these APIs.
We are really sorry about the churn around listener APIs! This API was driven by community feedback so feeling far better about it. 👍
Breaking Changes
Removed deprecated APIs
-
listen(use the new actionOn or thunkOn APIs instead) -
actionandthunkcan no longer be configured as listeners (use the new actionOn or thunkOn APIs instead) -
select(use computed instead) -
selector(use computed instead) -
useStore(renamed to useStoreState) -
useActions(renamed to useStoreActions) -
useDispatch(renamed to useStoreDispatch) - store instances have had the following properties removed:
-
triggerListener -
triggerListeners -
useStoreState(import from 'easy-peasy' or use createTypedHooks for TS) -
useStoreActions(import from 'easy-peasy' or use createTypedHooks for TS) -
useStoreDispatch(import from 'easy-peasy' or use createTypedHooks for TS)
-
Thunks can be either asynchronous and synchronous
Using async/await or returning a Promise from a thunk will maintain its previous async behaviour.
However, if you do neither of the above your thunk will be executed synchronously. Therefore you can now get eager updates to your state if all you do is dispatch actions within your thunk. This can be handy for encapsulating logic based action dispatching.
For example
addProduct: thunk((actions, payload) => {
switch (payload.type) {
case 'SHOES':
actions.addShoe(payload);
break;
case 'VEGETABLE':
// ...
}
});
Returning immutable state from actions
If you prefer to return new immutable state from your actions, rather than mutating the state, you need to set the new disableImmer flag.
import { createStore, action } from 'easy-peasy';
const model = {
todos: [],
addTodo: action((state, payload) => {
// 👇 new immutable state returned
return [...state, payload];
})
}
const store = createStore(model, {
disableImmer: true // 👈 set the flag
})
Failing to disable immer may result in strange errors if you are using computed properties.
computed
In order to optimise the Typescript experience we have made a fairly small change to the computed API. If you wish to use state resolvers, these now need to be defined as the first argument.
Before
const basketModel = {
productIds: [],
products: computed(
(productIds, products) => productIds.map(id => products[id]),
[
state => state.productIds,
(state, storeState) => storeState.products.items
]
)
};
After
const basketModel = {
productIds: [],
products: computed(
[
state => state.productIds,
(state, storeState) => storeState.products.items
],
(productIds, products) => productIds.map(id => products[id])
)
};
Computed properties not using state resolvers remain unchanged.
useStoreState API update
useStoreState(previouslyuseStore) no longer needs/accepts the dependencies 2nd argument. Your state will get mapped correctly if they use external values, like props, within the mapState` function.
Typescript
We officially support >= [email protected]. Although we recommend using the latest version ([email protected] at the time of writing), in order to ensure you are up to date with the latest bug fixes.
Create React App users can just install [email protected] as a dev dependency and the CRA build system will use that version. You may get a warning printed to your console, however, we experienced no issues with this. 👍
Note: using a lower version of TypeScript 3.x may still work, however, you may have issues.
Hooks
You will have noted above that the useStoreState, useStoreActions, and useStoreDispatch are no longer attached to the store instance. You need to use the createTypedHooks helper instead.
import { createTypedHooks } from 'easy-peasy';
import { StoreModel } from './model';
const { useStoreActions, useStoreState, useStoreDispatch } = createTypedHooks<StoreModel>();
export default {
useStoreActions,
useStoreState,
useStoreDispatch
}
Computed
The Computed type no longer requires you to define the types for state resolvers. These will automatically be inferred.
Before
interface BasketModel {
productIds: string[];
products: Computed<
BasketModel,
Product[],
ResolvedState2<string[], Product[]>,
StoreModel
>
}
After
interface BasketModel {
productIds: string[];
products: Computed<
BasketModel,
Product[],
StoreModel
>
}
Commits
- Update overview.md:
f5fbe87 - Removes deprecated code:
ba955a5 - Removes unused assets:
0a06ee8 - Cleans up and organises the typescript definitions:
78dc4d4 - Adds depth limit to State and Actions typescript definitions:
55375dc - Fixes index signatures on state:
7ce3188 - Dispatch no longer has actions bound to it and fixes to types:
ff6cd76 - Removes unused deps and bumps version:
858c96b - Adds yarnrc:
0bdbdad - Fixes thunk payloads:
8b8bdce - Bumps version:
bff2d9c - Adds test case for state any:
7545e63 - Breaking change listenTo actions now resolved via callback funciton:
8086cb2 - Progress on new tutorial:
70287db - Updates docs:
4b30b9f - Updates website:
754d6a2 - Website updates:
85e8f7b - Fixes useStoreState so that an update gets handled in same render cycle across hook instances:
6f2826f - Bumps version:
56c871f - Fixes multi hook render cycle issue:
42dc2e1 - Bumps version:
09ac40f - Removes the need to define dependencies on useStoreState:
4cb3ec3 - Bumps version:
cd14db1 - Removes instance of useStoreState dependencies:
1ff97f7 - Updates deps:
6145efa - Website updates:
75ce14c - Reverts the change that removed bound action creators on the stores dispatch:
e8aa7bd - Fixes action name helper typings:
d37943d - Bumps version:
de12c2c - Fixes store so it does not kill class based properties:
1c51bf7 - Bumps version:
b3ad4eb - Updates website:
8c4ffa2 - Installs v3 of ts-toolbelt and bumps version:
d926ce3 - Bumps version:
e300c57 - Creates a simplified immer produce and fixes debug helper:
461d42e - Adds an additional test case for typescript generic interface models:
3f82175 - Bumps version:
7a382e8 - Adds new listeners APIs as per #247: #251
- Updates ts-toolbelt.:
d93a01c - Moves prop-types from peer deps to deps:
ca321b2 - Updates to Typscript 3.5.3:
39b80a3 - Removes prop-types from dev deps:
88aed9a - Upgrades deps:
f77cb49 - Adds a comment to a typescript test case:
925c68c - Adds createTypedHooks API back:
3a16e10 - Bumps version:
332c80b - Updates website:
b23993a - Updates website:
49e4f25 - Adds the ability to reconfigure a store:
270dc6a - Bumps version:
80112da - Updates website:
809c278 - Updates website:
dfc4209 - Updates website:
68721b8 - Updates website:
58204ff - Updates website:
9f3152b - Adds now deploy config:
0eada96 - Removes the hooks from store instance:
49ee9e3 - Updates website:
9261d23 - Bumps version:
9e519d0 - Updates website:
672e786 - Adds tests and docs about testing:
06e67ac - Adds 100% code coverage:
d35153c - Code housekeeping:
95eb5ef - Updates website:
bee0ad6 - Bumps version:
e4859b9 - Updates website:
0efd3d0 - Updates readme:
2be472b - Refactor listener TS api: #259
- Type experiment:
17f8215 - Refactors computed and simplifies the TS defs for it.:
13526ba - Updates docs:
9f4f8cc - Bumps version:
0646512 - Enables disabling of immer:
ada83d7 - Code cleanup and refactoring. Listeners correctly prefixed:
292804f - Moves listeners into a getListeners API of the store instance:
c9ee9d8 - Updates documentation per new getListeners:
2706d22 - Fixes disableImmer behaviour:
5ae789a - Bumps version:
7c97880 - Updates release number in docs:
6147021 - Minor docs update and definition fix:
dfaf0cc - Updates website:
9f221da - Bumps version:
6efd17e - Bumps version:
961a4fc - Converts thunks so that they can be asynchronous or synchronous:
c465d98 - Upgrades deps:
78923e3 - Fixes computed property reducer access cases:
d9aa182 - Updates deps:
412c77f - V3:
a297302
Configuration
📅 Schedule: Branch creation - "before 3am on Monday" (UTC), Automerge - At any time (no schedule defined).
🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.
♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about this update again.
- [ ] If you want to rebase/retry this PR, check this box
This PR has been generated by Mend Renovate. View repository job log here.