feat: add offline development support (#987)

## Description

Add support to develop without network access since TRPC by default will
prevent network requests when offline.

https://tanstack.com/query/v4/docs/framework/react/guides/network-mode#network-mode-always

## Changes Made

- Add dynamic logic to toggle offline development
- Removed teams feature flag
This commit is contained in:
David Nguyen
2024-03-05 22:06:48 +11:00
committed by GitHub
parent f6f9c301da
commit 70494fa5bb
6 changed files with 46 additions and 243 deletions

View File

@ -2,6 +2,7 @@
import { useState } from 'react';
import type { QueryClientConfig } from '@tanstack/react-query';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { httpBatchLink } from '@trpc/client';
import { createTRPCReact } from '@trpc/react-query';
@ -27,7 +28,27 @@ export interface TrpcProviderProps {
}
export function TrpcProvider({ children }: TrpcProviderProps) {
const [queryClient] = useState(() => new QueryClient());
let queryClientConfig: QueryClientConfig | undefined;
const isDevelopingOffline =
typeof window !== 'undefined' &&
window.location.hostname === 'localhost' &&
!window.navigator.onLine;
if (isDevelopingOffline) {
queryClientConfig = {
defaultOptions: {
queries: {
networkMode: 'always',
},
mutations: {
networkMode: 'always',
},
},
};
}
const [queryClient] = useState(() => new QueryClient(queryClientConfig));
const [trpcClient] = useState(() =>
trpc.createClient({