feat: disable trpc batching (#403)

.storybook/preview.tsx

@@ -13,7 +13,7 @@ import {
   type ReactRenderer,
 } from '@storybook/react'
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
-import { httpBatchLink } from '@trpc/client'
+import { httpLink } from '@trpc/client'
 import { createTRPCReact } from '@trpc/react-query'
 import { format } from 'date-fns/format'
 import merge from 'lodash/merge'
@@ -71,7 +71,7 @@ const SetupDecorator: Decorator = (story) => {
   )
   const [trpcClient] = useState(() =>
     trpc.createClient({
-      links: [httpBatchLink({ url: '' })],
+      links: [httpLink({ url: '' })],
       transformer: superjson,
     }),
   )

src/pages/api/trpc/[trpc].ts

@@ -20,11 +20,11 @@ export default trpcNext.createNextApiHandler({
       ctx?.session?.destroy()
     }
   },
-  /**
-   * Enable query batching
-   */
   batching: {
-    enabled: true,
+    /**
+     * Disable query batching for better logging (and since we mostly self-host the app without Serverless)
+     */
+    enabled: false,
   },
   /**
    * @link https://trpc.io/docs/caching#api-response-caching

src/utils/trpc.ts

@@ -1,6 +1,6 @@
 import { type NextPageContext } from 'next'
 import {
-  httpBatchLink,
+  httpLink,
   loggerLink,
   TRPCClientError,
   type TRPCLink,
@@ -156,7 +156,7 @@ export const trpc = createTRPCNext<
             process.env.NODE_ENV === 'development' ||
             (opts.direction === 'down' && opts.result instanceof Error),
         }),
-        httpBatchLink({
+        httpLink({
           url: `${getBaseUrl()}/api/trpc`,
           /**
            * Provide a function that will invoke the current global