In a useReducer, your reducer returns the exact same state object reference for an action it considers a no-op (`return state;`). The component is otherwise a normal function component. What happens after dispatching that action?
function reducer(state, action) {
if (action.type === 'noop') return state;
return { ...state, n: state.n + 1 };
}