@opengeni/react 3.3.2 → 3.4.0

package/src/preview-loading-paint.ts

@@ -0,0 +1,68 @@
+/**
+ * One frame of the "Preparing preview…" ripple: a soft drifting glow under an
+ * 18px lattice whose points swell along an outward wave. DOM-free and
+ * self-contained (it closes over nothing), so the web canvas effect and the
+ * native preview document (which embeds its source) draw the same thing.
+ */
+export function paintPreviewLoading(
+  context: CanvasRenderingContext2D,
+  width: number,
+  height: number,
+  time: number,
+  ink: string,
+  glowColor: string,
+): void {
+  context.clearRect(0, 0, width, height);
+  const cx = width * (0.5 + 0.13 * Math.sin(time * 0.21));
+  const cy = height * (0.5 + 0.12 * Math.cos(time * 0.27));
+  const glow = context.createRadialGradient(cx, cy, 0, cx, cy, Math.max(width, height) * 0.65);
+  glow.addColorStop(0, glowColor);
+  glow.addColorStop(1, "transparent");
+  context.globalAlpha = 0.09;
+  context.fillStyle = glow;
+  context.fillRect(0, 0, width, height);
+  const rows = Math.ceil(height / 18) + 7;
+  const cols = Math.ceil(width / 18) + 7;
+  const points = Array.from({ length: rows }, (_row, r) =>
+    Array.from({ length: cols }, (_col, c) => {
+      const x = (c - 3) * 18;
+      const y = (r - 3) * 18;
+      const dist = Math.hypot((x - cx) * 0.8, y - cy);
+      const wave = Math.sin(dist * 0.032 - time * 0.95);
+      return {
+        x: x + ((x - cx) / Math.max(dist, 1)) * wave * 4,
+        y: y + ((y - cy) / Math.max(dist, 1)) * wave * 4,
+        l: Math.pow((wave + 1) / 2, 5),
+      };
+    }),
+  );
+  context.strokeStyle = ink;
+  context.fillStyle = ink;
+  context.lineWidth = 0.65;
+  points.forEach((row, r) =>
+    row.forEach((p, c) => {
+      context.globalAlpha = 0.035 + p.l * 0.055;
+      context.beginPath();
+      if (c + 1 < cols) {
+        context.moveTo(p.x, p.y);
+        context.lineTo(row[c + 1]!.x, row[c + 1]!.y);
+      }
+      if (r + 1 < rows) {
+        context.moveTo(p.x, p.y);
+        context.lineTo(points[r + 1]![c]!.x, points[r + 1]![c]!.y);
+      }
+      context.stroke();
+      context.globalAlpha = 0.15 + p.l * 0.55;
+      context.beginPath();
+      context.arc(p.x, p.y, 0.85 + p.l * 0.65, 0, Math.PI * 2);
+      context.fill();
+    }),
+  );
+  context.globalAlpha = 1;
+}
+
+/** The ripple's private ink and glow, tuned to the app's teal on a neutral ground. */
+export const PREVIEW_LOADING_COLORS = {
+  dark: { ink: "#9fdccd", glow: "#5fb8a3", background: "#1b1b1b" },
+  light: { ink: "#5f8f84", glow: "#9fe3d3", background: "#f9f9f9" },
+} as const;

package/src/provider.tsx

