tRPC Client Configuration

The tRPC provider (src/lib/trpc/provider.tsx) configures the client-side tRPC and React Query setup used by all myProp front-end data fetching. As of v0.1.5 it includes a 30-second timeout, automatic JSON headers, and smart retry logic.

Configuration Summary

Setting	Value
Transport	httpBatchLink → /api/trpc
Serialiser	superjson
Request timeout	30 000 ms (30 s)
Max retries	3
Retry back-off	Linear — 1 000 ms × attempt
Default stale time	30 000 ms (30 s)

Timeout

A custom fetch wrapper injects an AbortController signal into every request. If the server has not responded within 30 seconds, the request is aborted.

Retry Logic

The QueryClient is configured to retry failed queries and mutations up to 3 times with a linear back-off:

Retry	Delay
1st	1 000 ms
2nd	2 000 ms
3rd	3 000 ms

Retry Discrimination

Not all errors are worth retrying. The client inspects TRPCClientError to decide:

• ✅ Retried: network failures, timeouts, 5xx server errors
• ❌ Not retried: 4xx client errors, including authentication failures and validation errors

This ensures that a failed login attempt or a bad request does not trigger three unnecessary round-trips to the server.

Stale Time

React Query's default stale time has been set to 30 seconds. Cached data is considered fresh for 30 s after it was last fetched, reducing redundant background refetches during normal navigation.

JSON Headers

All tRPC requests automatically include:

Content-Type: application/json
Accept: application/json

Usage

The TRPCProvider component must wrap your application (or the relevant subtree) to make trpc hooks available:

import { TRPCProvider } from "@/lib/trpc/provider";

export default function RootLayout({ children }: { children: React.ReactNode }) {
  return (
    <TRPCProvider>
      {children}
    </TRPCProvider>
  );
}

Consume data in any client component:

import { trpc } from "@/lib/trpc/provider";

export function PropertiesList() {
  const { data, isLoading } = trpc.properties.list.useQuery();
  // ...
}

The retry, timeout, and stale-time behaviour described above applies automatically to all useQuery and useMutation calls made through this provider.