Vollständige Auswertung diskriminierter Unions in React useReducer

import { useReducer } from 'react';
 
const initialState = { status: 'idle', count: 0, error: null };
 
function counterStateReducer(state, action) {
  switch (action.type) {
    case 'INCREMENT':
      return { ...state, count: state.count + action.payload.step };
    case 'RESET':
      return initialState;
    case 'FAIL':
      return { ...state, status: 'error', error: action.payload.message };
    default: {
      const exhaustiveCheck = action.type;
      throw new Error(`Unhandled action type encountered: ${exhaustiveCheck}`);
    }
  }
}
 
export function StepperControl() {
  const [state, dispatch] = useReducer(counterStateReducer, initialState);
 
  return (
    <div>
      <span>Count: {state.count}</span>
      <button onClick={() => dispatch({ type: 'INCREMENT', payload: { step: 5 } })}>+5</button>
      <button onClick={() => dispatch({ type: 'RESET' })}>Reset</button>
    </div>
  );
}