fix(web): add ReactQueryProvider to root layout for Mission Control

Mission Control components (AuditLogDrawer, GlobalAgentRoster, PanelControls) use @tanstack/react-query hooks but no QueryClientProvider existed in the layout tree. This caused a crash: 'No QueryClient set, use QueryClientProvider'. Added ReactQueryProvider wrapper in apps/web/src/providers/ and wired it into the root layout above ErrorBoundary/AuthProvider so all routes have access.
Merge pull request 'style(web): fix prettier formatting in AuditLogDrawer' (#743 ) from fix/audit-drawer-format into main
2026-03-08 10:30:33 -05:00 · 2026-03-08 01:56:03 +00:00 · 2026-03-07 19:54:08 -06:00 · 2026-03-08 00:44:31 +00:00 · 2026-03-07 18:42:50 -06:00 · 2026-03-07 23:36:55 +00:00
4 changed files with 70 additions and 10 deletions
--- a/apps/orchestrator/src/api/agents/agents.controller.ts
+++ b/apps/orchestrator/src/api/agents/agents.controller.ts
@@ -146,7 +146,7 @@ export class AgentsController {
   * Return recent orchestrator events for non-streaming consumers.
   */
  @Get("events/recent")
-  @Throttle({ status: { limit: 200, ttl: 60000 } })
+  @Throttle({ default: { limit: 1000, ttl: 60000 } })
  getRecentEvents(@Query("limit") limit?: string): {
    events: ReturnType<AgentEventsService["getRecentEvents"]>;
  } {
--- a/apps/web/src/app/layout.tsx
+++ b/apps/web/src/app/layout.tsx
@@ -4,6 +4,7 @@ import { Outfit, Fira_Code } from "next/font/google";
 import { AuthProvider } from "@/lib/auth/auth-context";
 import { ErrorBoundary } from "@/components/error-boundary";
 import { ThemeProvider } from "@/providers/ThemeProvider";
 import { ReactQueryProvider } from "@/providers/ReactQueryProvider";
 import "./globals.css";
 export const dynamic = "force-dynamic";
@@ -56,9 +57,11 @@ export default function RootLayout({ children }: { children: ReactNode }): React
      </head>
      <body>
        <ThemeProvider>
-          <ErrorBoundary>
+          <ReactQueryProvider>
-            <AuthProvider>{children}</AuthProvider>
+            <ErrorBoundary>
-          </ErrorBoundary>
+              <AuthProvider>{children}</AuthProvider>
            </ErrorBoundary>
          </ReactQueryProvider>
        </ThemeProvider>
      </body>
    </html>
--- a/apps/web/src/components/mission-control/AuditLogDrawer.tsx
+++ b/apps/web/src/components/mission-control/AuditLogDrawer.tsx
@@ -44,6 +44,25 @@ interface AuditLogResponse {
  total: number;
  page: number;
  pages: number;
  notice?: string;
 }
 function createEmptyAuditLogResponse(page: number, notice?: string): AuditLogResponse {
  return {
    items: [],
    total: 0,
    page,
    pages: 0,
    ...(notice !== undefined ? { notice } : {}),
  };
 }
 function isRateLimitError(error: unknown): boolean {
  if (!(error instanceof Error)) {
    return false;
  }
  return /429|rate limit|too many requests/i.test(error.message);
 }
 function isRecord(value: unknown): value is Record<string, unknown> {
@@ -138,7 +157,15 @@ async function fetchAuditLog(
    params.set("sessionId", normalizedSessionId);
  }
-  return apiGet<AuditLogResponse>(`/api/mission-control/audit-log?${params.toString()}`);
+  try {
    return await apiGet<AuditLogResponse>(`/api/mission-control/audit-log?${params.toString()}`);
  } catch (error) {
    if (isRateLimitError(error)) {
      return createEmptyAuditLogResponse(page, "Rate limited - retrying...");
    }
    return createEmptyAuditLogResponse(page);
  }
 }
 export function AuditLogDrawer({ sessionId, trigger }: AuditLogDrawerProps): React.JSX.Element {
@@ -180,11 +207,10 @@ export function AuditLogDrawer({ sessionId, trigger }: AuditLogDrawerProps): Rea
  const totalItems = auditLogQuery.data?.total ?? 0;
  const totalPages = auditLogQuery.data?.pages ?? 0;
  const items = auditLogQuery.data?.items ?? [];
  const notice = auditLogQuery.data?.notice;
  const canGoPrevious = page > 1;
  const canGoNext = totalPages > 0 && page < totalPages;
  const errorMessage =
    auditLogQuery.error instanceof Error ? auditLogQuery.error.message : "Failed to load audit log";
  return (
    <Sheet open={open} onOpenChange={setOpen}>
@@ -237,10 +263,13 @@ export function AuditLogDrawer({ sessionId, trigger }: AuditLogDrawerProps): Rea
                        Loading audit log...
                      </td>
                    </tr>
-                  ) : auditLogQuery.error ? (
+                  ) : notice ? (
                    <tr>
-                      <td colSpan={5} className="px-3 py-6 text-center text-sm text-red-500">
+                      <td
-                        {errorMessage}
+                        colSpan={5}
                        className="px-3 py-6 text-center text-sm text-muted-foreground"
                      >
                        {notice}
                      </td>
                    </tr>
                  ) : items.length === 0 ? (
--- a/apps/web/src/providers/ReactQueryProvider.tsx
+++ b/apps/web/src/providers/ReactQueryProvider.tsx
@@ -0,0 +1,28 @@
 "use client";
 import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { useState, type ReactNode } from "react";
 interface ReactQueryProviderProps {
  children: ReactNode;
 }
 export function ReactQueryProvider({ children }: ReactQueryProviderProps): React.JSX.Element {
  // Create a stable QueryClient per component mount (one per app session)
  const [queryClient] = useState(
    () =>
      new QueryClient({
        defaultOptions: {
          queries: {
            // Don't refetch on window focus in a dashboard context
            refetchOnWindowFocus: false,
            // Stale time of 30s — short enough for live data, avoids hammering
            staleTime: 30_000,
            retry: 1,
          },
        },
      })
  );
  return <QueryClientProvider client={queryClient}>{children}</QueryClientProvider>;
 }
Author	SHA1	Message	Date
Jason Woltje	a0cc6c3ec7	fix(web): add ReactQueryProvider to root layout for Mission Control All checks were successful ci/woodpecker/push/ci Pipeline was successful Details Mission Control components (AuditLogDrawer, GlobalAgentRoster, PanelControls) use @tanstack/react-query hooks but no QueryClientProvider existed in the layout tree. This caused a crash: 'No QueryClient set, use QueryClientProvider'. Added ReactQueryProvider wrapper in apps/web/src/providers/ and wired it into the root layout above ErrorBoundary/AuthProvider so all routes have access.	2026-03-08 10:30:33 -05:00
jason.woltje	51d6302401	Merge pull request 'style(web): fix prettier formatting in AuditLogDrawer' (#743 ) from fix/audit-drawer-format into main All checks were successful ci/woodpecker/push/ci Pipeline was successful Details	2026-03-08 01:56:03 +00:00
Jason Woltje	cf490510bf	style(web): fix prettier formatting in AuditLogDrawer All checks were successful ci/woodpecker/push/ci Pipeline was successful Details	2026-03-07 19:54:08 -06:00
jason.woltje	3d91334df7	Merge pull request 'fix(mission-control): increase rate limit for events/recent, add error handling' (#742 ) from fix/mission-control-ratelimit into main Some checks failed ci/woodpecker/push/ci Pipeline failed Details	2026-03-08 00:44:31 +00:00
Jason Woltje	e80b624ca6	fix(mission-control): increase rate limit for events/recent, add error handling Some checks failed ci/woodpecker/push/ci Pipeline failed Details	2026-03-07 18:42:50 -06:00
jason.woltje	65536fcb75	Merge pull request 'fix(orchestrator): add missing module import for OrchestratorApiKeyGuard' (#741 ) from fix/orchestrator-guard-import into main All checks were successful ci/woodpecker/push/ci Pipeline was successful Details	2026-03-07 23:36:55 +00:00