@skyhook-io/radar-app 1.13.3 → 1.13.5

package/src/components/diagnose/DiagnoseContext.tsx

@@ -15,6 +15,12 @@ import {
   type ReactNode,
   type SetStateAction,
 } from "react";
+import {
+  MemoryRouter,
+  useInRouterContext,
+  useLocation,
+  useNavigate,
+} from "react-router-dom";
 import {
   fetchAgents,
   getRun,
@@ -86,8 +92,12 @@ interface DiagnoseCtx {
   openInvestigation: (t: Target) => void;
   openRun: (id: string) => void;
   openHome: () => void;
+  openWorkspace: (runID?: string | null) => void;
+  restoreWorkspace: () => void;
+  canRestoreWorkspace: boolean;
   goHome: () => void;
   close: () => void;
+  dismissForNavigation: () => void;
   approveConsent: () => void;
   cancelConsent: () => void;
   refreshRuns: () => void;
@@ -102,6 +112,7 @@ interface DiagnoseCtx {
 interface DiagnoseLayoutCtx {
   open: boolean;
   close: () => void;
+  dismissForNavigation: () => void;
   contentGutter: number; // px right-gutter for the content area when docked (0 = overlay/closed)
   maximized: boolean;
   setMaximized: Dispatch<SetStateAction<boolean>>;
@@ -111,6 +122,7 @@ interface DiagnoseLayoutCtx {
   panelBounds: { min: number; max: number };
   panelWidthKey: string;
   runningKeys: ReadonlySet<string>; // resources with a live investigation (see runTargetKey)
+  runningCount: number;
 }
 
 const Ctx = createContext<DiagnoseCtx | null>(null);
@@ -183,39 +195,114 @@ function writeStored(key: string, value: string) {
   }
 }
 
-function runIDFromLocation(browserURLState: boolean): string | null {
-  if (!diagnoseURLStateEnabled(browserURLState)) return null;
+const WORKSPACE_RETURN_STATE = "investigationWorkspaceReturn";
+const WORKSPACE_RETURN_HISTORY_STEPS_STATE = "investigationReturnHistorySteps";
+const INVALID_WORKSPACE_RUN_ID = "__invalid_workspace_run__";
+
+function runIDFromSearch(search: string): string | null {
   try {
-    return new URLSearchParams(window.location.search).get("ai-run");
+    return new URLSearchParams(search).get("ai-run");
   } catch {
     return null;
   }
 }
 
-function writeRunIDToLocation(
-  id: string | null,
-  push: boolean,
-  browserURLState: boolean,
-) {
-  if (!diagnoseURLStateEnabled(browserURLState)) return;
+export function workspaceRunIDFromPath(pathname: string): string | null {
+  const match = pathname.match(/^\/investigations\/([^/]+)\/?$/);
+  if (!match) return null;
   try {
-    const url = new URL(window.location.href);
-    if (id) url.searchParams.set("ai-run", id);
-    else url.searchParams.delete("ai-run");
-    window.history[push ? "pushState" : "replaceState"](
-      window.history.state,
-      "",
-      `${url.pathname}${url.search}${url.hash}`,
-    );
-    // History API writes do not notify BrowserRouter. Replaying the new state as
-    // popstate keeps every later navigate/setSearchParams call on the same live
-    // query string instead of letting a stale router snapshot erase ai-run.
-    window.dispatchEvent(
-      new PopStateEvent("popstate", { state: window.history.state }),
-    );
+    const id = decodeURIComponent(match[1]);
+    return id && !id.includes("/") ? id : null;
+  } catch {
+    return null;
+  }
+}
+
+export function isInvestigationWorkspacePath(pathname: string): boolean {
+  return /^\/investigations(?:\/.*)?$/.test(pathname);
+}
+
+export function investigationWorkspacePath(runID: string | null): string {
+  return runID
+    ? `/investigations/${encodeURIComponent(runID)}`
+    : "/investigations";
+}
+
+export function investigationWorkspaceSearch(search: string): string {
+  const current = new URLSearchParams(search);
+  const next = new URLSearchParams();
+  const org = current.get("org");
+  if (org) next.set("org", org);
+  const namespaces = current.get("namespaces");
+  if (namespaces) next.set("namespaces", namespaces);
+  const value = next.toString();
+  return value ? `?${value}` : "";
+}
+
+function safeWorkspaceReturn(
+  state: unknown,
+  origin = window.location.origin,
+): string | null {
+  if (!state || typeof state !== "object") return null;
+  const value = (state as Record<string, unknown>)[WORKSPACE_RETURN_STATE];
+  if (typeof value !== "string" || !value.startsWith("/")) return null;
+  try {
+    const url = new URL(value, origin);
+    if (url.origin !== origin || url.pathname.startsWith("//"))
+      return null;
+    return `${url.pathname}${url.search}${url.hash}`;
   } catch {
-    /* URL APIs unavailable — panel state still works for this session */
+    return null;
+  }
+}
+
+export function investigationWorkspaceRestorePath(
+  state: unknown,
+  focusedRunID: string | null,
+  origin = window.location.origin,
+): string | null {
+  const target = safeWorkspaceReturn(state, origin);
+  if (!target) return null;
+  const url = new URL(target, origin);
+  if (focusedRunID && focusedRunID !== INVALID_WORKSPACE_RUN_ID) {
+    url.searchParams.set("ai-run", focusedRunID);
+  } else {
+    url.searchParams.delete("ai-run");
+  }
+  return `${url.pathname}${url.search}${url.hash}`;
+}
+
+export function shouldExitUnavailableWorkspace(
+  pathname: string,
+  agentsResolved: boolean,
+  eligible: boolean,
+): boolean {
+  return agentsResolved && !eligible && isInvestigationWorkspacePath(pathname);
+}
+
+export function investigationWorkspaceNavigationState(options?: {
+  returnPath?: string | null;
+  drawerOrigin?: boolean;
+  closeHistorySteps?: number;
+}): Record<string, string> | undefined {
+  const state: Record<string, string> = {};
+  if (options?.returnPath) state[WORKSPACE_RETURN_STATE] = options.returnPath;
+  if (options?.closeHistorySteps && options.closeHistorySteps > 0) {
+    state[WORKSPACE_RETURN_HISTORY_STEPS_STATE] = String(
+      options.closeHistorySteps,
+    );
   }
+  return Object.keys(state).length > 0 ? state : undefined;
+}
+
+function workspaceReturnHistorySteps(state: unknown): number | null {
+  if (!state || typeof state !== "object") return null;
+  const raw = (state as Record<string, unknown>)[
+    WORKSPACE_RETURN_HISTORY_STEPS_STATE
+  ];
+  if (typeof raw !== "string" || !/^\d+$/.test(raw)) return null;
+  const steps = Number(raw);
+  return steps > 0 ? steps : null;
 }
 
 // Fleet pages host the panel against a cluster-scoped API while remaining on a
@@ -228,15 +315,29 @@ function diagnoseURLStateEnabled(browserURLState: boolean): boolean {
   return !clusterScopedAPI || /^\/c\/[^/]+/.test(window.location.pathname);
 }
 
-export function DiagnoseProvider({
-  children,
-  browserURLState = true,
-}: {
+interface DiagnoseProviderProps {
   children: ReactNode;
   browserURLState?: boolean;
-}) {
+  forceRouterURLState?: boolean;
+  onFocusedRun?: (runID: string) => void;
+}
+
+function RoutedDiagnoseProvider({
+  children,
+  browserURLState = true,
+  forceRouterURLState = false,
+  onFocusedRun,
+}: DiagnoseProviderProps) {
+  const location = useLocation();
+  const navigate = useNavigate();
+  const locationRef = useRef(location);
+  useEffect(() => {
+    locationRef.current = location;
+  }, [location]);
   const [available, setAvailable] = useState(false);
   const [eligible, setEligible] = useState(false);
+  const [agentEligibilityResolved, setAgentEligibilityResolved] =
+    useState(false);
   const [agents, setAgents] = useState<AgentInfo[]>([]);
   const [consented, setConsented] = useState<Record<string, boolean>>({});
   const [selectedAgent, setSelectedAgentState] = useState<string>(
@@ -264,15 +365,48 @@ export function DiagnoseProvider({
   // Tracks whether the panel focus belongs to browser history. Fleet opens the
   // same panel on /issues, where URL state is deliberately disabled; a generic
   // panel launch must never be closed by the deep-link synchronization effect.
-  const urlRunIdRef = useRef(runIDFromLocation(browserURLState));
+  const urlRunIdRef = useRef<string | null>(null);
+  const workspaceRouteRef = useRef(false);
   const writeFocusedRunID = useCallback(
     (id: string | null, push: boolean) => {
-      // Set this before writeRunIDToLocation's synthetic popstate so our own
-      // listener can distinguish a programmatic close/home write from Back.
-      if (diagnoseURLStateEnabled(browserURLState)) urlRunIdRef.current = id;
-      writeRunIDToLocation(id, push, browserURLState);
+      if (!forceRouterURLState && !diagnoseURLStateEnabled(browserURLState))
+        return;
+      const current = locationRef.current;
+      urlRunIdRef.current = id;
+      if (isInvestigationWorkspacePath(current.pathname)) {
+        const returnSteps = workspaceReturnHistorySteps(current.state);
+        const state =
+          push && returnSteps
+            ? {
+                ...(current.state && typeof current.state === "object"
+                  ? current.state
+                  : {}),
+                [WORKSPACE_RETURN_HISTORY_STEPS_STATE]: String(returnSteps + 1),
+              }
+            : current.state;
+        navigate(
+          {
+            pathname: investigationWorkspacePath(id),
+            search: investigationWorkspaceSearch(current.search),
+            hash: current.hash,
+          },
+          { replace: !push, state },
+        );
+        return;
+      }
+      const params = new URLSearchParams(current.search);
+      if (id) params.set("ai-run", id);
+      else params.delete("ai-run");
+      navigate(
+        {
+          pathname: current.pathname,
+          search: params.toString(),
+          hash: current.hash,
+        },
+        { replace: !push, state: current.state },
+      );
     },
-    [browserURLState],
+    [browserURLState, forceRouterURLState, navigate],
   );
   const [runs, setRuns] = useState<RunSummary[]>([]);
   const [runsLoaded, setRunsLoaded] = useState(false);
@@ -335,6 +469,7 @@ export function DiagnoseProvider({
           setEffortState("");
           writeStored(EFFORT_KEY, "");
         }
+        setAgentEligibilityResolved(true);
       })
       .catch(() => {});
     return () => {
@@ -468,11 +603,30 @@ export function DiagnoseProvider({
     );
   }, []);
 
+  // Hosts may need to bridge the focused run into chrome outside RadarApp's
+  // router. Notify only after the server has returned a real run summary — a
+  // URL-shaped id alone is not evidence that the run exists or is readable.
+  const lastNotifiedRunIDRef = useRef<string | null>(null);
+  useEffect(() => {
+    if (
+      !onFocusedRun ||
+      !activeRunId ||
+      lastNotifiedRunIDRef.current === activeRunId ||
+      !runs.some((run) => run.id === activeRunId)
+    ) {
+      return;
+    }
+    lastNotifiedRunIDRef.current = activeRunId;
+    onFocusedRun(activeRunId);
+  }, [activeRunId, onFocusedRun, runs]);
+
+  const runningRuns = runs.filter(
+    (r) => r.status === "running" || r.status === "stopping",
+  );
   // A content-stable signature of the resources with a live investigation,
-  // so the per-resource Investigate buttons can show a "running" indicator even with the
-  // panel closed — and only re-render when the set actually changes, not every poll.
-  const runningSig = runs
-    .filter((r) => r.status === "running" || r.status === "stopping")
+  // so per-resource Investigate buttons only re-render when their live targets
+  // change.
+  const runningSig = runningRuns
     .map((r) => runTargetKey(r.kind, r.namespace, r.name, r.group))
     .sort()
     // resourceKey itself is pipe-delimited; newlines cannot occur in a
@@ -482,7 +636,8 @@ export function DiagnoseProvider({
     () => new Set(runningSig ? runningSig.split("\n") : []),
     [runningSig],
   );
-  const hasRunning = runningSig.length > 0;
+  const runningCount = runningRuns.length;
+  const hasRunning = runningCount > 0;
 
   // Keep the run list (statuses, new background runs) fresh while the surface is open
   // OR while any investigation is still running — so the button indicator stays live
@@ -575,68 +730,217 @@ export function DiagnoseProvider({
     [updateRunSummary, writeFocusedRunID],
   );
 
-  // The run id is durable navigation state: direct loads and popstate focus the
-  // exact run, and the query remains in place so the address bar is copyable.
-  // Fetch by id rather than assuming the bounded recent list contains it.
+  // Browser navigation is the source of truth for presentation: a dedicated
+  // /investigations route is the full workspace, while ?ai-run keeps the
+  // contextual drawer on its underlying page. Fetch exact ids rather than
+  // assuming the bounded recent list contains them.
   useEffect(() => {
-    if (!available || !diagnoseURLStateEnabled(browserURLState)) return;
-    const focusFromLocation = (fromPopState: boolean) => {
-      const id = runIDFromLocation(browserURLState);
-      if (!id) {
-        // A missing id on first mount is ordinary. On popstate it means "back
-        // out of this investigation" only when the focused run was itself
-        // installed by URL history; unrelated synthetic popstate events must
-        // not tear down a panel opened by an in-app action.
-        if (fromPopState && urlRunIdRef.current) {
-          setActiveRunId(null);
-          setView("home");
-          setOpen(false);
-        }
-        urlRunIdRef.current = null;
-        return;
+    if (!forceRouterURLState && !diagnoseURLStateEnabled(browserURLState))
+      return;
+    const workspace = isInvestigationWorkspacePath(location.pathname);
+    // Eligibility is unresolved until the agent probe returns. Once it has
+    // definitively resolved to off, workspace routes cannot render anything
+    // useful; return to the app instead of leaving an eternal loading panel.
+    if (agentEligibilityResolved && !eligible) {
+      setActiveRunId(null);
+      setView("home");
+      setOpen(false);
+      setMaximized(false);
+      if (
+        shouldExitUnavailableWorkspace(
+          location.pathname,
+          agentEligibilityResolved,
+          eligible,
+        )
+      )
+        navigate(
+          {
+            pathname: "/",
+            search: investigationWorkspaceSearch(location.search),
+          },
+          { replace: true },
+        );
+      return;
+    }
+    const id = workspace
+      ? workspaceRunIDFromPath(location.pathname)
+      : runIDFromSearch(location.search);
+    const invalidWorkspaceRun =
+      workspace &&
+      !id &&
+      location.pathname.replace(/\/+$/, "") !== "/investigations";
+    const previouslyURLFocused = urlRunIdRef.current;
+    const wasWorkspace = workspaceRouteRef.current;
+    workspaceRouteRef.current = workspace;
+
+    setMaximized(workspace);
+    const workspaceChanged = wasWorkspace !== workspace;
+    if (id && id === previouslyURLFocused && !workspaceChanged) return;
+    if (!id) {
+      urlRunIdRef.current = null;
+      if (invalidWorkspaceRun) {
+        setActiveRunId(INVALID_WORKSPACE_RUN_ID);
+        setView("investigation");
+        setOpen(true);
+      } else if (workspace) {
+        setActiveRunId(null);
+        setView("home");
+        setOpen(true);
+      } else if (previouslyURLFocused || wasWorkspace) {
+        setActiveRunId(null);
+        setView("home");
+        setOpen(false);
       }
-      urlRunIdRef.current = id;
-      unavailableRunIDsRef.current.delete(id);
-      setStartError(null);
+      return;
+    }
+
+    if (!available) {
+      // Preserve the URL-selected detail while agent availability is still
+      // resolving. Leaving urlRunIdRef untouched ensures the availability
+      // transition reruns this effect and fetches the exact run.
       setActiveRunId(id);
       setView("investigation");
       setOpen(true);
-      getRun(id)
-        .then(updateRunSummary)
-        .catch((error) => {
-          if (error instanceof DiagnoseError && error.status === 404) {
-            unavailableRunIDsRef.current.add(id);
-          }
-          // The list load owns the final missing/degraded state and keeps retrying.
-        });
-    };
-    focusFromLocation(false);
-    const onPopState = () => focusFromLocation(true);
-    window.addEventListener("popstate", onPopState);
-    return () => window.removeEventListener("popstate", onPopState);
-  }, [available, browserURLState, updateRunSummary]);
+      return;
+    }
+
+    urlRunIdRef.current = id;
+    unavailableRunIDsRef.current.delete(id);
+    setStartError(null);
+    setActiveRunId(id);
+    setView("investigation");
+    setOpen(true);
+    getRun(id)
+      .then(updateRunSummary)
+      .catch((error) => {
+        if (error instanceof DiagnoseError && error.status === 404) {
+          unavailableRunIDsRef.current.add(id);
+        }
+        // The list load owns the final missing/degraded state and keeps retrying.
+      });
+  }, [
+    available,
+    agentEligibilityResolved,
+    browserURLState,
+    eligible,
+    forceRouterURLState,
+    location.pathname,
+    location.search,
+    navigate,
+    updateRunSummary,
+    writeFocusedRunID,
+  ]);
+
   // Leaving the detail pane drops the failure that belonged to it. startError
   // renders as the entire pane (maximized home still shows `detail`), where a
   // message about a resource you just navigated away from has nothing to attach
   // to and no way to be dismissed.
   const openHome = useCallback(() => {
     unavailableRunIDsRef.current.clear();
+    setActiveRunId(null);
     setView("home");
     setStartError(null);
     setOpen(true);
     writeFocusedRunID(null, false);
   }, [writeFocusedRunID]);
+  const openWorkspace = useCallback(
+    (preferredRunID?: string | null) => {
+      setOpen(true);
+      setStartError(null);
+      if (!forceRouterURLState && !diagnoseURLStateEnabled(browserURLState)) {
+        if (preferredRunID) {
+          setActiveRunId(preferredRunID);
+          setView("investigation");
+        } else {
+          setActiveRunId(null);
+          setView("home");
+        }
+        setMaximized(true);
+        return;
+      }
+      const current = locationRef.current;
+      // The global entry remains visible in the workspace. Treat clicking it
+      // there as an idempotent reveal rather than pushing another workspace
+      // entry and replacing the page that Close should return to.
+      if (isInvestigationWorkspacePath(current.pathname)) {
+        setMaximized(true);
+        return;
+      }
+      // Global entry calls this without a run and always lands on the fresh Home.
+      // Expanding a docked detail passes its focused run explicitly so the
+      // presentation change does not discard the user's current context.
+      const runID = preferredRunID ?? null;
+      const state = {
+        ...(current.state && typeof current.state === "object"
+          ? current.state
+          : {}),
+        [WORKSPACE_RETURN_STATE]: `${current.pathname}${current.search}${current.hash}`,
+      };
+      navigate(
+        {
+          pathname: investigationWorkspacePath(runID),
+          search: investigationWorkspaceSearch(current.search),
+        },
+        { state },
+      );
+    },
+    [browserURLState, forceRouterURLState, navigate],
+  );
+  const routerURLStateEnabled =
+    forceRouterURLState || diagnoseURLStateEnabled(browserURLState);
+  const canRestoreWorkspace = routerURLStateEnabled
+    ? isInvestigationWorkspacePath(location.pathname) &&
+      !!activeRunId &&
+      activeRunId !== INVALID_WORKSPACE_RUN_ID &&
+      !!safeWorkspaceReturn(location.state)
+    : maximized;
+  const restoreWorkspace = useCallback(() => {
+    if (!routerURLStateEnabled) {
+      setMaximized(false);
+      return;
+    }
+    const current = locationRef.current;
+    const target = investigationWorkspaceRestorePath(
+      current.state,
+      activeRunIdRef.current,
+    );
+    if (target) navigate(target, { replace: true });
+  }, [navigate, routerURLStateEnabled]);
   const goHome = useCallback(() => {
     unavailableRunIDsRef.current.clear();
+    setActiveRunId(null);
     setView("home");
     setStartError(null);
     writeFocusedRunID(null, false);
   }, [writeFocusedRunID]);
+  const dismissForNavigation = useCallback(() => {
+    unavailableRunIDsRef.current.clear();
+    setOpen(false);
+    setView("home");
+    setStartError(null);
+  }, []);
   const close = useCallback(() => {
     unavailableRunIDsRef.current.clear();
     setOpen(false);
+    const current = locationRef.current;
+    if (isInvestigationWorkspacePath(current.pathname)) {
+      const historySteps = workspaceReturnHistorySteps(current.state);
+      if (historySteps) {
+        navigate(-historySteps);
+        return;
+      }
+      const returnPath = safeWorkspaceReturn(current.state);
+      if (returnPath) {
+        const url = new URL(returnPath, window.location.origin);
+        url.searchParams.delete("ai-run");
+        navigate(`${url.pathname}${url.search}${url.hash}`, { replace: true });
+      } else {
+        navigate("/", { replace: true });
+      }
+      return;
+    }
     writeFocusedRunID(null, false);
-  }, [writeFocusedRunID]);
+  }, [navigate, writeFocusedRunID]);
   const consentBusyRef = useRef(false);
   const approveConsent = useCallback(() => {
     if (consentBusyRef.current) return;
@@ -675,7 +979,8 @@ export function DiagnoseProvider({
   const cancelConsent = useCallback(() => {
     setPendingTarget(null);
     setConsentError(null);
-    setOpen(false);
+    setOpen(true);
+    if (!activeRunIdRef.current) setView("home");
   }, []);
   const dismissError = useCallback(() => setStartError(null), []);
 
@@ -712,8 +1017,12 @@ export function DiagnoseProvider({
     openInvestigation,
     openRun,
     openHome,
+    openWorkspace,
+    restoreWorkspace,
+    canRestoreWorkspace,
     goHome,
     close,
+    dismissForNavigation,
     approveConsent,
     cancelConsent,
     refreshRuns,
@@ -729,6 +1038,7 @@ export function DiagnoseProvider({
     () => ({
       open,
       close,
+      dismissForNavigation,
       contentGutter,
       maximized,
       setMaximized,
@@ -738,15 +1048,18 @@ export function DiagnoseProvider({
       panelBounds: PANEL_BOUNDS,
       panelWidthKey: WIDTH_KEY,
       runningKeys,
+      runningCount,
     }),
     [
       open,
       close,
+      dismissForNavigation,
       contentGutter,
       maximized,
       width,
       narrow,
       runningKeys,
+      runningCount,
       setMaximized,
       setWidth,
     ],
@@ -758,3 +1071,15 @@ export function DiagnoseProvider({
     </Ctx.Provider>
   );
 }
+
+// Standalone consumers may not have a router, while full-app hosts already do.
+// Supply one only when there is no surrounding routing context.
+export function DiagnoseProvider(props: DiagnoseProviderProps) {
+  const inRouter = useInRouterContext();
+  if (inRouter) return <RoutedDiagnoseProvider {...props} />;
+  return (
+    <MemoryRouter>
+      <RoutedDiagnoseProvider {...props} />
+    </MemoryRouter>
+  );
+}