UseReducer.tsx

enum Actions {
  PAINT,
  UNDO,
}

const reducer = (state: WishState, action: any) => {
  switch (action.type) {
    case Actions.PAINT:
      return forward(state);
    case Actions.UNDO:
      return backward(state);
    default:
      throw new Error();
  }
};

const App = () => {
  const [state, dispatch] = React.useReducer(reducer, WishState.PENDING);
  
  return (
    <>
      <Daruma
        state={state}
      />
      <Buttons
        dispatch={dispatch}
      />
    </>
  );
}