T
TanStack•7mo ago
like-gold

How to retrieve type of serverFn's returned data?

I've defined a serverFn like so: 
const fetchDataFn = createServerFn({ method: "GET" }).handler(
  async () => { return fetchDataFromDB() }
);
const fetchDataFn = createServerFn({ method: "GET" }).handler(
  async () => { return fetchDataFromDB() }
);
In earlier TanStack versions I was able to do: 
type FetchedData = Awaited<ReturnType<typeof fetchDataFn>>
type FetchedData = Awaited<ReturnType<typeof fetchDataFn>>
and this worked fine e.g FetchedData was just { message: string } or whatever; But now, FetchedData is a more complex type: { message: string } | FullFetcherData<undefined, { message: string }>; Is there maybe a type helper I should be using here?
4 Replies
like-gold
like-goldOP•7mo ago
Couldn't find a type helper included for this but put together my own using the available types: 
type FetcherDataType<TFetcher> =
  TFetcher extends Fetcher<any, any, infer TRes> ? FetcherData<TRes> : never;
type FetcherDataType<TFetcher> =
  TFetcher extends Fetcher<any, any, infer TRes> ? FetcherData<TRes> : never;
Usage: 
type FetchedData = FetcherDataType<typeof fetchDataFn>; // { message: string }
type FetchedData = FetcherDataType<typeof fetchDataFn>; // { message: string }
Lmk if this is not intended/optimal!
rare-sapphire
rare-sapphire•7mo ago
cc @Chris Horobin do we want to offer an official helper here?
gradual-turquoise
gradual-turquoise•7mo ago
No helpers yet for start
rare-sapphire
rare-sapphire•7mo ago
yet 😁 but would be a nice addition

Did you find this page helpful?