route.ts file returning 500 status code than it showing unhandled error on client side

Although i am handling all the edge case of error but it still giving that unhandled runtime error is that okay to have that?
  const mutation = useMutation(fileUploader, {
    mutationKey: ["fileupload"],
    onError: (err) => {
      if (err instanceof AxiosError) {
        // AxiosError specific handling
        if (err.response?.data && err.response?.data.success === false) {
          const fileUploadError = err.response.data as FileUploadError;
          return toast({
            title: fileUploadError.status,
            description: fileUploadError.message,
            variant: 'destructive',
          });
        } else {
          return toast({
            title: err.name,
            description: err.message || "Something Went Wrong",
            variant: 'destructive',
          });
        }
      } else {
        // Non-Axios error handling
        return toast({
          title: "Internal Server Error",
          description: "Something Went Wrong",
          variant: 'destructive',
        });
      }
    },
    retry: false,
  });

fileuploader function code
const fileUploader = async (formData: FormData) => {
  try {
    const { data } = await axios.post("/api/upload", formData);
    return data;
  } catch (error) {
    throw error;
  }
};
image.png
Was this page helpful?