In my slice, I have defined the action to be as follows:
https://github.com/jasonabanico/RedGranite/blob/main/src/Client/RedGranite.Client.Web/src/app/containers/ItemPage/itemPageSlice.ts

export const addItem = createAsyncThunk(
    'itemPage/addItem',
    async (itemInput: ItemInput) => {
        return await itemService
            .addItem(itemInput)
            .catch((err: any) => {
                console.log("Error:", err);
            });
    },
)

I have also defined useAppDispatch as:
https://github.com/jasonabanico/RedGranite/blob/main/src/Client/RedGranite.Client.Web/src/app/hooks.ts

export const useAppDispatch = () => useDispatch<AppDispatch>();

I use both of the above like so:
https://github.com/jasonabanico/RedGranite/blob/main/src/Client/RedGranite.Client.Web/src/app/containers/ItemPage/addItemPage.tsx

const dispatch = useAppDispatch();
...
dispatch(addItem(itemInput));

I am getting the following error:

TS2345: Argument of type ‘AsyncThunkAction<void | AddItem, ItemInput, AsyncThunkConfig>’ is not assignable to parameter of type ‘AnyAction’.
21 | longDescription
22 | };

23 | dispatch(addItem(itemInput));
| ^^^^^^^^^^^^^^^^^^
24 | };

What is wrong with my definitions? Why can’t I use addItem in dispatch?