Dynamic Type checking based on function argument

Question

what am i trying to do is, i have a function and I'm passing a bunch of boolean flags to it, each of these flags requires different arguments to be passed to same function.

So here is a simple version:

enum FLAGS {
  A = 'a',
  B = 'b',
  C = 'c'
}

interface ARelatedArgs {
  aBool: boolean
  aString: string
}

interface BRelatedArgs {
  (bEvt: any): void
  bBool: boolean
}

interface CRelatedArgs {
  (cEvt: any): string
  cString: string
}


interface MyFunctionArgs {
  flags: Partial<Record<FLAGS, boolean>>
  // other props based on flag(s) // i can supply one or more flags here!
}

function myFunction(args: MyFunctionArgs) {
  // do something 
}

now i want to have type inference based on these call types:

// 1st Call to my function
myFunction({
  flags: { [FLAGS.A]: true }
  // all ARelatedArgs
})


// 2nd Call to my function
myFunction({
  flags: { [FLAGS.A]: true, [FLAGS.B]: true }
  // all ARelatedArgs
  // + all BRelatedArgs
})

// last Call to my function
myFunction({
  flags: { [FLAGS.A]: true, [FLAGS.B]: true, [FLAGS.C]: true }
  // all ARelatedArgs
  // + all BRelatedArgs
  // + all CRelatedArgs 
})

basically what i want is to check argument types/infer them based on flags that is been passed to it. The interesting thing is that, I dont want to make checks only based on one flag, I could have passed all my 3 flags (A, B, C) and IntelliSense may help me with that? is it possible to have this behavior in typescript?

I know I'm demanding runtime checking from typescript but any idea how can i implement such a thing?

basically i want MyFunctionArgs to be something like this:

interface MyFunctionArgs {
  flags: Partial<Record<FLAGS, boolean>>
  ...(FLAGS.A in flags && ARelatedArgs),
  ...(FLAGS.B in flags && BRelatedArgs),
  ...(FLAGS.C in flags && CRelatedArgs),
}

Thanks in advance

Answer 1

We will need a some key-value map that would link the flags enum with the respective types:

// type TypeMap = {
//     a: ARelatedArgs;
//     b: BRelatedArgs;
//     c: CRelatedArgs;
// }
type TypeMap = Prettify<
  {
    [K in FLAGS.A]: ARelatedArgs;
  } & { [K in FLAGS.B]: BRelatedArgs } & { [K in FLAGS.C]: CRelatedArgs }
>;

Prettify is a utility type that makes the end types more readable, by removing & and some other things.

Next, we will create a utility that by using mapped types will map through the passed flags and by using key remapping it will only keep arguments that we need:

type FlagsArgs<T extends MyFunctionArgs['flags']> = {
  [K in keyof T & keyof TypeMap as T[K] extends true ? K : never]: TypeMap[K];
};

// type Result = {
//     a: ARelatedArgs;
//     b: BRelatedArgs;
// }
type Result = FlagsArgs<{ [FLAGS.A]: true; [FLAGS.B]: true }>;

To turn into the desired shape we will need the following types: ValueOf - returns all values of an object under every key as a union:

type ValueOf<T> = T[keyof T];

Testing:

type FlagsArgs<T extends MyFunctionArgs['flags']> = ValueOf<{
  [K in keyof T & keyof TypeMap as T[K] extends true ? K : never]: TypeMap[K];
}>;

// type Result = ARelatedArgs | BRelatedArgs
type Result = FlagsArgs<{ [FLAGS.A]: true; [FLAGS.B]: true }>;

Now, we need to turn the union into an intersection, by using UnionToIntersection described in here:

type FlagsArgs<T extends MyFunctionArgs['flags']> = UnionToIntersection<
  ValueOf<{
    [K in keyof T & keyof TypeMap as T[K] extends true ? K : never]: TypeMap[K];
  }>
>;

// type Result = ARelatedArgs & BRelatedArgs
type Result = FlagsArgs<{ [FLAGS.A]: true; [FLAGS.B]: true }>;

We can also wrap the FlagsArgs with Prettify to make the result type more literal:

type FlagsArgs<T extends MyFunctionArgs['flags']> = Prettify<
  UnionToIntersection<
    ValueOf<{
      [K in keyof T & keyof TypeMap as T[K] extends true
        ? K
        : never]: TypeMap[K];
    }>
  >
>;

// type Result = {
//     aBool: boolean;
//     aString: string;
//     bBool: boolean;
// }
type Result = FlagsArgs<{ [FLAGS.A]: true; [FLAGS.B]: true }>;

Looks great!

Usage:

function myFunction<T extends MyFunctionArgs>(args: T & FlagsArgs<T['flags']>) {
  // do something
}

Final testing:

// 1st Call to my function
myFunction({
  flags: { [FLAGS.A]: true },
  aBool: true,
  aString: 'str',
});

// 2nd Call to my function
myFunction({
  flags: { [FLAGS.A]: true, [FLAGS.B]: true },
  aBool: true,
  aString: '',
  bBool: false,
});

// last Call to my function
myFunction({
  flags: { [FLAGS.A]: true, [FLAGS.B]: true, [FLAGS.C]: true },
  aBool: true,
  aString: '',
  bBool: false,
  cString: '',
});

playground