CODEWITHSUNDEEP
javascriptangularngrxngrx-effects
Thomas Maddocks
Thomas Maddocks

Reputation: 1385

NGRX handling errors for getting / creating / deleting

I have a reducer which currently stores state for a product. I have the current state structure:

{
    draft: {},
    loading: false,
    error: false
}

My question here is how do I support handling errors when the user creates / deletes a product? I don't want to use the same loading / error property for getting / creating / deleting - they may need to happen simultaneously. Would I be best creating separate reducers such as createProductReducer / deleteProductReducer / getProductReducer, or maybe moving errors / loading into their own errorReducer / 'loadingReducer`?

Upvotes: 0

Views: 142

Answers (1)

Olaf Horstmann
Olaf Horstmann

Reputation: 16882

As a basic rule of thumb: The reduce does not contain any logic and contains (in most cases) semantically related data.

So in short: I would not advice you to split up your productReducer into multiple reducers.

Secondly I would suggest you to rethink the data-flow and if you really need to have one-time-events (errors in your case) being part of the application-state. In most cases this is not necessary.

Here is how I usually handle this:

Errors: Any external operation(REST, db-calls ect...) is done by having an effect that calls a service-method. If an error occurs - the effect returns an action(e.g. ERROR_ACTION), that is only handled by some root-component to display errors (through actions$.ofType(ERROR_ACTION)...) - no reducer or effect listen for this action (unless there is some logging-service involved).

Loading: There is a reducer (uiReducer) that has a loading-counter (loading-event starts: +1; loading-event finishes/errors: -1) and a root-component (loading-indicator) is visible whenever the count is > 0.

Upvotes: 1

Related Questions