zack3d/big-agi
1
0
Fork 0
mirror of https://github.com/enricoros/big-AGI.git synced 2026-05-10 21:50:14 -07:00
Code Issues Packages Projects Releases Wiki Activity

Rename duplicate QueryClientProvider

Browse Source
This commit is contained in:
Enrico Ros
2024-08-01 23:10:30 -07:00
parent e72db54027
commit de4ab78664
11 changed files with 57 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+12 -12
View File
@@ -21,7 +21,7 @@
"@prisma/client": "^5.17.0",
"@sanity/diff-match-patch": "^3.1.1",
"@t3-oss/env-nextjs": "^0.11.0",
"@tanstack/react-query": "^5.51.15",
"@tanstack/react-query": "^5.51.18",
"@trpc/client": "11.0.0-rc.467",
"@trpc/next": "11.0.0-rc.467",
"@trpc/react-query": "11.0.0-rc.467",
@@ -64,7 +64,7 @@
},
"devDependencies": {
"@cloudflare/puppeteer": "0.0.11",
"@types/node": "^22.0.0",
"@types/node": "^22.0.2",
"@types/nprogress": "^0.2.3",
"@types/plantuml-encoder": "^1.4.2",
"@types/prismjs": "^1.26.4",
@@ -1724,20 +1724,20 @@
}
},
"node_modules/@tanstack/query-core": {
"version": "5.51.15",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.51.15.tgz",
"integrity": "sha512-xyobHDJ0yhPE3+UkSQ2/4X1fLSg7ICJI5J1JyU9yf7F3deQfEwSImCDrB1WSRrauJkMtXW7YIEcC0oA6ZZWt5A==",
"version": "5.51.17",
"resolved": "https://registry.npmjs.org/@tanstack/query-core/-/query-core-5.51.17.tgz",
"integrity": "sha512-AtVNOgVrZNz4C7RzMfx7sCn1/gf0Ype4nX8UP2BOh0C2tTMszwXk98iCLRacTn5vTRNJCZxz3fgEcTJq0uv8GQ==",
"funding": {
"type": "github",
"url": "https://github.com/sponsors/tannerlinsley"
}
},
"node_modules/@tanstack/react-query": {
"version": "5.51.15",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.51.15.tgz",
"integrity": "sha512-UgFg23SrdIYrmfTSxAUn9g+J64VQy11pb9/EefoY/u2+zWuNMeqEOnvpJhf52XQy0yztQoyM9p6x8PFyTNaxXg==",
"version": "5.51.18",
"resolved": "https://registry.npmjs.org/@tanstack/react-query/-/react-query-5.51.18.tgz",
"integrity": "sha512-l/PF3X6Coi53kEDpL2XEU0x+y3szOk/oKWSHMlyy8tyUHviaIg8tJ6O4Cc1AjLAhbyTG1a+bZobdSuLXzYTt/w==",
"dependencies": {
"@tanstack/query-core": "5.51.15"
"@tanstack/query-core": "5.51.17"
},
"funding": {
"type": "github",
@@ -1869,9 +1869,9 @@
"integrity": "sha512-nG96G3Wp6acyAgJqGasjODb+acrI7KltPiRxzHPXnP3NgI28bpQDRv53olbqGXbfcgF5aiiHmO3xpwEpS5Ld9g=="
},
"node_modules/@types/node": {
"version": "22.0.0",
"resolved": "https://registry.npmjs.org/@types/node/-/node-22.0.0.tgz",
"integrity": "sha512-VT7KSYudcPOzP5Q0wfbowyNLaVR8QWUdw+088uFWwfvpY6uCWaXpqV6ieLAu9WBcnTa7H4Z5RLK8I5t2FuOcqw==",
"version": "22.0.2",
"resolved": "https://registry.npmjs.org/@types/node/-/node-22.0.2.tgz",
"integrity": "sha512-yPL6DyFwY5PiMVEwymNeqUTKsDczQBJ/5T7W/46RwLU/VH+AA8aT5TZkvBviLKLbbm0hlfftEkGrNzfRk/fofQ==",
"dev": true,
"dependencies": {
"undici-types": "~6.11.1"
package.json
+2 -2
View File
@@ -30,7 +30,7 @@
"@prisma/client": "^5.17.0",
"@sanity/diff-match-patch": "^3.1.1",
"@t3-oss/env-nextjs": "^0.11.0",
"@tanstack/react-query": "^5.51.15",
"@tanstack/react-query": "^5.51.18",
"@trpc/client": "11.0.0-rc.467",
"@trpc/next": "11.0.0-rc.467",
"@trpc/react-query": "11.0.0-rc.467",
@@ -73,7 +73,7 @@
},
"devDependencies": {
"@cloudflare/puppeteer": "0.0.11",
"@types/node": "^22.0.0",
"@types/node": "^22.0.2",
"@types/nprogress": "^0.2.3",
"@types/plantuml-encoder": "^1.4.2",
"@types/prismjs": "^1.26.4",
pages/_app.tsx
+11 -14
View File
@@ -18,13 +18,12 @@ import { ProviderBackendCapabilities } from '~/common/providers/ProviderBackendC
import { ProviderBootstrapLogic } from '~/common/providers/ProviderBootstrapLogic';
import { ProviderSingleTab } from '~/common/providers/ProviderSingleTab';
import { ProviderSnacks } from '~/common/providers/ProviderSnacks';
import { ProviderTRPCQuerySettings } from '~/common/providers/ProviderTRPCQuerySettings';
import { ProviderTheming } from '~/common/providers/ProviderTheming';
import { hasGoogleAnalytics, OptionalGoogleAnalytics } from '~/common/components/GoogleAnalytics';
import { isVercelFromFrontend } from '~/common/util/pwaUtils';
const MyApp = ({ Component, emotionCache, pageProps }: MyAppProps) => {
const Big_AGI_App = ({ Component, emotionCache, pageProps }: MyAppProps) => {
// We are using a nextjs per-page layout pattern to bring the (Optima) layout creation to a shared place
// This reduces the flicker and the time switching between apps, and seems to not have impact on
@@ -40,16 +39,14 @@ const MyApp = ({ Component, emotionCache, pageProps }: MyAppProps) => {
<ProviderTheming emotionCache={emotionCache}>
<ProviderSingleTab>
<ProviderTRPCQuerySettings>
<ProviderBackendCapabilities>
{/* ^ SSR boundary */}
<ProviderBootstrapLogic>
<ProviderSnacks>
{getLayout(<Component {...pageProps} />)}
</ProviderSnacks>
</ProviderBootstrapLogic>
</ProviderBackendCapabilities>
</ProviderTRPCQuerySettings>
<ProviderBackendCapabilities>
{/* ^ SSR boundary */}
<ProviderBootstrapLogic>
<ProviderSnacks>
{getLayout(<Component {...pageProps} />)}
</ProviderSnacks>
</ProviderBootstrapLogic>
</ProviderBackendCapabilities>
</ProviderSingleTab>
</ProviderTheming>
@@ -60,5 +57,5 @@ const MyApp = ({ Component, emotionCache, pageProps }: MyAppProps) => {
</>;
};
// enables the React Query API invocation
export default apiQuery.withTRPC(MyApp);
// Initializes React Query and tRPC, and enables the tRPC React Query hooks (apiQuery).
export default apiQuery.withTRPC(Big_AGI_App);
pages/link/callback_openrouter.tsx
-1
View File
@@ -15,7 +15,6 @@ function CallbackOpenRouterPage(props: { openRouterCode: string | undefined }) {
// external state
const { data, isError, error, isPending } = apiQuery.backend.exchangeOpenRouterKey.useQuery({ code: props.openRouterCode || '' }, {
enabled: !!props.openRouterCode,
refetchOnWindowFocus: false,
staleTime: Infinity,
});
src/apps/draw/DrawCreate.tsx
-1
View File
@@ -62,7 +62,6 @@ function TempPromptImageGen(props: { prompt: DesignerPrompt, sx?: SxProps }) {
queryKey: ['draw-dpid', dp.uuid],
queryFn: () => queryActiveGenerateImageVector(dp.prompt, dp._repeatCount),
refetchOnReconnect: false,
refetchOnWindowFocus: false,
refetchOnMount: false,
staleTime: Infinity,
});
src/apps/link-chat/AppLinkChat.tsx
-1
View File
@@ -114,7 +114,6 @@ export function AppLinkChat(props: { chatLinkId: string | null }) {
enabled: !!linkId,
queryKey: ['chat-link', linkId],
queryFn: () => fetchStoredChatV1(linkId),
refetchOnWindowFocus: false,
staleTime: 1000 * 60 * 60 * 24, // 24 hours
});
src/common/app.queryclient.ts
+24
View File
@@ -0,0 +1,24 @@
import { QueryClient } from '@tanstack/react-query';
let queryClient: QueryClient | null = null;
export function reactQueryClientSingleton(): QueryClient {
if (!queryClient) {
queryClient = new QueryClient({
defaultOptions: {
queries: {
retry: false,
// call functions even when the network is disconnected; this makes 127.0.0.1 work, while probably not causing other issues
networkMode: 'always',
refetchOnWindowFocus: false,
},
mutations: {
retry: false,
networkMode: 'always',
},
},
});
}
return queryClient;
}
src/common/providers/ProviderTRPCQuerySettings.tsx
-33
View File
@@ -1,33 +0,0 @@
import * as React from 'react';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
export function ProviderTRPCQuerySettings(props: { children: React.ReactNode }) {
// single app-wide instance, used by both React Query and tRPC
const queryClientRef = React.useRef<QueryClient | null>(null);
// create the instance if it doesn't exist
if (!queryClientRef.current) {
queryClientRef.current = new QueryClient({
defaultOptions: {
queries: {
retry: false,
// call functions even when the network is disconnected; this makes 127.0.0.1 work, while probably not causing other issues
networkMode: 'always',
refetchOnWindowFocus: false,
},
mutations: {
retry: false,
networkMode: 'always',
},
},
});
}
return (
<QueryClientProvider client={queryClientRef.current}>
{props.children}
</QueryClientProvider>
);
}
src/common/util/trpc.client.ts
+8
View File
@@ -14,6 +14,7 @@ import type { AppRouterNode } from '~/server/api/trpc.router-node';
import { transformer } from '~/server/api/trpc.transformer';
import { getBaseUrl } from './urlUtils';
import { reactQueryClientSingleton } from '../app.queryclient';
const enableLoggerLink = (opts: any) => {
@@ -28,6 +29,13 @@ const enableLoggerLink = (opts: any) => {
export const apiQuery = createTRPCNext<AppRouterEdge>({
config() {
return {
/**
* We set the queryClient to a singleton App-wide instance, to use the same client for
* both React Query and tRPC. As `withTRPC` in _app.tsx, it will create a QueryClientProvider
* component, so we can catch 2 birds with one stone and only create 1 provider, over 1
* instance, and reuse the same configuration for both traditional React Query and tRPC.
*/
queryClient: reactQueryClientSingleton(),
links: [
loggerLink({ enabled: enableLoggerLink }),
httpLink({
src/modules/llms/vendors/localai/LocalAIAdmin.tsx
Vendored
-1
View File
@@ -127,7 +127,6 @@ export function LocalAIAdmin(props: { access: OpenAIAccessSchema, onClose: () =>
// external state
const { data, error } = apiQuery.llmOpenAI.dialectLocalAI_galleryModelsAvailable.useQuery({ access: props.access }, {
staleTime: 1000 * 60,
refetchOnWindowFocus: false,
});
// derived state
src/modules/llms/vendors/ollama/OllamaAdministration.tsx
Vendored
-1
View File
@@ -24,7 +24,6 @@ export function OllamaAdministration(props: { access: OllamaAccessSchema, onClos
// external state
const { data: pullableData } = apiQuery.llmOllama.adminListPullable.useQuery({ access: props.access }, {
staleTime: 1000 * 60,
refetchOnWindowFocus: false,
});
const { data: pullData, isPending: isPulling, status: pullStatus, error: pullError, mutate: pullMutate, reset: pullReset } = apiQuery.llmOllama.adminPull.useMutation();
const { isPending: isDeleting, status: deleteStatus, error: deleteError, mutate: deleteMutate, reset: deleteReset } = apiQuery.llmOllama.adminDelete.useMutation();