Typescript: How to have second argument type to be dependent on first argument value

Question

I want to create generic method that gets one of the predefined strings as first parameter and some data as second parameter. and I want 'data' to be described as an interface with keys of those predefined strings

type MyKeys = 'lorem' | 'ipsum' | 'dolor';

interface DataParams extends Record<MyKeys, any | undefined> {
    lorem: { year: number };
    ipsum: { to: string };
}

myCoolGeneric('lorem', {year: 2021}); // ok
myCoolGeneric('ipsum', {year: 2021}); // typescript error

so I can specify several sets of keys and different available params for them. And typescript will check that method is called with correct params depending on which key is used as argument

How should I declare myCoolGeneric? Is it possible at all? Or maybe there are some other ways to implement such behavior?

I tried following code but it gives error that key is used as value in type

const myCoolGeneric = <P extends Record<string, any | undefined>>(key: keyof P, data P[key]) => { ... }

captain-yossarian from Ukraine · Accepted Answer · 2021-07-29T12:54:20.577

Thanks @kaya3!

UPDATED

If you have different combination of allowed arguments, you can produce function overloads.

type MyKeys = 'lorem' | 'ipsum' | 'dolor';

interface DataParams {
  lorem: { year: number };
  ipsum: { to: string };
}

// credits goes to https://stackoverflow.com/a/50375286
// function intersection produces - function overloads
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
  k: infer I
) => void
  ? I
  : never;

type Values<T> = T[keyof T]

/**
 * Generate all possible combinations of allowed arguments
 */
type AllOverloads = {
  [Prop in MyKeys]:
  Prop extends keyof DataParams
  ? (key: Prop, data: DataParams[Prop]) => any
  : (key: Prop) => any
}

/**
 * Convert all allowed combinations to function overload
 */
type Overloading = UnionToIntersection<Values<AllOverloads>>

const myCoolGeneric: Overloading = <Key extends MyKeys>(
  key: Key,
  data?: Key extends keyof DataParams ? DataParams[Key] : void
) => null as any

myCoolGeneric('lorem', { year: 2021 }); // ok
myCoolGeneric('ipsum', { to: '2021' }); // typescript error
myCoolGeneric('dolor'); // ok

Playground

In TypeScript you can use square bracket notation just like in JS:DataParams[Key]

UPDATE with generic parameters

type MyKeys = 'lorem' | 'ipsum' | 'dolor';

interface DataParams {
  lorem: { year: number };
  ipsum: { to: string };
}

// credits goes to https://stackoverflow.com/a/50375286
// function intersection producec - functin overloads
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
  k: infer I
) => void
  ? I
  : never;

type Values<T> = T[keyof T]

/**
 * Generate all possible combinations of allowed arguments
 */
type AllOverloads<Keys extends string, Mappings> = {
  [Prop in Keys]:
  Prop extends keyof Mappings
  ? (key: Prop, data: Mappings[Prop]) => any
  : (key: Prop) => any
}

/**
 * Convert all allowed combinations to function overload
 */
type Overloading<Keys extends string, Mappings> =
  UnionToIntersection<Values<AllOverloads<Keys, Mappings>>>

const myCoolGeneric: Overloading<MyKeys, DataParams> = (
  key: string,
  data?: unknown
) => null as any

myCoolGeneric('lorem', { year: 2021 }); // ok
myCoolGeneric('ipsum', { to: '2021' }); // typescript error
myCoolGeneric('dolor'); // ok

UPDATE 3

type MyKeys = 'lorem' | 'ipsum' | 'dolor';

interface DataParams {
    lorem: { year: number };
    ipsum: { to: string };
}


// credits goes to https://stackoverflow.com/a/50375286
// function intersection producec - functin overloads
type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (
    k: infer I
) => void
    ? I
    : never;
type IsNever<T> = [T] extends [UnionToIntersection<T>] ? true : false;

type Values<T> = T[keyof T]

/**
 * Generate all possible combinations of allowed arguments
 */
type AllOverloads<Mappings, Keys extends string> = {
    [Prop in Keys]:
    Prop extends keyof Mappings
    ? (key: Prop, data: Mappings[Prop]) => any
    : (key: Prop) => any
}

/**
 * Convert all allowed combinations to function overload
 */
type Overloading<Mappings, Keys extends string> =
    keyof Mappings extends Keys
    ? UnionToIntersection<Values<AllOverloads<Mappings, Keys>>>
    : never


const myCoolGeneric: Overloading<DataParams, MyKeys> = (
    key: string,
    data?: unknown
) => null as any

myCoolGeneric('lorem', { year: 2021 }); // ok
myCoolGeneric('ipsum', { to: '2021' }); // typescript error
myCoolGeneric('dolor'); // ok

Try to add to DataParams non existence key. TS will throw an error

Beware that you can still call the function like `myCoolGeneric<'lorem' | 'ipsum'>('ipsum', {year: 2021})`. — kaya3, Jul 29 '21 at 08:47
cool, thanks and what if I don't want to have any params for 'dolor' key? so I want to be able to call myCoolGeneric('dolor') without passing any params — Anton Karpov, Jul 29 '21 at 08:54
what do you want to achieve by calling `myCoolGeneric` with only one parameter? COuld you please update your question? — captain-yossarian from Ukraine, Jul 29 '21 at 08:57
The `IsUnion` check means you won't be able to call it with a pair of arguments which you know are matching, but could be matching in more than one way. If you want a function which cannot be called with union types, then function overloads are the way to go. — kaya3, Jul 29 '21 at 09:05
I want to use it to have typed routing method. So I want to specify exact parameters (or their absence) that should be passed for every single route — Anton Karpov, Jul 29 '21 at 10:10
yes, it works, thanks now I'm trying to make it generic so I can use it with different sets of keys and parameters — Anton Karpov, Jul 29 '21 at 10:41
very nice. the last change I'm looking for is how to force DataParams to have only the keys from MyKeys? if I extend it from Record, magic with myCoolGeneric('dolor') won't work — Anton Karpov, Jul 29 '21 at 12:09
DataParams should have only the keys from MyKeys but it could miss some of them. like Partial<> — Anton Karpov, Jul 29 '21 at 12:49
this always auto suggests all possible arguments and not just the ones based on first argument - I don't think that's possible though that we'd get only those auto suggested second arguments that correspond with first argument — micco, May 31 '22 at 14:11

Typescript: How to have second argument type to be dependent on first argument value

1 Answers1