Bug: Duplicate QueryClient instance — queryClient.js is dead code #55

New Issue

Closed

opened 2026-05-17 17:24:29 -05:00 by null · 0 comments

null commented

2026-05-17 17:24:29 -05:00

Owner

Problem

There are two separate QueryClient instances created:

src/main.jsx (lines 9-14) — creates a QueryClient and passes it to <QueryClientProvider>. This is the active instance used by the app.
src/lib/queryClient.js — creates another QueryClient with the same config and exports it. This is never connected to any provider and is dead code.

Additionally, src/lib/api.js imports queryClient from ./queryClient but never uses it in a way that would work with React Query's context system. The import is there but the queryClient reference is only re-exported, never used for invalidateQueries or other imperative calls.

Impact

The queryClient.js module creates a wasted QueryClient instance on every import
If any developer tries to use queryClient from api.js for cache invalidation, it would operate on the wrong (disconnected) instance
The export in api.js is misleading

Fix

Remove src/lib/queryClient.js entirely
Remove the export { queryClient } line from src/lib/api.js
If imperative query client access is needed in the future, use useQueryClient() hook inside components instead

## Problem There are two separate `QueryClient` instances created: 1. `src/main.jsx` (lines 9-14) — creates a `QueryClient` and passes it to `<QueryClientProvider>`. This is the **active** instance used by the app. 2. `src/lib/queryClient.js` — creates another `QueryClient` with the same config and exports it. This is **never connected** to any provider and is dead code. Additionally, `src/lib/api.js` imports `queryClient` from `./queryClient` but never uses it in a way that would work with React Query's context system. The import is there but the `queryClient` reference is only re-exported, never used for `invalidateQueries` or other imperative calls. ## Impact - The `queryClient.js` module creates a wasted `QueryClient` instance on every import - If any developer tries to use `queryClient` from `api.js` for cache invalidation, it would operate on the wrong (disconnected) instance - The export in `api.js` is misleading ## Fix 1. Remove `src/lib/queryClient.js` entirely 2. Remove the `export { queryClient }` line from `src/lib/api.js` 3. If imperative query client access is needed in the future, use `useQueryClient()` hook inside components instead