TypeError: client[procedureType] is not a function

Has anyone encountered this error before? I'm trying to implement an adapter for Auth.js that can communicate with my backend via tRPC proxy client but I keep getting this error for some reason. This is how i call my route:
import { client } from "../data"
export default function StorefrontApiAdapter() {
return {
async createUser(user) {
const result = await client.authorization.createUser.mutate(user)
return { ...user, id: result.id }

},
async getUser(id) {
const user = await client.authorization.getUser.query(id)
return user
},
async getUserByEmail(email) {
const user = await client.authorization.getUserByEmail.query(email)
return user
},
async getUserByAccount({ providerAccountId, provider }) {
const userByAccount = await client.authorization.getUserByAccount.query(providerAccountId)
return userByAccount
},
async linkAccount(account) {
await client.authorization.linkAccount.mutate(account)
return account
},
[...]
}
}
import { client } from "../data"
export default function StorefrontApiAdapter() {
return {
async createUser(user) {
const result = await client.authorization.createUser.mutate(user)
return { ...user, id: result.id }

},
async getUser(id) {
const user = await client.authorization.getUser.query(id)
return user
},
async getUserByEmail(email) {
const user = await client.authorization.getUserByEmail.query(email)
return user
},
async getUserByAccount({ providerAccountId, provider }) {
const userByAccount = await client.authorization.getUserByAccount.query(providerAccountId)
return userByAccount
},
async linkAccount(account) {
await client.authorization.linkAccount.mutate(account)
return account
},
[...]
}
}
And this is my client:
export const client = createTRPCProxyClient<AppRouter>({
links: [
httpBatchLink({
url: `${PUBLIC_STOREFRONT_API}/trpc`,
}),
],
})
export const client = createTRPCProxyClient<AppRouter>({
links: [
httpBatchLink({
url: `${PUBLIC_STOREFRONT_API}/trpc`,
}),
],
})
Solution:
I used sveltekit so the setup was a bit different and backend was just normal medusa.js node application, the methods are just built like this on the client: ```ts function StorefrontApiAdapter(client: AuthClient): Adapter { return { async createUser(user) {...
B
BillyBob25d ago
@emil Did you ever solve this?
E
emil25d ago
Oh yeah managed in the end!
B
BillyBob25d ago
what as the issue ? i am getting the same problem when upgrading next to anything newer than 14.1.0 or do you have a link to your repo?
E
emil25d ago
The repo is unfortunately private for work, I can check tmrw what the issue was exactly (off the top of my head it was mismatched trpc versions between my front end and backend)
B
BillyBob24d ago
Thanks! the versions are tthe same at least in my case. Do you guys have separated BE/server and client ?
E
emil24d ago
Ooh interesting, yeah they are separate
B
BillyBob24d ago
same Are you using NextJS? how did you setup your api/trpc/[trpc] if so because in all the examples they access the appRouter in there, but if they are separated then how can that be done
Solution
E
emil24d ago
I used sveltekit so the setup was a bit different and backend was just normal medusa.js node application, the methods are just built like this on the client:
function StorefrontApiAdapter(client: AuthClient): Adapter {
return {
async createUser(user) {
const userSchema = z
.object({
email: z.string(),
emailVerified: z.date().nullable(),
})
.passthrough()

const validatedUser = userSchema.safeParse(user)
if (!validatedUser.success) throw new Error("Not a valid user")

// email magic link does not give a name and image field
const result = await client.authorization.createUser.mutate({
email: validatedUser.data.email,
name: user.name ?? null,
emailVerified: validatedUser.data.emailVerified as string | null, // turns into string on the way to api
image: user.image ?? null,
})
return { ...user, id: result.id }
},

async getUser(id: string): Promise<AdapterUser | null> {
const user = await client.authorization.getUser.query(id)
return transformToAdapterUser(user)
},
//...all the methods used by authjs (did not fit into the msg)
function StorefrontApiAdapter(client: AuthClient): Adapter {
return {
async createUser(user) {
const userSchema = z
.object({
email: z.string(),
emailVerified: z.date().nullable(),
})
.passthrough()

const validatedUser = userSchema.safeParse(user)
if (!validatedUser.success) throw new Error("Not a valid user")

// email magic link does not give a name and image field
const result = await client.authorization.createUser.mutate({
email: validatedUser.data.email,
name: user.name ?? null,
emailVerified: validatedUser.data.emailVerified as string | null, // turns into string on the way to api
image: user.image ?? null,
})
return { ...user, id: result.id }
},

async getUser(id: string): Promise<AdapterUser | null> {
const user = await client.authorization.getUser.query(id)
return transformToAdapterUser(user)
},
//...all the methods used by authjs (did not fit into the msg)
and then that is imported by a the authjs middleware to be used as a custom adapter:
const handleAuth: Handle = SvelteKitAuth(async () => {
return {
secret: config.authSecret,
strategy: "jwt",
trustHost: true,
adapter: StorefrontApiAdapter(config.client),
// ...rest of the object here
const handleAuth: Handle = SvelteKitAuth(async () => {
return {
secret: config.authSecret,
strategy: "jwt",
trustHost: true,
adapter: StorefrontApiAdapter(config.client),
// ...rest of the object here
the config.client is just the tRPC
createTRPCProxyClient
createTRPCProxyClient
B
BillyBob23d ago
thanks @emil Here is my current issue: https://discord.com/channels/867764511159091230/1221402424405790780 If you can help in any way its appreciated
E
emil23d ago
oh nice you solved it as well, very nice!
More Posts
TRPC -useInfiniteQuery() refreshes all data when an input is varied, how to use?So I have a TRPC infiniteQuery: ``` const { data, fetchNextPage, hasNextPage } = trpc.server.Cannot get server response headers in browserHi, I am working on retrieving a specific server-sent header using a custom link with tRPC. This meteventemitter not having any listeners on websocketHi, I have a app router project with TRPC but I created a websocket server alongside and a websocketRPC + cls-hookedHi, im trying to implement `cls-hooked` library with trpc's protectedProcedure, but it doesnt seem ttrpc + fastify POST request not workingI have a trpc mutation like this: ``` create: publicProcedure .input(z.object({ title: z.stringproblem with useContext (likely easy fix)```tsx function userCard( user: { id: string; name: string | null; image: string | nulI think i found an TRPC BUGI am using TRPC With Fastify and bun (node.js alternative) if you try to call any .mutation route thuseMutation in useEffect dependency array causes infinite loopI had a very unexpected issue today when testing out some code. I have a simple `sum` method in tRPChow does batching work?My understanding is that batching basically combines multiple requests in a single network request, Links vs MiddlewaresWhat is the difference between a middleware and a link? These two seems to behave the same?Setting up tRPC with Supabase and DrizzleHi! 😄 Is there someone that has any recommendations on how I should setup tRPC with Supabase Auth aRequests running multiple times after it's failingCannot read properties of undefined (reading 'trpc')I keep getting that when trying to make an api request with my next.js page. I am using the latest NDoes SSG / ServerSideHelpers allow for mutations in getServerSideProps Nextjs ?Hi, I have a use case where I send the user to a payment portal, and the payment portal can send theCan someone explain MiddlewareFunction?I am trying to create a custommiddleware.ts file and I would like some explanation on what goes intoHow do I get the queries and mutations list in v10?Hello, In tRPC v9 I can do: ``` const queries = Object.keys(appRouter._def.queries); const mutatiIssues with subrouters being treated as any on clientI have 3 sub routers, all with a hello query just returning an object with world. I'm using nextjs wStrange trpc typesHello, I just installed a fresh `trpc` project with `prisma` and `next`. I have a prisma schema suchIs there a version of tRPC v10 that works with Next 12?Hi, is there a version of tRPC that works with Next 12 and React 17? We want to incrementally adoptRunning TRPC on Vercel with custom serialization failsHi all, I'm having some difficulties with the serialization of my objects when I run on vercel. I'm