@@ -8,7 +8,11 @@ import {
 import { useCallback, useEffect, useMemo, useRef, useState, type ReactNode } from "react";
 import type { SessionClientLike } from "./client";
 import { usePageLiveActivity } from "./hooks/internal";
+import { retainSharedQueries } from "./hooks/shared-query";
 import { OpenGeniContext } from "./session-context";
+import { ErrorMessageContext, type ErrorMessageFormatter } from "./lib/error-message";
+
+export type { ErrorMessageFormatter } from "./lib/error-message";
 
 export { useOpenGeni, useOpenGeniClient } from "./session-context";
 export type { ClientOverride, OpenGeniContextValue } from "./session-context";
@@ -19,11 +23,32 @@ export type OpenGeniProviderProps = {
   workspaceId: string;
   onWorkspaceControlEvent?: ((event: WorkspaceControlEvent) => void) | undefined;
   onWorkspaceInteractionEvent?: ((event: WorkspaceInteractionRevisionEvent) => void) | undefined;
+  /**
+   * Stale-tab protection for the stock Opengeni web app: when the server's API
+   * contract revision differs from this bundle's, cover the page and reload it
+   * once. Off by default, because an embedded product's page must never be
+   * blocked or reloaded when Opengeni deploys; there a mismatch is ignored and
+   * the SDK's tolerant-reader compatibility applies.
+   */
+  reloadOnApiContractChange?: boolean | undefined;
+  /**
+   * Keep subscription account lists and usage readings (`useCodexAccounts`,
+   * `useSuperGrokAccounts`) for `client` after the components that read them
+   * unmount, so returning to them renders the last rows at once and re-reads
+   * in the background. Off by default: then readers mounted together share one
+   * request, but nothing is served to a later mount. Opt in only when every
+   * signed-in person gets their own `client` object (the stock Opengeni console
+   * creates a new client on every identity change). Retained rows are dropped
+   * when `client` changes or this provider unmounts.
+   */
+  retainReadsAcrossMounts?: boolean | undefined;
+  /** Host-owned error copy. Receives the original diagnostic error and neutral default copy. */
+  formatError?: ErrorMessageFormatter | undefined;
   children?: ReactNode;
 };
 
 /**
- * Supplies the OpenGeni client + workspace to all hooks below it. Hooks also
+ * Supplies the Opengeni client + workspace to all hooks below it. Hooks also
  * accept `{ client, workspaceId }` overrides per call for multi-workspace UIs.
  */
 export function OpenGeniProvider({
@@ -31,6 +56,9 @@ export function OpenGeniProvider({
   workspaceId,
   onWorkspaceControlEvent,
   onWorkspaceInteractionEvent,
+  reloadOnApiContractChange = false,
+  retainReadsAcrossMounts = false,
+  formatError,
   children,
 }: OpenGeniProviderProps) {
   const [workspaceControlEvent, setWorkspaceControlEvent] = useState<WorkspaceControlEvent | null>(
@@ -59,10 +87,16 @@ export function OpenGeniProvider({
   callbackRef.current = onWorkspaceControlEvent;
   interactionCallbackRef.current = onWorkspaceInteractionEvent;
 
+  useEffect(() => {
+    if (!retainReadsAcrossMounts) return;
+    return retainSharedQueries(client);
+  }, [client, retainReadsAcrossMounts]);
+
+  const strictContract = reloadOnApiContractChange;
   const verifyApiContract = useCallback(async (): Promise<void> => {
     try {
       const config = await client.getClientConfig();
-      if (config.apiContractRevision !== OPENGENI_API_CONTRACT_REVISION) {
+      if (strictContract && config.apiContractRevision !== OPENGENI_API_CONTRACT_REVISION) {
         throw new OpenGeniApiContractMismatchError(
           OPENGENI_API_CONTRACT_REVISION,
           String(config.apiContractRevision || "(missing)"),
@@ -70,12 +104,14 @@ export function OpenGeniProvider({
       }
     } catch (error) {
       if (error instanceof OpenGeniApiContractMismatchError) {
+        // Embedded hosts: a revision difference is not a reason to block or reload the page.
+        if (!strictContract) return;
         setContractMismatch(error);
         reloadForContractMismatchOnce(error);
       }
       throw error;
     }
-  }, [client]);
+  }, [client, strictContract]);
 
   const registerSessionReconciler = useMemo(
     () =>
@@ -175,7 +211,7 @@ export function OpenGeniProvider({
           }
         }
       } catch (error) {
-        if (error instanceof OpenGeniApiContractMismatchError) {
+        if (strictContract && error instanceof OpenGeniApiContractMismatchError) {
           setContractMismatch(error);
           reloadForContractMismatchOnce(error);
         }
@@ -186,7 +222,14 @@ export function OpenGeniProvider({
       }
     })();
     return () => controller.abort();
-  }, [client, pageLive, supportsWorkspaceLiveStream, verifyApiContract, workspaceId]);
+  }, [
+    client,
+    pageLive,
+    strictContract,
+    supportsWorkspaceLiveStream,
+    verifyApiContract,
+    workspaceId,
+  ]);
 
   useEffect(() => {
     if (supportsWorkspaceLiveStream) return;
@@ -222,7 +265,7 @@ export function OpenGeniProvider({
           callbackRef.current?.(event);
         }
       } catch (error) {
-        if (error instanceof OpenGeniApiContractMismatchError) {
+        if (strictContract && error instanceof OpenGeniApiContractMismatchError) {
           setContractMismatch(error);
           reloadForContractMismatchOnce(error);
         }
@@ -230,7 +273,14 @@ export function OpenGeniProvider({
       }
     })();
     return () => controller.abort();
-  }, [client, pageLive, supportsWorkspaceLiveStream, verifyApiContract, workspaceId]);
+  }, [
+    client,
+    pageLive,
+    strictContract,
+    supportsWorkspaceLiveStream,
+    verifyApiContract,
+    workspaceId,
+  ]);
 
   useEffect(() => {
     if (supportsWorkspaceLiveStream) return;
@@ -265,7 +315,7 @@ export function OpenGeniProvider({
           interactionCallbackRef.current?.(event);
         }
       } catch (error) {
-        if (error instanceof OpenGeniApiContractMismatchError) {
+        if (strictContract && error instanceof OpenGeniApiContractMismatchError) {
           setContractMismatch(error);
           reloadForContractMismatchOnce(error);
         }
@@ -273,7 +323,14 @@ export function OpenGeniProvider({
       }
     })();
     return () => controller.abort();
-  }, [client, pageLive, supportsWorkspaceLiveStream, verifyApiContract, workspaceId]);
+  }, [
+    client,
+    pageLive,
+    strictContract,
+    supportsWorkspaceLiveStream,
+    verifyApiContract,
+    workspaceId,
+  ]);
 
   const value = useMemo(
     () => ({
@@ -298,10 +355,12 @@ export function OpenGeniProvider({
     ],
   );
   return (
-    <OpenGeniContext.Provider value={value}>
-      {children}
-      {contractMismatch ? <ApiContractMismatchScreen mismatch={contractMismatch} /> : null}
-    </OpenGeniContext.Provider>
+    <ErrorMessageContext.Provider value={formatError}>
+      <OpenGeniContext.Provider value={value}>
+        {children}
+        {contractMismatch ? <ApiContractMismatchScreen mismatch={contractMismatch} /> : null}
+      </OpenGeniContext.Provider>
+    </ErrorMessageContext.Provider>
   );
 }
 
@@ -329,7 +388,7 @@ function ApiContractMismatchScreen({ mismatch }: { mismatch: OpenGeniApiContract
       data-opengeni-api-contract-mismatch
     >
       <div className="w-full max-w-md rounded-xl border border-og-border bg-og-surface p-6 shadow-2xl">
-        <p className="text-og-menu font-semibold text-og-fg">OpenGeni updated</p>
+        <p className="text-og-menu font-semibold text-og-fg">Opengeni updated</p>
         <p className="mt-2 text-og-menu leading-6 text-og-muted">
           This tab cannot safely continue with the new server version. Reload it before sending or
           controlling work.
@@ -339,7 +398,7 @@ function ApiContractMismatchScreen({ mismatch }: { mismatch: OpenGeniApiContract
         </p>
         <button
           type="button"
-          className="mt-5 inline-flex h-9 items-center rounded-md bg-og-fg px-3 text-og-menu font-medium text-og-bg"
+          className="mt-5 inline-flex h-9 items-center rounded-md border border-og-primary-border bg-og-primary text-og-primary-fg hover:bg-og-primary-hover px-3 text-og-menu font-medium"
           onClick={() => window.location.reload()}
         >
           Reload now