Redux TS Error Actions must be plain objects. Instead, the actual type was: 'Promise'-CodePudding

I am getting this error with TS and Redux and cant figure it out why it happens and how its could be fixed. I am using redux thunk middleware. Redux TS Error Actions must be plain objects. Instead, the actual type was: 'Promise'.

Seems that issue starts to happen in updateUserSession(data)

which gets started this way:

  insertUserSession(data)
                                .then(
                                    (res: IUserSession) => {
                                        updateUserSession(data)
                                    },
                                    err => {
                                        console.error("Insert session failed", err)
                                    },
                                )
                                .then(() => {
                                    //Here will continue another async action
                                })


    export const insertUserSession = (session: IUserSession): Promise<IUserSession> => {
    return axios.post("/user/"   session?.userId   "/session", session)
}
export const updateUserSession = (data: IUserSession) => {
    return axios.put('/user/'   data.userId   '/session', data)
        .then(
            (response) => {
                 fetchUserSession(store.getState().user?.userData?.username)
                    .then(
                        (res) => {
                            if (typeof res.data === "object" && !Object.keys(res.data).length)
                                 saveUserSession(res.data)
                         
                        },
                        (err) => {
                            console.error(err);
                        },
                    )
            },
            (err) => {
                console.error(err);
            },
        )
}

export const saveUserSession = (data: IUserSession) => {
    return (dispatch: Dispatch<UserAction>) => {
        dispatch({
            type: UserType.SAVE_USER_SESSION,
            payload: data,
        });
    }

}

CodePudding user response：

This is happening because updateUserSession is actually a thunk and not an action. It seems saveUserSession is the action you need to call with callback data.

Be sure to declare the correct thunk signature:

const updateUserSession = (data: IUserSession) => (dispatch, getState) => {}

Also, don't forget to call dispatch to fire actions inside the thunk.