Description
shell/site.tsx already owns the top-level QueryClient and QueryClientProvider, making it the right home for React Query devtools. Individual apps (e.g. frontend-app-instructor-dashboard) are currently adding devtools themselves, which causes build failures in downstream consumers and leads to nested QueryClientProvider instances.
Since frontend-base ships its toolchain dependencies directly (webpack, babel, jest, etc.), @tanstack/react-query-devtools should be added to dependencies alongside the existing @tanstack/react-query peer dependency. Because it's a direct dependency it's always installed, so a static import is fine — no dynamic import needed. A process.env.NODE_ENV guard on the render is still required to keep the devtools out of production bundles.
Once this lands, the devtools import and render in frontend-app-instructor-dashboard/src/Main.tsx should be removed.
Description
shell/site.tsxalready owns the top-levelQueryClientandQueryClientProvider, making it the right home for React Query devtools. Individual apps (e.g.frontend-app-instructor-dashboard) are currently adding devtools themselves, which causes build failures in downstream consumers and leads to nestedQueryClientProviderinstances.Since
frontend-baseships its toolchain dependencies directly (webpack, babel, jest, etc.),@tanstack/react-query-devtoolsshould be added todependenciesalongside the existing@tanstack/react-querypeer dependency. Because it's a direct dependency it's always installed, so a static import is fine — no dynamic import needed. Aprocess.env.NODE_ENVguard on the render is still required to keep the devtools out of production bundles.Once this lands, the devtools import and render in
frontend-app-instructor-dashboard/src/Main.tsxshould be removed.