diff --git a/src/types/middleware.ts b/src/types/middleware.ts index a8d7130c35..24c2e5af5b 100644 --- a/src/types/middleware.ts +++ b/src/types/middleware.ts @@ -20,11 +20,11 @@ export interface MiddlewareAPI { * installed. */ export interface Middleware< - _DispatchExt = {}, // TODO: remove unused component (breaking change) + _DispatchExt = {}, // TODO: see if this can be used in type definition somehow (can't be removed, as is used to get final dispatch type) S = any, D extends Dispatch = Dispatch > { (api: MiddlewareAPI): ( - next: D - ) => (action: D extends Dispatch ? A : never) => any + next: (action: unknown) => unknown + ) => (action: unknown) => unknown } diff --git a/test/applyMiddleware.spec.ts b/test/applyMiddleware.spec.ts index b5437c97ba..45be9c4fa7 100644 --- a/test/applyMiddleware.spec.ts +++ b/test/applyMiddleware.spec.ts @@ -28,10 +28,10 @@ describe('applyMiddleware', () => { }) it('wraps dispatch method with middleware once', () => { - function test(spyOnMethods: any) { - return (methods: any) => { + function test(spyOnMethods: any): Middleware { + return methods => { spyOnMethods(methods) - return (next: Dispatch) => (action: Action) => next(action) + return next => action => next(action) } } @@ -53,8 +53,8 @@ describe('applyMiddleware', () => { }) it('passes recursive dispatches through the middleware chain', () => { - function test(spyOnMethods: any) { - return () => (next: Dispatch) => (action: Action) => { + function test(spyOnMethods: any): Middleware { + return () => next => action => { spyOnMethods(action) return next(action) } @@ -146,8 +146,7 @@ describe('applyMiddleware', () => { } function dummyMiddleware({ dispatch }: MiddlewareAPI) { - return (_next: Dispatch) => (action: Action) => - dispatch(action, testCallArgs) + return (_next: unknown) => (action: any) => dispatch(action, testCallArgs) } const store = createStore( diff --git a/test/helpers/middleware.ts b/test/helpers/middleware.ts index a89cc41eab..8bb2e55dc4 100644 --- a/test/helpers/middleware.ts +++ b/test/helpers/middleware.ts @@ -1,13 +1,9 @@ -import { MiddlewareAPI, Dispatch, AnyAction } from 'redux' +import { Dispatch, Middleware } from 'redux' -type ThunkAction = T extends AnyAction - ? AnyAction - : T extends Function - ? T - : never - -export function thunk({ dispatch, getState }: MiddlewareAPI) { - return (next: Dispatch) => - <_>(action: ThunkAction) => - typeof action === 'function' ? action(dispatch, getState) : next(action) -} +export const thunk: Middleware<{ + (thunk: (dispatch: Dispatch, getState: () => any) => R): R +}> = + ({ dispatch, getState }) => + next => + action => + typeof action === 'function' ? action(dispatch, getState) : next(action) diff --git a/test/typescript/middleware.ts b/test/typescript/middleware.ts index 1cb59ef722..fa9985261f 100644 --- a/test/typescript/middleware.ts +++ b/test/typescript/middleware.ts @@ -15,8 +15,8 @@ import { */ function logger() { const loggerMiddleware: Middleware = - ({ getState }: MiddlewareAPI) => - (next: Dispatch) => + ({ getState }) => + next => action => { console.log('will dispatch', action) @@ -41,9 +41,9 @@ type PromiseDispatch = (promise: Promise) => Promise function promise() { const promiseMiddleware: Middleware = - ({ dispatch }: MiddlewareAPI) => + ({ dispatch }) => next => - (action: AnyAction | Promise) => { + action => { if (action instanceof Promise) { action.then(dispatch) return action @@ -72,13 +72,10 @@ function thunk() { ThunkDispatch, S, Dispatch & ThunkDispatch - > = - api => - (next: Dispatch) => - (action: AnyAction | Thunk) => - typeof action === 'function' - ? action(api.dispatch, api.getState) - : next(action) + > = api => next => action => + typeof action === 'function' + ? action(api.dispatch, api.getState) + : next(action) return thunkMiddleware } @@ -89,14 +86,13 @@ function thunk() { function customState() { type State = { field: 'string' } - const customMiddleware: Middleware<{}, State> = - api => (next: Dispatch) => action => { - api.getState().field - // @ts-expect-error - api.getState().wrongField + const customMiddleware: Middleware<{}, State> = api => next => action => { + api.getState().field + // @ts-expect-error + api.getState().wrongField - return next(action) - } + return next(action) + } return customMiddleware }