trpc first callH

Hi there! I'm trying to create my first trpc route, trying to copy the example route 1. Define a router in src/server/trpc/router/route_name; 2. Import and register the router in src/tprc/router/_app 3. import the router into the component from src/utils/trpc"; 4. Call the registered route 1, url router
export const urlRouter = router({
create: publicProcedure.input(urlFormSchema).query(async () => {
console.log("RUNNING CREATE URL");
}),
...
export const urlRouter = router({
create: publicProcedure.input(urlFormSchema).query(async () => {
console.log("RUNNING CREATE URL");
}),
...
2. _app
export const appRouter = router({
urls: urlRouter,
});
export const appRouter = router({
urls: urlRouter,
});
3. component
trpc.urls.create();
trpc.urls.create();
4. ERROR in the component
Unhandled Runtime Error
TypeError: hooks[lastArg] is not a function
Unhandled Runtime Error
TypeError: hooks[lastArg] is not a function
Any idea why im getting this error? is urls not registered correctly or?
74 Replies
fotoflo
fotofloOPā€¢2y ago
looks like the route is importing correctly
rocawear
rocawearā€¢2y ago
You have input on your router but you are not passing any input when you are calling it
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
like this right?
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
Thank you @rocawear
rocawear
rocawearā€¢2y ago
On your server return "running create url" and on your call log the result
fotoflo
fotofloOPā€¢2y ago
im feeling that's the error too but cant figure out how to call it
fotoflo
fotofloOPā€¢2y ago
same error
Piotrek
Piotrekā€¢2y ago
You have to write the component differently
fotoflo
fotofloOPā€¢2y ago
never gets to the retun statement (or the console log)
Piotrek
Piotrekā€¢2y ago
trpc creates hooks you than have to use useMutation and .mutate() on the hook
fotoflo
fotofloOPā€¢2y ago
ooo?
Piotrek
Piotrekā€¢2y ago
Above the oSubmit function write:
const { mutate } = trpc.urls.create.useMutation();
const { mutate } = trpc.urls.create.useMutation();
and use the mutate function in onSubmit method
rocawear
rocawearā€¢2y ago
Snippet from my project:
const mutation = trpc.auth.register.useMutation({
onError: (e) => setErrorMessage(e.message),
onSuccess: () => router.push("/login"),
});
const mutation = trpc.auth.register.useMutation({
onError: (e) => setErrorMessage(e.message),
onSuccess: () => router.push("/login"),
});
const onSubmit: SubmitHandler<IRegister> = async (data) => {
await mutation.mutateAsync(data);
};
const onSubmit: SubmitHandler<IRegister> = async (data) => {
await mutation.mutateAsync(data);
};
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
rocawear
rocawearā€¢2y ago
You need to use useQuery instead since you are not mutating
Piotrek
Piotrekā€¢2y ago
don't use query change api
rocawear
rocawearā€¢2y ago
But since you should mutate you should change your query to mutate
Piotrek
Piotrekā€¢2y ago
from .query to .mutation exactly
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
BOOOM šŸ”„ thank you!
rocawear
rocawearā€¢2y ago
Lets go šŸ™‚ !
Piotrek
Piotrekā€¢2y ago
gl with your project šŸ”„
fotoflo
fotofloOPā€¢2y ago
thank you! hey one more question while ive got you guys this public procedure doesnt check auth and there's a private procedure that does, is that correct?
Piotrek
Piotrekā€¢2y ago
yes, you should have procedure called protectedProcedure or sth like that it gets session from next auth
fotoflo
fotofloOPā€¢2y ago
boom
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
awesome thank you!
Piotrek
Piotrekā€¢2y ago
it also assigns your session to ctx.session if I'm not mistaken
fotoflo
fotofloOPā€¢2y ago
yes its there
Piotrek
Piotrekā€¢2y ago
and you can use it to get info of your authed user
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
and prisma is there commiting!
Piotrek
Piotrekā€¢2y ago
nice, gl šŸ˜„
fotoflo
fotofloOPā€¢2y ago
cheers mate ok im back! wtf! the ssession.user doesn't have an id? @Piotrek is this default? does it get stripped somewhere by ct3a?
Piotrek
Piotrekā€¢2y ago
Create T3 App
NextAuth.js šŸš€ Create T3 App
The best way to start a full-stack, typesafe Next.js app.
Piotrek
Piotrekā€¢2y ago
see if you have this code there's a small chance you used older version of ct3a by not adding @latest when initializing it, but most of the versions had the id inclusion anyway so idk
fotoflo
fotofloOPā€¢2y ago
i dont think i do
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
Piotrek
Piotrekā€¢2y ago
it's not in trpc it's inside of the next auth handler
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
just add that file
Piotrek
Piotrekā€¢2y ago
where do you have your nextAuth initializer? config*?
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
this one?
Piotrek
Piotrekā€¢2y ago
yep go there and check for the session callback
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
looks like its there
fotoflo
fotofloOPā€¢2y ago
and it's on the ytpe type
fotoflo
fotofloOPā€¢2y ago
Piotrek
Piotrekā€¢2y ago
why is your callbacks underlined? what's the error?
fotoflo
fotofloOPā€¢2y ago
but its not there in the trpc Router is there a way to show the whole thing in vscode?
Piotrek
Piotrekā€¢2y ago
what thing?
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
the whole error
Piotrek
Piotrekā€¢2y ago
i'm not sure
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
does this answer that question? what is the callbacks error?
Piotrek
Piotrekā€¢2y ago
it seems like it has to be token.id as string not user.id šŸ¤·ā€ā™‚ļø maybe there was some change in nextAuth or you're using jwt
rocawear
rocawearā€¢2y ago
Actually no, I am using jwt. Sorry Bad example
Piotrek
Piotrekā€¢2y ago
@fotoflo are you using jwt there? or default config
fotoflo
fotofloOPā€¢2y ago
no im using prisma
rocawear
rocawearā€¢2y ago
With discord auth?
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
i dopped a debugger on that session callback and logged in and out and it didnt stop at the breakpoint @rocawear i have that code in my session callback already ... oh i have something dumb in there lol i had the callbacks property defined twice oops resolved tahnk you ... i dumb but now i know how this works
fotoflo
fotofloOPā€¢2y ago
fotoflo
fotofloOPā€¢2y ago
thank you @Piotrek and @rocawear !
Want results from more Discord servers?
Add your server