In my app I have multiple useEffect hooks and a redux global state. Now depending on the change of the redux state the useEffect hook should run when the variable changes, which it does. My dispatch and useEffect hooks look like this:
const dispatch = useDispatch();const fetchOrder = useCallback((uuid: string) => dispatch(thunkFetchOrder(uuid)), [dispatch]);const fetchDebtor = useCallback((uuid: string | undefined) => dispatch(thunkFetchDebtor(uuid)), [dispatch]);const fetchOrderPayments = useCallback((uuid: string) => dispatch(thunkFetchOrderPayments(uuid)), [dispatch]);const orderInState: any = useSelector((state: RootState) => state.order);const debtorInState: any = useSelector((state: RootState) => state.debtor);useEffect(() => { fetchOrder(props.route.params.orderUuid); }, []);useEffect(() => { setOrder(orderInState); }, [orderInState.order.uuid]);useEffect(() => { setDebtor(debtorInState.debtor); console.log('update') }, [debtorInState.debtor.id]);useEffect(() => { setOrderPayments(orderInState.payments); }, [orderInState.payments]);
For example the useEffect hook with setOrder(orderInState) should only run when orderInState.order.uuid changes. However, it runs multiple times. The reducer for the order API call looks like this:
const initialState: OrderState = { order: { uuid: '' }, payments: []}export function orderReducer( state = initialState, action: OrderActionTypes): OrderState{ switch(action.type) { case FETCH_ORDER_REQUEST: if (state.order.uuid!== action.uuid) { return { ...state, order: {} } } else { return { ...state } } case FETCH_ORDER: return { ...state, order: action.payload } case FETCH_ORDER_PAYMENTS: return { ...state, payments: action.payload } default: return state; }}
My redux global state looks like this:
export const rootReducer = combineReducers({ auth: authReducer, error: errorReducer, debtor: debtorReducer, debtors: debtorsReducer, order: orderReducer, orders: ordersReducer, payments: paymentsReducer, roles: rolesReducer, users: usersReducer, credentials: credentialsReducer})
What am I doing wrong here?