Generic recursive function in typescript

Question

I want to write generic recursive function like below

function withChildren<
  T extends {
    id?: string;
    parentId?: string;
  },
  TWithChild extends T & {
    children: TWithChild[];
  }
>(parentItem: T, items: T[]): TWithChild {
  const children = items.filter((ba) => ba.parentId === parentItem.id);

  return {
    ...parentItem,
    children: children.map((child) => withChildren(child, items)),
  };
}

but typescript throw an error

Type 'T & { children: (T extends BusinessAreaWithAccess ? BusinessAreaWithChildrenAndAccess : BusinessAreaWithChildren)[]; }' is not assignable to type 'T extends BusinessAreaWithAccess ? BusinessAreaWithChildrenAndAccess : BusinessAreaWithChildren'

i have search for the error, but still not found any solution

Please paste error-messages into the question, rather than screenshotting them. — ruakh
– ruakh, Commented Nov 25, 2022 at 8:53

Dimava · Accepted Answer · 2022-11-25 10:05:33Z

1

TWithChild extends T & ..., meaning if used as explicit type parameter it can union e.g. {a: 1}, you don't know its exact type, so you can't instantiate it.
Define it as a known limited generic type, then it'll work

type TWithChild<T> = T & {children: TWithChild<T>[]}

function withChildren<
  T extends {
    id?: string;
    parentId?: string;
  }
>(parentItem: T, items: T[]): TWithChild<T> {
  const children = items.filter((ba) => ba.parentId === parentItem.id);

  return {
    ...parentItem,
    children: children.map((child) => withChildren(child, items)),
  };
}

Playground

answered Nov 25, 2022 at 10:05

Dimava

11.1k1 gold badge13 silver badges31 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Generic recursive function in typescript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related