Theo's Typesafe Cult•8mo ago

trpc/app-router surfacing trpc errors in `error.tsx`?

[i already posted this on trpc discord but not getting anything over there so figured i'd see if anyone here might know] I've got this condition for throwing in my trpc procedure:

      if (!userClerkProfile) {
        console.log("throwing"); // -> this is logging 
        throw new TRPCError({
          code: "NOT_FOUND",
          message: `Couldn't find the user with @${input.username}`,
        });

      if (!userClerkProfile) {
        console.log("throwing"); // -> this is logging 
        throw new TRPCError({
          code: "NOT_FOUND",
          message: `Couldn't find the user with @${input.username}`,
        });

and on client I have a next13 error.tsx route, in which I do:

const ErrorViewMap = {
  [TRPC_ERROR_MAP.NOT_FOUND]: UsernameNotFoundErrorView,
  DEFAULT: () => <p>Unexpected error, please try again</p>,
};

export default function ProfilePageError({
  error,
  reset,
}: PropsProfilePageError) {
  const errorCode = getHTTPStatusCodeFromError(error);
  const ErrorView = ErrorViewMap[errorCode] ?? ErrorViewMap.DEFAULT;

  return <ErrorView message={"stock message"} resetFn={reset} />;
}

const ErrorViewMap = {
  [TRPC_ERROR_MAP.NOT_FOUND]: UsernameNotFoundErrorView,
  DEFAULT: () => <p>Unexpected error, please try again</p>,
};

export default function ProfilePageError({
  error,
  reset,
}: PropsProfilePageError) {
  const errorCode = getHTTPStatusCodeFromError(error);
  const ErrorView = ErrorViewMap[errorCode] ?? ErrorViewMap.DEFAULT;

  return <ErrorView message={"stock message"} resetFn={reset} />;
}

errorCode is always 500 when we throw from that condition. No matter the code I pass when I throw

2 Replies

shilohjt•8mo ago

The errorCode variable in your client-side code is being populated by calling getHTTPStatusCodeFromError(error). Make sure that this function returns the correct mapping from the thrown error to its HTTP status code.

jack•8mo ago

Not at my computer right now but I believe that the error is coming through as expected I’ll check tomorrow and get back here

Gaming

Programming

trpc/app-router surfacing trpc errors in `error.tsx`?