[解決] typescript error ‘type’ is declared here. (Argument of type ‘AsyncThunkAction, Redux thunk action)

[解決] typescript error 'type' is declared here. (Argument of type 'AsyncThunkAction, Redux thunk action)

when you update package for react-redux v7 to v8, this error occure sometime.
even if this type pass compile ever, but now is error. so you want to fix it.
i will share it i found solve.

Argument of type 'AsyncThunkAction<void, boolean, AsyncThunkConfig<unknown>>' is not assignable to parameter of type 'AnyAction'.
  Property 'type' is missing in type 'AsyncThunkAction<void, boolean, AsyncThunkConfig<unknown>>' but required in type 'AnyAction'.ts(2345)
index.d.ts(19, 3): 'type' is declared here.

you will have to recreate dispatch type as called useAppDispatch.

because react-redux provided useDispatch is not know where dispatch using thunk action.

check your type dispatch, and then re typed it.

const dispatch = ReactRedux.useDispatch() // this dispatch standard
    React.useEffect(() => {
        dispatch(HogeOperation.change(some)) // type error is here.
// 'type' is declared here. why!!!!
    }, [some])

solved code

package.json

// 
   - "react-redux": "7.2.6",
   + "react-redux": "8.0.1",

component

use useAppDispatch in component

    const dispatch = ReactRedux.useDispatch()
    const dispatch = useAppDispatch()

store

// store
import { configureStore } from '@reduxjs/toolkit'
import * as ReduxToolkit from '@reduxjs/toolkit'
import * as Uuid from 'uuid'
import * as ApiClient from '@ui/network/APIClient'
import * as ApolloClient from '@ui/modules/apolloClient'
import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux'
import * as Redux from 'redux'
import thunk, { ThunkDispatch } from 'redux-thunk'
import * as Ui from './store/ui'
import * as Domains from './store/domains'
import * as Entities from './store/entities'

export type ExtraArgument = {
    api: ApiClient.IAPIClient
    generateId: () => string
}

const extraArgument: ExtraArgument = {
    api: new ApiClient.APIClient(ApolloClient.client),
    generateId: Uuid.v4
}

export type RootState = {
    a-state: a.State
    b-state: b.State
    c-state: c.State
}

export const store = configureStore({
    reducer: Redux.combineReducers<RootState>({
        [a-state]: a.reducer,
        [b-state]: b.reducer,
        [c-state]: c.reducer
    }),
    middleware: getDefaultMiddleware =>
        getDefaultMiddleware({
            immutableCheck: false,
            serializableCheck: false,
            thunk: { extraArgument }
        }).concat(thunk),
    devTools: process.env.NODE_ENV !== 'production'
})

export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector
type AppAction = ReturnType<typeof store.dispatch>
export type AppDispatch = ThunkDispatch<RootState, any, AppAction>
export const useAppDispatch = () => useDispatch<AppDispatch>()

export type AsyncThunkConfig<RejectValue = unknown> = {
    state: RootState
    dispatch: ReduxToolkit.Dispatch
    extra: ExtraArgument
    rejectValue: RejectValue
}