TypeScript Generic type for generated function

Issue

How do I declare generic type for a function created dynamically?

type FooType = {
  username: string;
}

type BarType = {
  age: number;
}

interface DataStore {
  foo: FooType;
  bar: BarType;
}

const getDataStore = () => ({
  foo: { username: 'Tera' },
  bar: { age: 24 },
})

const generateFunction = <T, S extends keyof DataStore>(slice: S) => {
  type DataSlice = DataStore[S];

  return (selector: (store: DataSlice) => T) => selector(getDataStore()?.[slice]);
}

How do I use T in useFoo and pass generateFunction?

const useFoo = generateFunction('foo');

Expected usage of useFoo

type UserName = string;

const userName = useFoo<UserName>((foo: FooType) => foo.userName);

Solution

You're looking for generic anonymous functions (see this SO answer).

const generateFunction = <S extends keyof DataStore>(slice: S) => {
  type DataSlice = DataStore[S];

  return <T,>(selector: (store: DataSlice) => T) => selector(getDataStore()?.[slice]);
}

Note that the T generic is now associated with the returned function, instead of generateFunction itself. As written in your question, generateFunction is a generic function that takes two generic parameters T and S that are known when calling the function. Instead, you want generateFunction to take a single generic parameter S that's known when calling, and have it return a function with a single generic parameter T that's only known when the returned function is called.

Answered By - superhawk610