Как отправить два асинхронных c редукционных действия один за другим?

Question

В моем componentDidMount я отправляю двух создателей действий, т.е. thunks, которые вызываются один за другим. Результат, полученный в вызове API первой отправки, должен использоваться в качестве параметра в вызове API второй отправки. Как я могу сделать так, чтобы мой второй вызов диспетчеризации всегда получал обновленное значение результата от первого вызова API. Кроме того, я не могу назвать свою вторую отправку внутри создателя первого действия, так как они оба должны быть разделены для повторного использования. Извиняюсь, если вопрос уже задан. Я просто ищу идеальное решение для моего варианта использования.

componentDidMount() {
  const { setLeadTypesAsync ,setRadarLeadsAsync } = this.props;
  setLeadTypesAsync(); //first dispatch
  setRadarLeadsAsync();  //second dispatch
}

//First dispatch call
export const setLeadTypesAsync = () => {
 return (dispatch) => {
 dispatch(setLeadTypesStart());
 fetchLeadTypes()  //Api service
  .then(({ data: { message, types } }) => {
    if(types) {
      dispatch(setLeadTypesSuccess(types)); //Setting a state called leadTypes
    }
    else {
      dispatch(setLeadTypesError(message));
    }
 })
}};

//Second dispatch call
export const setRadarLeadsAsync = () => {
 return (dispatch, getState) => {
 dispatch(setRadarLeadsStart());
 const { leadTypes } = getState().leads
 console.log(leadTypes);    //Getting the initial value [] instead of updated value
 fetchRadarLeads(leadTypes).then(data => {   //Api service
   console.log(data)
 })
}};

Answer 1

Это как раз та ситуация, когда async/await вступает в игру .. Вот так ..

async componentDidMount() {
  const { setLeadTypesAsync ,setRadarLeadsAsync } = this.props;
  const res = await setLeadTypesAsync(); //first dispatch
  setRadarLeadsAsync(res);  //second dispatch
}