v28•4h ago

best strategy for handling global trpc errors on the client

I’m using trpc in my nextjs app. In one of my procedures, I check if a server is banned. If it is, I throw a TRPCError with code FORBIDDEN and a custom message:

const guildIsBanned = await ctx.db.guildBotBans.findFirst({
  where: { guildId: input.guildId },
});

if (guildIsBanned) {
  throw new TRPCError({
    code: "FORBIDDEN",
    message: `Server is banned from using the bot for reason: \`${guildIsBanned.reason}\``,
  });
}

const guildIsBanned = await ctx.db.guildBotBans.findFirst({
  where: { guildId: input.guildId },
});

if (guildIsBanned) {
  throw new TRPCError({
    code: "FORBIDDEN",
    message: `Server is banned from using the bot for reason: \`${guildIsBanned.reason}\``,
  });
}

This works, but on the frontend it just results in empty pages being rendered whenever the error is thrown. I have 20+ pages in my app, and I don’t want to manually add onError logic to every useQuery just to check if the error code is FORBIDDEN and then render a You are banned component. Is there a neater way of handling this error globally?

0 Replies

No replies yetBe the first to reply to this messageJoin

best strategy for handling global trpc errors on the client

Did you find this page helpful?