⚡️ Attach independent, pure and easy to test Action Handlers to NGXS States.
This package allows to attach
@ngxs-labs/attach-action run the following command:
yarn add @ngxs-labs/attach-actionnpm install @ngxs-labs/attach-action
Especially large codebases can get the issue of ending up in sprawling and hard to test NGXS-state-classes. Breaking the state into smaller chunks is not always an option, especially when the data is very cohesive and the interaction between it is complex.
Thus we wanted to move actions into independent, testable and simple to grasp files. For this purpose, a small helper function was introduced which allows the declaration of actions which are handled outside of the state class.
Following this approach brought us in the desirable condition to have all actions and usefully grouped selectors in separate classes. Our file structure in large enterprise applications therefore usually looks ruffly like this:
/store /shop shop.state.ts shop.actions.ts actions/ add-product-to-cart.action.ts add-product-to-cart.action.spec.ts fetch-products.action.ts fetch-products.action.spec.ts selectors/ products.selector.ts prices.selector.ts
The responsibility of the state-class itself is just to group und bootstrap all the action declarations:
The actions are just idiomatic (higher-order) functions: