Adopt React Query and live updates across all UI pages

Replace custom useApi/useAgents hooks with @tanstack/react-query.
Add LiveUpdatesProvider for WebSocket-driven cache invalidation.
Add queryKeys module for centralized cache key management. Rework
all pages and dialogs to use React Query mutations and queries.
Improve CompanyContext with query-based data fetching.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Forgotten
2026-02-17 12:24:48 -06:00
parent c9c75bbc0a
commit 3dc3813266
30 changed files with 744 additions and 465 deletions

View File

@@ -1,28 +1,43 @@
import { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import { BrowserRouter } from "react-router-dom";
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { App } from "./App";
import { CompanyProvider } from "./context/CompanyContext";
import { LiveUpdatesProvider } from "./context/LiveUpdatesProvider";
import { BreadcrumbProvider } from "./context/BreadcrumbContext";
import { PanelProvider } from "./context/PanelContext";
import { DialogProvider } from "./context/DialogContext";
import { TooltipProvider } from "@/components/ui/tooltip";
import "./index.css";
const queryClient = new QueryClient({
defaultOptions: {
queries: {
staleTime: 30_000,
refetchOnWindowFocus: true,
},
},
});
createRoot(document.getElementById("root")!).render(
<StrictMode>
<CompanyProvider>
<BrowserRouter>
<TooltipProvider>
<BreadcrumbProvider>
<PanelProvider>
<DialogProvider>
<App />
</DialogProvider>
</PanelProvider>
</BreadcrumbProvider>
</TooltipProvider>
</BrowserRouter>
</CompanyProvider>
<QueryClientProvider client={queryClient}>
<CompanyProvider>
<LiveUpdatesProvider>
<BrowserRouter>
<TooltipProvider>
<BreadcrumbProvider>
<PanelProvider>
<DialogProvider>
<App />
</DialogProvider>
</PanelProvider>
</BreadcrumbProvider>
</TooltipProvider>
</BrowserRouter>
</LiveUpdatesProvider>
</CompanyProvider>
</QueryClientProvider>
</StrictMode>
);