Calling Async action creators without using thunk or saga

action.tsx

// Wrapped up into a funciton in case you need to re-use it other places

export function getAllPosts( dispatch: Dispatch<getPostsAction> ): () => void {
  return () => {
    console.log("runnning");
    // try {
    //     console.log("lol");
    //     const response = await axios.get("/posts");
    //     switch (response.status) {
    //         case 200:
    //             console.log(response.data);
    //             dispatch({
    //                 type: "GET_POSTS",
    //                 payload: [],
    //             });
    //     }
    // } catch (err) {
    //     console.log(err);
    // }
    dispatch({ type: "GET_POSTS", payload: [] });
  };
}

function mapAppDispatchToProps( dispatch: Dispatch<getPostsAction> ):  Pick<AppProps, 'getPosts'> {
  return{getPosts: getAllPosts( dispatch )}
}

const ConnectedApp = connect( mapStateToProps, mapAppDispatchToProps )( App );

App.tsx

// Calling a async action without using thunk or saga in the component itself

function mapDispatchToProps(dispatch: Dispatch<MyAction>): Pick<Props,'getPosts'> {
  return: {
    getPosts: async () => {return dispatch( getAction( await fetch('/stuff') ) );},
  };
}