@opengeni/react 3.1.0 → 3.3.2-canary.1

package/src/components/model-policy-picker.tsx

@@ -13,6 +13,7 @@ import { DropdownMenu } from "radix-ui";
 import {
   useEffect,
   useMemo,
+  useRef,
   useState,
   type CSSProperties,
   type ReactNode,
@@ -25,6 +26,7 @@ import {
   findPickerRow,
   groupPickerRowsByBillingClass,
   labelReasoningEffort,
+  payerSummaryForModel,
   projectClientModelRows,
   runnableLatencyModesForModel,
   type PickerBillingClass,
@@ -67,7 +69,7 @@ export const defaultModelPolicyPickerMessages: ModelPolicyPickerMessages = {
     external: "Provider terms and limits apply",
     codex_subscription: "ChatGPT / Codex plan",
     supergrok_subscription: "SuperGrok / xAI plan",
-    byok: "Billed to your AI Gateway",
+    byok: "Billed to the workspace provider account",
   },
 };
 
@@ -157,7 +159,7 @@ export function BillingClassMark(props: {
     external: "External provider",
     codex_subscription: "Codex",
     supergrok_subscription: "SuperGrok",
-    byok: "Bring your own key",
+    byok: "Workspace provider account",
   };
   const label = props["aria-label"] ?? labels[props.billingClass];
   const accessibility =
@@ -194,6 +196,18 @@ function isCodexModel(model: ClientModel): boolean {
   return model.id.startsWith("codex/") || model.source === "codex";
 }
 
+function billingClassForMissingSelection(modelId: string): PickerBillingClass {
+  if (modelId.startsWith("workspace-gateway/")) return "byok";
+  if (modelId.startsWith("workspace-openrouter/")) return "byok";
+  // A deployment OpenRouter ID does not encode its workspace-facing cost.
+  // Missing rows therefore use the credits-safe rail instead of falsely
+  // claiming that an unknown former selection was externally funded.
+  if (modelId.startsWith("openrouter/")) return "opengeni_credits";
+  if (modelId.startsWith("codex/")) return "codex_subscription";
+  if (modelId.startsWith("supergrok/")) return "supergrok_subscription";
+  return "opengeni_credits";
+}
+
 function applyCodexOnly(
   rows: ClientPickerModelRow[],
   codexOnly: boolean,
@@ -226,7 +240,11 @@ function defaultNavState(rows: ClientPickerModelRow[], modelId: string): PickerN
       ? { level: "models", rail: onlyRail, modelId: null }
       : { level: "providers", rail: null, modelId: null };
   }
-  return { level: "thinking", rail: selected.billingClass, modelId: selected.id };
+  return {
+    level: "thinking",
+    rail: selected.billingClass,
+    modelId: selected.id,
+  };
 }
 
 function usePickerNavState(
@@ -351,7 +369,11 @@ export function ModelPolicyPickerMenu(
 
   const effectiveNav =
     nav.level === "providers" && groups.length === 1
-      ? { level: "models" as const, rail: groups[0]!.billingClass, modelId: null }
+      ? {
+          level: "models" as const,
+          rail: groups[0]!.billingClass,
+          modelId: null,
+        }
       : nav;
   const activeGroup =
     effectiveNav.rail === null
@@ -415,14 +437,21 @@ export function ModelPolicyPickerMenu(
             <PickerNavRow
               key={`${row.billingClass}:${row.id}`}
               label={row.label}
-              hint={row.unavailableReason ?? undefined}
+              hint={row.unavailableReason ?? payerSummaryForModel(row.catalog)}
               disabled={!row.selectable}
               title={row.unavailableReason ?? undefined}
               active={row.id === props.model}
               testId={`model-picker-choice-${row.id}`}
               onClick={() => {
                 if (row.selectable) {
-                  go({ level: "thinking", rail: row.billingClass, modelId: row.id }, 1);
+                  go(
+                    {
+                      level: "thinking",
+                      rail: row.billingClass,
+                      modelId: row.id,
+                    },
+                    1,
+                  );
                 }
               }}
             />
@@ -541,21 +570,41 @@ export function ModelPolicyPickerMenu(
   );
 }
 
-export function ModelPolicyPicker(props: ModelPolicyPickerProps) {
+/** @internal Shared state seam kept outside the Radix portal for deterministic testing. */
+export function useModelPolicyPickerState(props: ModelPolicyPickerProps) {
   const [uncontrolledOpen, setUncontrolledOpen] = useState(props.defaultOpen ?? false);
   const open = props.open ?? uncontrolledOpen;
+  const rows = effectiveRows(props);
+  const [nav, setNav] = usePickerNavState(props.sessionKey, rows, props.model);
+  const previousControlledOpen = useRef(props.open);
+  useEffect(() => {
+    const wasOpen = previousControlledOpen.current;
+    previousControlledOpen.current = props.open;
+    if (props.open === true && wasOpen !== true) {
+      setNav(defaultNavState(rows, props.model));
+    }
+    // Reset only on the controlled closed-to-open edge; ordinary rerenders
+    // deliberately preserve the current drill-down page.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [props.open]);
   const setOpen = (next: boolean) => {
+    if (next) {
+      setNav(defaultNavState(rows, props.model));
+    }
     if (props.open === undefined) setUncontrolledOpen(next);
     props.onOpenChange?.(next);
   };
+  return { open, setOpen, rows, nav, setNav };
+}
+
+export function ModelPolicyPicker(props: ModelPolicyPickerProps) {
   const trigger = usePortalTokenSource<HTMLButtonElement>();
   const portalStyle = usePortalTokenStyle(trigger.source);
   const messages = useMemo(
     () => ({ ...defaultModelPolicyPickerMessages, ...props.messages }),
     [props.messages],
   );
-  const rows = effectiveRows(props);
-  const [nav, setNav] = usePickerNavState(props.sessionKey, rows, props.model);
+  const { open, setOpen, rows, nav, setNav } = useModelPolicyPickerState(props);
   const selected = findPickerRow(rows, props.model);
 
   if (props.loading) {
@@ -584,10 +633,7 @@ export function ModelPolicyPicker(props: ModelPolicyPickerProps) {
           )}
         >
           <BillingClassMark
-            billingClass={
-              selected?.billingClass ??
-              (props.model.startsWith("codex/") ? "codex_subscription" : "opengeni_credits")
-            }
+            billingClass={selected?.billingClass ?? billingClassForMissingSelection(props.model)}
             className="text-og-fg"
           />
           <span className="og-model-policy-label-full min-w-0 truncate font-medium text-og-fg max-sm:hidden">

package/src/components/tip-follow.ts

@@ -200,6 +200,11 @@ export function tipFollowNoteGrowth(
   if (previous <= 0) {
     return { ...state, lastHeight: height };
   }
+  if (height < previous && previous - height <= TIP_FOLLOW_SHRINK_EPS_PX) {
+    // Match viewport-shrink deadband memory: the shell retains the paired
+    // pre-shrink scrollTop and this state retains the corresponding height.
+    return state;
+  }
   if (height <= previous) {
     return { ...state, lastHeight: height };
   }
@@ -441,6 +446,53 @@ export function tipFollowCompensateShrink(
   return Math.max(0, Math.min(maxScroll, scrollTop - delta));
 }
 
+export type TipFollowContentShrinkBaseline = {
+  scrollHeight: number;
+  scrollTop: number;
+};
+
+export type TipFollowContentShrinkObservation = {
+  baseline: TipFollowContentShrinkBaseline | null;
+  compensatedScrollTop: number | null;
+};
+
+/**
+ * Retain the geometry from the first sub-epsilon content-shrink frame until
+ * the cumulative collapse crosses the deadband. Browsers may clamp scrollTop
+ * after every tiny frame, so compensating from the latest DOM top would count
+ * those already-applied clamps twice and make the result animation-cadence
+ * dependent.
+ */
+export function tipFollowObserveContentShrink(
+  baseline: TipFollowContentShrinkBaseline | null,
+  previousHeight: number,
+  previousScrollTop: number,
+  nextHeight: number,
+  clientHeight: number,
+  epsPx: number = TIP_FOLLOW_SHRINK_EPS_PX,
+): TipFollowContentShrinkObservation {
+  if (previousHeight <= 0 || nextHeight >= previousHeight) {
+    return { baseline: null, compensatedScrollTop: null };
+  }
+  const retained = baseline ?? {
+    scrollHeight: previousHeight,
+    scrollTop: previousScrollTop,
+  };
+  if (retained.scrollHeight - nextHeight <= epsPx) {
+    return { baseline: retained, compensatedScrollTop: null };
+  }
+  return {
+    baseline: null,
+    compensatedScrollTop: tipFollowCompensateShrink(
+      retained.scrollTop,
+      retained.scrollHeight,
+      nextHeight,
+      clientHeight,
+      epsPx,
+    ),
+  };
+}
+
 /**
  * Viewport shrank (SessionChrome / composer / window). maxScroll rises by ≈Δc;
  * keep the same tip distance: scrollTop += Δc. Without this, pinned follow only

package/src/components/tooltip.tsx

@@ -8,10 +8,19 @@
  * tips and look like a blank white bubble.
  */
 import { Tooltip as TooltipPrimitive } from "radix-ui";
-import { createContext, useContext, type ComponentProps, type CSSProperties } from "react";
+import {
+  createContext,
+  useContext,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useState,
+  type ComponentProps,
+  type CSSProperties,
+} from "react";
 
 import { cn } from "../lib/cn";
-import { usePortalTokenSource, usePortalTokenStyle } from "../lib/use-portal-token-style";
+import { usePortalTokenStyle } from "../lib/use-portal-token-style";
 
 type TooltipSourceContextValue = {
   source: HTMLElement | null;
@@ -28,10 +37,34 @@ function TooltipProvider({
 }
 
 function Tooltip({ children, ...props }: ComponentProps<typeof TooltipPrimitive.Root>) {
-  const source = usePortalTokenSource<HTMLElement>();
+  const { onOpenChange, ...rootProps } = props;
+  const sourceRef = useRef<HTMLElement | null>(null);
+  const sourcePublishedRef = useRef(false);
+  const [source, setSource] = useState<HTMLElement | null>(null);
+  const ref = useRef((node: HTMLElement | null) => {
+    sourceRef.current = node;
+    if (sourcePublishedRef.current) setSource(node);
+  }).current;
+  useLayoutEffect(() => {
+    if (rootProps.open === true || rootProps.defaultOpen === true) {
+      sourcePublishedRef.current = true;
+      setSource(sourceRef.current);
+    }
+  }, [rootProps.defaultOpen, rootProps.open]);
+  const sourceContext = useMemo(() => ({ source, ref }), [ref, source]);
   return (
-    <TooltipSourceContext.Provider value={source}>
-      <TooltipPrimitive.Root data-slot="tooltip" {...props}>
+    <TooltipSourceContext.Provider value={sourceContext}>
+      <TooltipPrimitive.Root
+        data-slot="tooltip"
+        onOpenChange={(open) => {
+          if (open) {
+            sourcePublishedRef.current = true;
+            setSource(sourceRef.current);
+          }
+          onOpenChange?.(open);
+        }}
+        {...rootProps}
+      >
         {children}
       </TooltipPrimitive.Root>
     </TooltipSourceContext.Provider>

package/src/hooks/use-available-models.ts

@@ -43,7 +43,10 @@ export function useAvailableModels(
   options: UseAvailableModelsOptions = {},
 ): UseAvailableModelsResult {
   const client = useOpenGeniClient(options);
-  const load = useCallback(async () => await client.getClientConfig(), [client]);
+  const load = useCallback(
+    async (signal?: AbortSignal) => await client.getClientConfig({ signal }),
+    [client],
+  );
   const state = usePolledValue(load, {
     pollIntervalMs: options.pollIntervalMs,
     enabled: options.enabled,
@@ -62,19 +65,22 @@ export function useWorkspaceModelCatalog(
   options: UseWorkspaceModelCatalogOptions,
 ): UseWorkspaceModelCatalogResult {
   const client = useOpenGeniClient(options);
-  const load = useCallback(async () => {
-    if (!options.workspaceId) {
-      return { models: [], defaultModel: null };
-    }
-    const [catalog, config] = await Promise.all([
-      client.getWorkspaceModelCatalog(options.workspaceId),
-      client.getClientConfig(),
-    ]);
-    return {
-      models: catalog.models,
-      defaultModel: config.defaultModel,
-    };
-  }, [client, options.workspaceId]);
+  const load = useCallback(
+    async (signal?: AbortSignal) => {
+      if (!options.workspaceId) {
+        return { models: [], defaultModel: null };
+      }
+      const [catalog, config] = await Promise.all([
+        client.getWorkspaceModelCatalog(options.workspaceId, { signal }),
+        client.getClientConfig({ signal }),
+      ]);
+      return {
+        models: catalog.models,
+        defaultModel: config.defaultModel,
+      };
+    },
+    [client, options.workspaceId],
+  );
   const state = usePolledValue(load, {
     pollIntervalMs: options.pollIntervalMs,
     enabled: options.enabled !== false && Boolean(options.workspaceId),

package/src/hooks/use-composer.ts

@@ -569,9 +569,17 @@ function reconcileOptimisticSendFromEvents(
   );
   const triggerEventId = operation.triggerEventId ?? accepted?.id ?? null;
   const turnId = operation.turnId ?? promptTurnIdForTrigger(triggerEventId, events);
+  const acceptedRouting = promptRoutingFromAcceptedEvent(accepted ?? null);
+  const destination =
+    acceptedRouting === "queued_for_execution"
+      ? "queue"
+      : acceptedRouting === "accepted_for_execution" || acceptedRouting === "accepted_for_steering"
+        ? "chat"
+        : operation.destination;
   const needsAdmissionUpdate =
     accepted !== undefined &&
     (operation.state !== "queued" ||
+      operation.destination !== destination ||
       operation.triggerEventId !== triggerEventId ||
       operation.turnId !== turnId ||
       operation.error !== undefined ||
@@ -580,6 +588,7 @@ function reconcileOptimisticSendFromEvents(
     ? {
         ...operation,
         state: "queued",
+        destination,
         triggerEventId,
         turnId,
         error: undefined,
@@ -697,6 +706,7 @@ export function useComposer(
   const targetGeneration = useRef(0);
   const draftReadGeneration = useRef(0);
   const draftReadInFlightRef = useRef<string | null>(null);
+  const draftReadAbortRef = useRef<AbortController | null>(null);
   const draftReadRetryRef = useRef<{
     targetKey: string;
     failures: number;
@@ -733,6 +743,8 @@ export function useComposer(
     if (draftReadRetryRef.current.timer !== null) {
       clearTimeout(draftReadRetryRef.current.timer);
     }
+    draftReadAbortRef.current?.abort();
+    draftReadAbortRef.current = null;
     draftReadRetryRef.current = { targetKey, failures: 0, timer: null };
     targetKeyRef.current = targetKey;
     targetGeneration.current += 1;
@@ -791,6 +803,11 @@ export function useComposer(
       if (draftReadRetryRef.current.timer !== null) {
         clearTimeout(draftReadRetryRef.current.timer);
       }
+      targetGeneration.current += 1;
+      draftReadGeneration.current += 1;
+      draftReadInFlightRef.current = null;
+      draftReadAbortRef.current?.abort();
+      draftReadAbortRef.current = null;
     },
     [],
   );
@@ -929,6 +946,9 @@ export function useComposer(
       draftReadInFlightRef.current = targetKey;
       const generation = targetGeneration.current;
       const readTicket = ++draftReadGeneration.current;
+      const requestAbort = new AbortController();
+      draftReadAbortRef.current?.abort();
+      draftReadAbortRef.current = requestAbort;
       const localAtStart = localEditRevision.current;
       const baseAtStart = draftRef.current;
       const policyAtStart = policyRef.current;
@@ -958,7 +978,9 @@ export function useComposer(
         setDraftLoading(true);
       }
       try {
-        const fetched = await client.getComposerDraft(workspaceId, sessionId);
+        const fetched = await client.getComposerDraft(workspaceId, sessionId, {
+          signal: requestAbort.signal,
+        });
         if (
           generation !== targetGeneration.current ||
           targetKeyRef.current !== targetKey ||
@@ -1049,6 +1071,9 @@ export function useComposer(
         if (draftReadInFlightRef.current === targetKey) {
           draftReadInFlightRef.current = null;
         }
+        if (draftReadAbortRef.current === requestAbort) {
+          draftReadAbortRef.current = null;
+        }
       }
     },
     [client, durableDrafts, sessionId, targetKey, workspaceId],
@@ -1463,10 +1488,13 @@ export function useComposer(
         ) {
           return;
         }
+        const acceptedRouting =
+          acceptedResult?.routing ?? promptRoutingFromAcceptedEvent(acceptedEvent);
         const acceptedDestination =
-          acceptedResult?.routing === "queued_for_execution"
+          acceptedRouting === "queued_for_execution"
             ? "queue"
-            : acceptedResult?.routing === "accepted_for_execution"
+            : acceptedRouting === "accepted_for_execution" ||
+                acceptedRouting === "accepted_for_steering"
               ? "chat"
               : operation.destination;
         if (options.events === undefined && acceptedDestination === "chat") {
@@ -2743,6 +2771,24 @@ function asError(cause: unknown): Error {
   return cause instanceof Error ? cause : new Error(String(cause));
 }
 
+function promptRoutingFromAcceptedEvent(
+  event: SessionEvent | null,
+): "accepted_for_execution" | "queued_for_execution" | "accepted_for_steering" | null {
+  if (
+    typeof event?.payload !== "object" ||
+    event.payload === null ||
+    Array.isArray(event.payload)
+  ) {
+    return null;
+  }
+  const routing = (event.payload as Record<string, unknown>).routing;
+  return routing === "accepted_for_execution" ||
+    routing === "queued_for_execution" ||
+    routing === "accepted_for_steering"
+    ? routing
+    : null;
+}
+
 function isDraftConflictError(error: Error): boolean {
   const apiError = error as Partial<OpenGeniApiError>;
   return (

package/src/hooks/use-file-attachments.ts

@@ -26,6 +26,8 @@ export type FileAttachment = {
   file?: FileAsset | undefined;
   /** Object-URL for an inline preview; minted for `image/*` files only. */
   previewUrl?: string | undefined;
+  /** Stable SDK failure code for UI behavior that must not parse error copy. */
+  errorCode?: "secure_context_required" | undefined;
   error?: string | undefined;
 };
 
@@ -76,6 +78,27 @@ export type UseFileAttachmentsResult = {
 
 const isImage = (file: File): boolean => file.type.startsWith("image/");
 
+let fallbackAttachmentId = 0;
+
+function createAttachmentId(): string {
+  const cryptoSource = globalThis.crypto;
+  if (typeof cryptoSource?.randomUUID === "function") return cryptoSource.randomUUID();
+  fallbackAttachmentId += 1;
+  // This id is only a browser-local React key and retry lookup, never durable
+  // authority. Keep attachment tracking usable when HTTP withholds randomUUID
+  // or Web Crypto is unavailable so the SDK's typed failure reaches the card.
+  return `attachment:${Date.now().toString(36)}:${fallbackAttachmentId.toString(36)}`;
+}
+
+function secureContextRequiredErrorCode(error: unknown): "secure_context_required" | undefined {
+  return typeof error === "object" &&
+    error !== null &&
+    "code" in error &&
+    error.code === "secure_context_required"
+    ? error.code
+    : undefined;
+}
+
 /**
  * Upload-and-track state for files attached to the next message. Owns the
  * full client-side upload layer: a per-file `uploading | ready | failed`
@@ -198,6 +221,7 @@ export function useFileAttachments(
                     name: asset.filename,
                     contentType: asset.contentType,
                     sizeBytes: asset.sizeBytes,
+                    errorCode: undefined,
                     error: undefined,
                   }
                 : attachment,
@@ -212,6 +236,7 @@ export function useFileAttachments(
                 ? {
                     ...attachment,
                     status: "failed",
+                    errorCode: secureContextRequiredErrorCode(error),
                     error: error instanceof Error ? error.message : String(error),
                   }
                 : attachment,
@@ -225,7 +250,7 @@ export function useFileAttachments(
   const addFiles = useCallback(
     (files: Iterable<File>) => {
       for (const file of files) {
-        const id = crypto.randomUUID();
+        const id = createAttachmentId();
         sources.current.set(id, file);
         const previewUrl = isImage(file) ? URL.createObjectURL(file) : undefined;
         if (previewUrl) previewUrls.current.set(id, previewUrl);
@@ -255,7 +280,7 @@ export function useFileAttachments(
       setAttachments((current) =>
         current.map((attachment) =>
           attachment.id === id
-            ? { ...attachment, status: "uploading", error: undefined }
+            ? { ...attachment, status: "uploading", errorCode: undefined, error: undefined }
             : attachment,
         ),
       );
@@ -305,6 +330,7 @@ export function useFileAttachments(
                 sizeBytes: file.sizeBytes,
                 status: "ready",
                 file,
+                errorCode: undefined,
                 error: undefined,
               }
             : {

package/src/hooks/use-goal.ts

@@ -83,14 +83,26 @@ export function useGoal(
   const { run, mutating, mutationError, clearMutationError } = useMutationRunner();
   const generation = useRef(0);
   const targetKeyRef = useRef<string | null>(null);
+  const loadAbort = useRef<AbortController | null>(null);
+
+  const retireLoads = useCallback(() => {
+    generation.current += 1;
+    loadAbort.current?.abort();
+    loadAbort.current = null;
+  }, []);
 
   const load = useCallback(async (): Promise<void> => {
     if (!sessionId) {
       return;
     }
     const ticket = ++generation.current;
+    loadAbort.current?.abort();
+    const controller = new AbortController();
+    loadAbort.current = controller;
     try {
-      const fetched = await client.getGoal(workspaceId, sessionId);
+      const fetched = await client.getGoal(workspaceId, sessionId, {
+        signal: controller.signal,
+      });
       if (ticket === generation.current) {
         setGoal(fetched);
         setError(null);
@@ -108,6 +120,8 @@ export function useGoal(
         setError(cause instanceof Error ? cause : new Error(String(cause)));
       }
       setLoading(false);
+    } finally {
+      if (loadAbort.current === controller) loadAbort.current = null;
     }
   }, [client, workspaceId, sessionId]);
 
@@ -119,13 +133,14 @@ export function useGoal(
       setError(null);
     }
     if (!enabled || !pageLive) {
+      retireLoads();
       setLoading(false);
       return;
     }
     if (sharedFeed) {
       setLoading(false);
       return () => {
-        generation.current += 1;
+        retireLoads();
       };
     }
     setLoading(true);
@@ -133,7 +148,7 @@ export function useGoal(
     if (pollIntervalMs === undefined || pollIntervalMs <= 0) {
       void load();
       return () => {
-        generation.current += 1;
+        retireLoads();
       };
     }
     let cancelled = false;
@@ -149,9 +164,18 @@ export function useGoal(
     return () => {
       cancelled = true;
       if (timer !== null) clearTimeout(timer);
-      generation.current += 1;
+      retireLoads();
     };
-  }, [load, enabled, pageLive, workspaceId, sessionId, options.pollIntervalMs, sharedFeed]);
+  }, [
+    load,
+    enabled,
+    pageLive,
+    workspaceId,
+    sessionId,
+    options.pollIntervalMs,
+    retireLoads,
+    sharedFeed,
+  ]);
 
   const scheduleRefresh = useDebouncedCallback(() => void load());
   useSessionEventTrigger(client, workspaceId, sessionId, isGoalRefreshEvent, scheduleRefresh, {
@@ -203,11 +227,11 @@ export function useGoal(
       return true as const;
     });
     if (ok) {
-      generation.current += 1;
+      retireLoads();
       setGoal(null);
       setError(null);
     }
-  }, [client, workspaceId, sessionId, run]);
+  }, [client, workspaceId, sessionId, run, retireLoads]);
 
   return {
     goal,

package/src/hooks/use-last-started-turn-policy.ts

@@ -51,11 +51,17 @@ export function useLastStartedTurnPolicy(
     useOpenGeni(options);
   const enabled = (options.enabled ?? true) && Boolean(sessionId);
 
-  const load = useCallback(async (): Promise<LastStartedTurnPolicy | null> => {
-    if (!sessionId) return null;
-    const turns = await client.listTurns(workspaceId, sessionId, { latestStarted: true });
-    return policyFromTurn(turns[0]);
-  }, [client, workspaceId, sessionId]);
+  const load = useCallback(
+    async (signal?: AbortSignal): Promise<LastStartedTurnPolicy | null> => {
+      if (!sessionId) return null;
+      const turns = await client.listTurns(workspaceId, sessionId, {
+        latestStarted: true,
+        signal,
+      });
+      return policyFromTurn(turns[0]);
+    },
+    [client, workspaceId, sessionId],
+  );
 
   const { data, loading, error, refresh } = usePolledValue(load, {
     pollIntervalMs: options.pollIntervalMs,