Enforce function signature within an object

Question

I am looking for a way to define an object with two functions where one function always gets the return type of the other function as a parameter. E.g.

type DoActionArgType = { contactId: string };

type Args<T> = 
{
  doAction: (arg: DoActionArgType) => string; // <-- returns string
  onEnd?: (arg: string) => void; // <-- takes string as the argument
}

Now I want this to work for arbitrary return types and promises, which works fine, except if I do not add the type to the function doAction function argument.

export type $Unwrap<T> = T extends Promise<infer U>
    ? U
    : T extends (...args: any) => Promise<infer U>
    ? U
    : T extends (...args: any) => infer U
    ? U
    : T;

type DoActionArgType = { contactId: string };

type Args<T> = 
{
  doAction: (arg: DoActionArgType) => Promise<T>;
  onEnd?: (arg: $Unwrap<T>) => void;
}

function test<T>(arg: Args<T>) {}

const doAction = async ({ contactId }) => 1

test({
  // doAction: async ({ contactId }: DoActionArgType) => 1, // Works
  // doAction: async () => 1, // Works
  // doAction, // Works
  doAction: async ({ contactId }) => 1, // <--- Does not work
  onEnd: (arg) => {
    const a:number = arg
  }
})

I assume that typescript does not understand that the function signature matches ? Because contactId is actually typed string just arg of onEnd is typed as unknown. Is there any way to make this work without adding the DoActionArgType type to the doAction function ?

Typescript Playground

What do you need the `$Unwrap` type for, why not just use `onEnd?: (arg: T) => void` — MrCodingB, Sep 11 '21 at 16:47

captain-yossarian from Ukraine · Accepted Answer · 2021-09-11T17:24:12.520

2

You need to do a hat trick:

type DoActionArgType = { contactId: string };

type PromiseUnwrap<P> =
  P extends Promise<infer Value>
  ? Value
  : P

const test = <T,>(arg: {
  doAction: (a_arg: DoActionArgType) => T;
  onEnd: <U extends T>(b_arg: PromiseUnwrap<U>) => void;
}) => {
  // ...
};

test({
  doAction: async ({ contactId }) => 1,
  onEnd: (arg) => {
    arg // number
    arg.toExponential // ok
  }
})

Playground

PromiseUnwrap - obtains Promise return type.

You might ask, why this function does not work:

const test = <T,>(
  arg: {
    doAction: (a_arg: number) => T;
    onEnd: (b_arg: T) => void
  }) => {
  // ...
};

Here you can find a good answer.

If you want to learn more about callbacks in typescript, you can read my article. First example will be yours

edited Sep 11 '21 at 17:24

answered Sep 11 '21 at 17:09

captain-yossarian from Ukraine

31,174
3
30
62

I think you should keep the OPs original $Unwrap type in this case, because now you assume that T has to be a Promise, but it's not specified – MrCodingB Sep 11 '21 at 17:13
Feel free to use your version of $Unwrap. In this case it works in a same way – captain-yossarian from Ukraine Sep 11 '21 at 17:18
1

@MrCodingB changed – captain-yossarian from Ukraine Sep 11 '21 at 17:24
Why do you use `` instead of `` ? Does this make any difference ? – Philiiiiiipp Sep 11 '21 at 17:26
2

@Philiiiiiipp is is all about JSX parsing. For instance, it works without comma in IDE but when you want to use `` in playground - it gives an error because TS expects `jsx`. Because I'm always using TS playground I have to put a comma everywhere – captain-yossarian from Ukraine Sep 11 '21 at 17:27

Enforce function signature within an object

1 Answers1