I am making a call to an api using Axios and Thunk middleware with redux to get a list of transactions. Any errors that the API returns will have an error object returned as well. That error object is in the format
{
"error": {
"id": "string",
"name": "string",
"detail": "string"
}
}
If I receive a 400 it's some generic error, but a 404 means no transactions were found. What I'd like to know is where should the logic live to parse the response? Should I parse the response in the action creator, and send separate actions, looking something like this:
catch (e) {
if (e.response) {
if (e.response.status === 400) {
//failed for some reason
dispatch({type: TRANSACTION_REQUEST_ERROR, data: e.response.data})
}
if(e.response.status === 404) {
//no transactions, no problem.
dispatch({type: NO_TRANSACTIONS_FOUND, data: e.response.data})
}
}
}
or, should I use the same action and include any response information that the reducer needs to make a decision on how to update the state, delegating that logic to the reducer?
catch (e) {
if (e.response) {
dispatch({type: TRANSACTION_REQUEST_ERROR, data: e.response.data})
}
}
//reducer
switch(action.type) {
case TRANSACTION_REQUEST_ERROR:
if(action.data.error.id === 'some id)
//update some state
else
//do something else
}
Or, is it six of one, half dozen of the other?