React/Redux update state array if action id is not already present - reactjs

Question

I have a set of actions to update Redux state. I'm struggling filtering the end results. Here are my actions
GET_ITEMS (GET request, returns a list)
SET_ITEM (POST request, payload: 'id')
DELETE_ITEM (DELETE request, payload: 'id')
Here are my examples:
case 'GET_ITEMS':
return {
...state,
list: action.payload, // [{ id: 'one', count: 1 }, { id: 'two', count: 2}]
};
case 'SET_ITEM':
return {
...state,
list: [...state.list, { id: action.payload, count: state.list.length }],
};
case 'DELETE_ITEM':
return {
...state,
list: state.list.filter(item => item.id !== action.payload),
};
Only the GET_ITEMS action type returns a response data, the rest I have to manually update them. Bellow are my questions in the same order
How to update the state list array, compared to response data list array?
How to add an object item based on a id action payload?
Delete seems to be working fine

Answer 1

You can use a helper function for your SET_ITEM action:
case 'SET_ITEM':
return {
...state,
list: updateList(state.list, action)
};
function updateList(list, action) {
const found = list.find((element) => element.id === action.payload);
if (found) {
// ...update found props
return list;
}
return [...list, { id: action.payload, count: list.length + 1 }];
}
I would definitely move the count property outside of the element because the way it's modeled we'll have unnecessary count property for every element and if we remove an element in the middle of the array, the count property will be wrong for every element on the right side. So a better state would be:
{
...state,
list,
listCount
}