Redux actions should be regular objects. Use custom middleware for asynchronous action

Question

I get the error message "Redux actions must be regular objects. Use special middleware for asynchronous action." with the code below.

export const getFriends = () => async(): Action => {

  const requestConfig = {
    httpMethod: 'GET',
    version: 'v2.7',
  };
  let hasMore = false;
  let friends = [];

  do {
    const infoRequest = new GraphRequest(
    '/me/friends',
    requestConfig,
    (error, result) => {
      if (error) {
        alert('Error fetching data facebook friends');
      } else {
        result.data.forEach((value) => {
            friends.push(value)
        });
        if (result.paging && result.paging.next) {
          hasMore = true;
          requestConfig.parameters.after = result.paging.cursors.after;
        } else {
          hasMore = false;
        }
      }
    });
    await new GraphRequestManager().addRequest(infoRequest).start();
  } while (hasMore);
  return {
    type: 'GET_FRIENDS',
    payload: friends    // this is empty because there is no await on GraphAPI
  };
};

If I delete the asynchronous call and wait, the returned friend is empty because the function call is returned before the GraphAPI call

export const getFriends = () => (): Action => {

  const requestConfig = {
    httpMethod: 'GET',
    version: 'v2.7',
  };
  let hasMore = false;
  let friends = [];

  do {
    const infoRequest = new GraphRequest(
    '/me/friends',
    requestConfig,
    (error, result) => {
      if (error) {
        alert('Error fetching data facebook friends');
      } else {
        result.data.forEach((value) => {
            friends.push(value)
        });
        if (result.paging && result.paging.next) {
          hasMore = true;
          requestConfig.parameters.after = result.paging.cursors.after;
        } else {
          hasMore = false;
        }
      }
    });
    new GraphRequestManager().addRequest(infoRequest).start();
  } while (hasMore);
  return {
    type: 'GET_FRIENDS',
    payload: friends    // this is empty because there is no await on GraphAPI
  };
};

Answer 1

, . Redux . , . redux-thunk, , . redux-thunk, .

, , . Redux ?

edit: ... ... - ( , ):

    export const getFriends = () => {
      return (dispatch) => {
        const requestConfig = {
          httpMethod: 'GET',
          version: 'v2.7',
        };
        let hasMore = false;
        let friends = [];

        do {
          const infoRequest = new GraphRequest(
            '/me/friends',
            requestConfig,
            (error, result) => {
              if (error) {
                alert('Error fetching data facebook friends');
              } else {
                result.data.forEach((value) => {
                    friends.push(value)
                });
                if (result.paging && result.paging.next) {
                  hasMore = true;
                  requestConfig.parameters.after = result.paging.cursors.after;
                } else {
                  hasMore = false;
                  return dispatch({
                    type: 'GET_FRIENDS',
                    payload: friends               
                  });
                }
              }
          });
          await new GraphRequestManager().addRequest(infoRequest).start();
        } while (hasMore);
      }
    };