Switch to Variadic Tuple Types for reducers and selectors #2715

Activity

1. alex-okrushko

   self-assigned this

   on Sep 15, 2020
2. alex-okrushko

   added

   Project: Component Store

   Project: Effects

   Project: Store

   on Sep 15, 2020
3. david-shortman commented on Oct 27, 2020

   

   david-shortman

   on Oct 27, 2020

   Contributor

   More actions

   I'm interested in helping add the types. Would want to know how I should go about this since the repo doesn't currently use 4.0+ yet.
4. markostanimirovic commented on Dec 4, 2020

   

   markostanimirovic

   on Dec 4, 2020

   Member

   More actions

   Issue with switching createSelector to variadic tuples: microsoft/TypeScript#41709
5. david-shortman commented on Jan 30, 2021

   

   david-shortman

   on Jan 30, 2021

   Last edited by david-shortman

   Contributor

   More actions

   Here's at first shot at defining them.

   export function createSelector<State, S extends any[], Result>(
     selectors: [...{ [i in keyof S]: Selector<State, S[i]> }],
     projector: (...args: [...S]) => Result
   ): MemoizedSelector<State, Result>;
   export function createSelector< State, S extends any[], Result>(
     ...args: [
       ...{ [i in keyof S]: Selector<State, S[i]> },
       (...args: [...S]) => Result
     ]
   ): MemoizedSelector<State, Result>;
   export function createSelector<State, Props, S extends any[], Result>(
     selectors: [...{ [i in keyof S]: SelectorWithProps<State, Props, S[i]> }],
     projector: (...args: [...S]) => Result
   ): MemoizedSelectorWithProps<State, Props, Result>;
   export function createSelector<State, Props, S extends any[], Result>(
     ...args: [
       ...{ [i in keyof S]: SelectorWithProps<State, Props, S[i]> },
       (...args: [...S, Props]) => Result
     ]
   ): MemoizedSelectorWithProps<State, Props, Result>;

   But I'm hitting a problem where Typescript is not able to infer State properly, resulting in this error:

   (in `router-store/src/router_selectors.ts)

   Argument of type '(state: V) => RouterReducerState<any>' is not assignable to parameter of type 'Selector<unknown, RouterReducerState<any>>'. 
     Types of parameters 'state' and 'state' are incompatible.
       Type 'unknown' is not assignable to type 'V'.
         'V' could be instantiated with an arbitrary type which could be unrelated to 'unknown'.
   

   As you can see, the type of createSelector has unknown as the type for state. Not sure why.
   
6. david-shortman commented on Jan 31, 2021

   

   david-shortman

   on Jan 31, 2021

   Last edited by david-shortman

   Contributor

   More actions

   So the problem I was having in #2905 is that typescript doesn't seem to interpret variadic tuple type with strict order. It just creates a basic union type for all elements in the array.
   This is problematic for createReducer as we want to have a function signature for a function that takes in a variadic number of selectors, followed by a single function whose parameters are all the return types of the reducers.

   Instead, Typescript came up with a definition like this for the following:

   /* derived:
   export function createSelector<Selector<any, any>[], any>(
      ...args: Selector<any, any> | ((...args: any[]) => any)[]):
       MemoizedSelector<any, any, DefaultProjectorFn<any>>
   */
   const selector = createSelector(
           incrementOne,
           incrementTwo,
           (state: any, props: any) => props.value,
           projectFn
         );

   A very simple example of my expectations vs reality:

   playground

   type NumberArray = number[];
   type StringArray = string[];
   // I'd like a type that is a tuple of a variadic number of numbers followed by a variadic number of string
   type Combined = [...numbers: NumberArray, ...strings: StringArray];
   
   function thing(...args: Combined) {
     return 3;
   }
   
   thing('5', 5); // this should result in an error, right?
7. david-shortman commented on Jan 31, 2021

   

   david-shortman

   on Jan 31, 2021

   Contributor

   More actions

   ...And now I see a comment from Alex in #2894 mentioning microsoft/TypeScript#41544 and that might be the fix needed to get the kind of type desired for createReducer
8. david-shortman commented on Jul 2, 2021

   

   david-shortman

   on Jul 2, 2021

   Contributor

   More actions

   Can we make a checklist of what still needs to be converted? Happy to help get items done.
9. brandonroberts

   closed this as completedin 367d9b4on Nov 11, 2021
10. MikeRyanDev

    added a commit that references this issue on Jul 1, 2024

    feat(store): use variadic tuple types for createSelector (ngrx#3023)

    ...

    This issue will close once commit 367d9b4 is merged into the 'master' branch.

    367d9b4