TypeScript Variadic Tuple Types: Composing Function Signatures and Middleware Pipelines - snippet-7.ts

snippet-7.ts

type Store<S> = {
  getState: () => S;
  dispatch: (action: any) => any;
};

type ReduxMiddleware<S, A> = (
  store: Store<S>
) => (next: (action: A) => any) => (action: A) => any;

type ChainMiddleware<
  State,
  Middlewares extends ReduxMiddleware<any, any>[]
> = Middlewares extends [
  ReduxMiddleware<infer S, infer A>,
  ...infer Rest
]
  ? Rest extends ReduxMiddleware<any, any>[]
    ? ChainMiddleware<S, Rest>
    : S
  : State;

function applyMiddleware<S, Middlewares extends ReduxMiddleware<S, any>[]>(
  ...middlewares: Middlewares
) {
  return (store: Store<S>) => {
    const chain = middlewares.map((middleware) => middleware(store));
    return chain.reduce((composed, middleware) => middleware(composed));
  };
}