Property 'payload' does not exist on type 'ActionsAll' （union Type of all actions） when React with Typescript

I think 'ActionsAll' has contained the payload. feel confused about this. Is someone can help me. Thanks.

actions.tsx and reducer.tsx are as followings.

// action.tsx
import * as types from './constants';

export interface FetchValueBegin {
  type: string;
}

export interface FetchValueSuccess {
  type: string;
  payload: {
    valueType: string;
    value: number;
  }
}

export interface FetchValueError {
  type: string;
}

export type ActionsAll = FetchValueBegin
| FetchValueSuccess
| FetchValueError;

export const fetchValueBegin = () => ({
  type: types.FETCH_VALUE_BEGIN,
});

export const fetchValueSuccess = (valueType: string, value: number) => ({
  type: types.FETCH_VALUE_SUCCESS,
  payload: { valueType, value },
});

export const fetchValueError = () => ({
  type: types.FETCH_VALUE_ERROR,
});

// reducer.tsx
import { StoreState } from '../types';
import { ActionsAll } from './actions';
import { FETCH_VALUE_BEGIN, FETCH_VALUE_SUCCESS, FETCH_VALUE_ERROR } from './actions/constants';

const initState: StoreState = {
  languageName: 'TypeScript',
  enthusiasmLevel: 1,
  isError: null,
  errorToShow: '',
};

export function reducer(state = initState, action: ActionsAll): StoreState {
  switch (action.type) {
    case FETCH_VALUE_BEGIN:
      return {
        ...state,
        isError: null,
        errorToShow: '',
      };
    case FETCH_VALUE_SUCCESS:
      return {
        ...state,
        enthusiasmLevel: action.payload.valueType === 'add'
          ? state.enthusiasmLevel + action.payload.value
          : state.enthusiasmLevel - action.payload.value,
      };
    case FETCH_VALUE_ERROR:
      return {
        ...state,
        isError: true,
      };
    default:
      return state;
  }
}

I'm a Redux maintainer.

The first answer here is that you should be using Redux Toolkit. We specifically recommend against trying to write reducers and actions by hand today. We do have a "Redux Fundamentals" tutorial in our docs that shows how to hand-write Redux code, but only so that you understand the basic mechanics. For any actual app, you should be using RTK.

The second observation is that you should not be writing TS action type unions - they don't provide any real benefit, and don't actually represent how the code runs.

Please follow the approach shown in our Redux TS Quick Start docs page instead.