T
TanStack•2d ago
foreign-sapphire

Type Inference from `createServerFn`

Seemingly having an issue that is similar to https://github.com/TanStack/router/issues/5788 however there is no hint that it deals with the return type involving functions which are not serializable. Some context: The server function: 
const fetchCustomer = createServerFn()
  .middleware([authMiddleware])
  .handler(async ({ context }) => {
    const customers = await stripe.customers.search({
      query: `metadata['externalId']:'${context.idToken.sub}'`,
      expand: ["data.subscriptions"],
    });

    if (!customers.data.length) return null;

    return customers.data[0];
  });
const fetchCustomer = createServerFn()
  .middleware([authMiddleware])
  .handler(async ({ context }) => {
    const customers = await stripe.customers.search({
      query: `metadata['externalId']:'${context.idToken.sub}'`,
      expand: ["data.subscriptions"],
    });

    if (!customers.data.length) return null;

    return customers.data[0];
  });
Part of the TS error: 
                               Type 'BankAccount' is not assignable to type '{ id: string; object: "bank_account"; account?: string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Typ...'.
                                 Type 'BankAccount' is not assignable to type '{ id: string; object: "bank_account"; account?: string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Typ...'.
                                   Types of property 'account' are incompatible.
                                     Type 'string | Account | null | undefined' is not assignable to type 'string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Type; } | null | undefined'.
                                       Type 'Account' is not assignable to type 'string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Type; } | null | undefined'. [2345]
                               Type 'BankAccount' is not assignable to type '{ id: string; object: "bank_account"; account?: string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Typ...'.
                                 Type 'BankAccount' is not assignable to type '{ id: string; object: "bank_account"; account?: string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Typ...'.
                                   Types of property 'account' are incompatible.
                                     Type 'string | Account | null | undefined' is not assignable to type 'string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Type; } | null | undefined'.
                                       Type 'Account' is not assignable to type 'string | { id: string; object: "account"; business_profile?: { annual_revenue?: { amount: number | null; currency: string | null; fiscal_year_end: string | null; } | null | undefined; ... 10 more ...; url: string | null; } | null | undefined; ... 20 more ...; type: Type; } | null | undefined'. [2345]
Seems to be an issue with how Typescript is inferring the response structure by expanding all nested types. Not 100% positive on the best approach here. Is there a means to type cast in order to have it infer the return as something like Promise<Stripe.Customer | null>? I know that is not ideal, so just reaching out in case others have run into this and if there are any suggestions!
1 Reply
correct-apricot
correct-apricot•2d ago
can you provide the full TS error and a minimal complete reproducer project?

Did you find this page helpful?