@opengeni/react 7.4.0-canary.36844267522001 → 7.4.0

package/src/components/artifacts/chat-interactive-block.tsx

@@ -1,260 +0,0 @@
-import type { OpenGeniClient, ToolGatewayIdentity } from "@opengeni/sdk";
-import { useEffect, useMemo, useState } from "react";
-
-import { loadSiteSnapshot } from "../../sites-ui";
-import { useOpenGeniLinkResolver } from "../open-geni-links";
-import {
-  ArtifactButton,
-  ArtifactLabelsProvider,
-  ArtifactSelect,
-  useArtifactLabels,
-  type ArtifactLabels,
-} from "./artifact-chrome";
-import { ArtifactSandbox } from "./artifact-sandbox";
-import { DeferredChatMedia } from "./deferred-chat-media";
-import { inlineHtmlDocument } from "./inline-html-document";
-import type { PublishedHtmlArtifactToolBridge } from "./published-html-artifact-frame";
-
-// Fixed chat viewports keep async Site loads and fragment resize messages from
-// moving the conversation. Full-screen remains available for larger content.
-const INLINE_PREVIEW_HEIGHT = 360;
-const SITE_PREVIEW_HEIGHT = 400;
-const PREVIEW_CHROME_HEIGHT = 50;
-
-/** Reads a Site needs to render; the console client, the SDK client, or a proxy. */
-export type SiteSnapshotClient = Pick<
-  OpenGeniClient,
-  "getWorkspaceArtifact" | "getWorkspaceArtifactHtml"
-> &
-  Partial<Pick<OpenGeniClient, "getWorkspaceArtifactContent">>;
-
-/** The exact saved Site a tool bridge is pinned to (absent for inline HTML). */
-export type SiteToolScope = {
-  artifactId: string;
-  siteVersionId: string;
-  requestedTools: readonly ToolGatewayIdentity[];
-};
-
-/** Host-owned Site API access. Omit it and Sites render without workspace tools. */
-export type SiteToolBridgeFactory = (
-  site?: SiteToolScope,
-) => PublishedHtmlArtifactToolBridge | undefined;
-
-export type ChatInteractiveBlockProps = {
-  workspaceId: string;
-  kind: "html" | "site";
-  content: string;
-  client: SiteSnapshotClient;
-  toolBridge?: SiteToolBridgeFactory | undefined;
-  theme?: "light" | "dark" | undefined;
-  /** Translations for the preview's copy; defaults to English. */
-  labels?: Partial<ArtifactLabels> | undefined;
-};
-
-/**
- * Inline preview for an assistant `opengeni-html` or `opengeni-site` fence, as
- * the OpenGeni console renders it. "Open Site" goes through the nearest
- * `resolveLink`, so a host decides where a Site opens.
- */
-export function ChatInteractiveBlock({ labels, ...props }: ChatInteractiveBlockProps) {
-  return (
-    <ArtifactLabelsProvider labels={labels}>
-      <InteractiveBlock {...props} />
-    </ArtifactLabelsProvider>
-  );
-}
-
-function InteractiveBlock(props: ChatInteractiveBlockProps) {
-  const labels = useArtifactLabels();
-  const height =
-    (props.kind === "html" ? INLINE_PREVIEW_HEIGHT : SITE_PREVIEW_HEIGHT) + PREVIEW_CHROME_HEIGHT;
-  return (
-    <DeferredChatMedia
-      key={`${props.workspaceId}:${props.kind}:${props.kind === "site" ? props.content : "inline"}`}
-      height={height}
-      actionLabel={props.kind === "html" ? labels.loadPreview : labels.loadSitePreview}
-    >
-      <div style={{ height }}>
-        <LoadedChatInteractiveBlock {...props} />
-      </div>
-    </DeferredChatMedia>
-  );
-}
-
-function LoadedChatInteractiveBlock(props: ChatInteractiveBlockProps) {
-  const labels = useArtifactLabels();
-  if (props.kind === "html") return <InlineHtml {...props} />;
-  try {
-    const value = JSON.parse(props.content);
-    if (
-      !value ||
-      typeof value.siteId !== "string" ||
-      !/^[0-9a-f-]{36}$/i.test(value.siteId) ||
-      (value.versionId !== undefined &&
-        (typeof value.versionId !== "string" || !/^[0-9a-f-]{36}$/i.test(value.versionId)))
-    )
-      throw new Error("Invalid Site reference");
-    return (
-      <SiteEmbed
-        key={`${props.workspaceId}:${value.siteId}:${value.versionId ?? "current"}`}
-        {...props}
-        siteId={value.siteId}
-        initialVersionId={value.versionId}
-      />
-    );
-  } catch {
-    return <p role="alert">{labels.siteReferenceInvalid}</p>;
-  }
-}
-
-function InlineHtml({ content, toolBridge, theme }: ChatInteractiveBlockProps) {
-  const labels = useArtifactLabels();
-  const html = useMemo(() => inlineHtmlDocument(content), [content]);
-  const bridge = useMemo(() => toolBridge?.(), [toolBridge]);
-  return (
-    <ArtifactSandbox
-      title={labels.preview}
-      showTitle={false}
-      showLiveStatus={false}
-      html={html}
-      toolBridge={bridge}
-      height={INLINE_PREVIEW_HEIGHT}
-      className="h-full"
-      fill
-      theme={theme}
-    />
-  );
-}
-
-function SiteEmbed(
-  props: ChatInteractiveBlockProps & { siteId: string; initialVersionId?: string },
-) {
-  const [versionId, setVersionId] = useState(props.initialVersionId);
-  return (
-    <SiteEmbedContent
-      key={versionId ?? "current"}
-      {...props}
-      versionId={versionId}
-      onVersionChange={setVersionId}
-    />
-  );
-}
-
-function SiteEmbedContent({
-  workspaceId,
-  client,
-  toolBridge,
-  theme,
-  siteId,
-  versionId,
-  onVersionChange,
-}: ChatInteractiveBlockProps & {
-  siteId: string;
-  versionId?: string | undefined;
-  onVersionChange: (id: string) => void;
-}) {
-  const [loaded, setLoaded] = useState<{
-    client: SiteSnapshotClient;
-    snapshot: Awaited<ReturnType<typeof loadSiteSnapshot>>;
-  } | null>(null);
-  const snapshot = loaded?.client === client ? loaded.snapshot : null;
-  const [error, setError] = useState(false);
-  const [retry, setRetry] = useState(0);
-  useEffect(() => {
-    const abort = new AbortController();
-    setError(false);
-    setLoaded(null);
-    void loadSiteSnapshot(client, workspaceId, siteId, {
-      signal: abort.signal,
-      ...(versionId ? { versionId } : {}),
-    })
-      .then((value) => {
-        if (!abort.signal.aborted) setLoaded({ client, snapshot: value });
-      })
-      .catch(() => {
-        if (!abort.signal.aborted) setError(true);
-      });
-    return () => abort.abort();
-  }, [client, workspaceId, siteId, versionId, retry]);
-  const content = snapshot?.content;
-  const bridge = useMemo(
-    () =>
-      content
-        ? toolBridge?.({
-            artifactId: siteId,
-            siteVersionId: content.versionId,
-            requestedTools: content.requestedTools,
-          })
-        : undefined,
-    [toolBridge, siteId, content],
-  );
-  const open = useOpenGeniLinkResolver()?.({ kind: "site", artifactId: siteId, workspaceId });
-  const labels = useArtifactLabels();
-  if (error)
-    return (
-      <p role="alert">
-        {labels.siteLoadFailed}{" "}
-        <ArtifactButton size="sm" onClick={() => setRetry((v) => v + 1)}>
-          {labels.retry}
-        </ArtifactButton>
-      </p>
-    );
-  if (!snapshot) return <p role="status">{labels.loadingSite}</p>;
-  if (!content) return <p>{labels.siteUnpublished}</p>;
-  return (
-    <ArtifactSandbox
-      title={snapshot.detail.artifact.title}
-      html={content.html}
-      toolBridge={bridge}
-      height={SITE_PREVIEW_HEIGHT}
-      className="h-full"
-      fill
-      theme={theme}
-      headerControls={
-        <>
-          {/* One published version has nothing to choose; keep the bar for the title. */}
-          {snapshot.detail.versions.length > 1 ||
-          !snapshot.detail.versions.some((v) => v.id === content.versionId) ? (
-            <ArtifactSelect
-              aria-label={labels.siteVersion}
-              className="bg-transparent text-xs"
-              value={content.versionId}
-              onChange={(e) => onVersionChange(e.target.value)}
-            >
-              {!snapshot.detail.versions.some((v) => v.id === content.versionId) && (
-                <option value={content.versionId}>{labels.savedVersion}</option>
-              )}
-              {snapshot.detail.versions.map((v) => (
-                <option key={v.id} value={v.id}>
-                  {labels.version(v.revision)}
-                </option>
-              ))}
-            </ArtifactSelect>
-          ) : null}
-          {open?.href ? (
-            <a
-              className="shrink-0 whitespace-nowrap text-xs underline"
-              href={open.href}
-              data-og-open-site=""
-            >
-              {labels.openSite}
-            </a>
-          ) : open?.open ? (
-            <button
-              type="button"
-              className="shrink-0 cursor-pointer whitespace-nowrap text-xs underline"
-              data-og-open-site=""
-              onClick={() =>
-                void Promise.resolve()
-                  .then(open.open)
-                  .catch(() => undefined)
-              }
-            >
-              {labels.openSite}
-            </button>
-          ) : null}
-        </>
-      }
-    />
-  );
-}

package/src/components/artifacts/deferred-chat-media.tsx

@@ -1,67 +0,0 @@
-import { useEffect, useRef, useState, type ReactNode } from "react";
-
-/**
- * Reserve the chat slot before starting expensive media work. Activation is
- * one-way: scrolling away must not discard an interactive preview's state.
- * The timeline parks at its initial tip in layout effects before this observer
- * is attached, so historical previews above the entry viewport stay dormant.
- */
-export function DeferredChatMedia({
-  children,
-  height,
-  label,
-  actionLabel,
-}: {
-  children: ReactNode;
-  height: number;
-  /** What is loading, as in "Load {label}". */
-  label?: string | undefined;
-  /** The complete (translated) activation label; overrides `label`. */
-  actionLabel?: string | undefined;
-}) {
-  const host = useRef<HTMLDivElement>(null);
-  const [active, setActive] = useState(false);
-  useEffect(() => {
-    const node = host.current;
-    if (active || !node) return;
-    if (typeof IntersectionObserver === "undefined") {
-      setActive(true);
-      return;
-    }
-    let disposed = false;
-    const observer = new IntersectionObserver(
-      (entries) => {
-        if (disposed || !entries.some((entry) => entry.isIntersecting)) return;
-        setActive(true);
-        observer.disconnect();
-      },
-      {
-        root: node.closest("[data-og-timeline-scroller]"),
-        rootMargin: "200px 0px",
-      },
-    );
-    observer.observe(node);
-    return () => {
-      disposed = true;
-      observer.disconnect();
-    };
-  }, [active]);
-
-  return (
-    <div ref={host} data-chat-media={active ? "active" : "deferred"}>
-      {active ? (
-        children
-      ) : (
-        <div className="flex w-full items-center justify-center" style={{ height }}>
-          <button
-            type="button"
-            className="rounded-md px-3 py-2 text-sm text-fg-muted hover:text-fg focus-visible:outline-2 focus-visible:outline-ring"
-            onClick={() => setActive(true)}
-          >
-            {actionLabel ?? `Load ${label ?? "media"}`}
-          </button>
-        </div>
-      )}
-    </div>
-  );
-}

package/src/components/artifacts/editable-artifact-view.tsx

@@ -1,187 +0,0 @@
-import type { EditableArtifactResource } from "@opengeni/sdk/artifacts";
-import {
-  createBrowserEditableArtifactSession,
-  type CreateBrowserEditableArtifactSessionOptions,
-  type EditableArtifactBrowserRuntime,
-  type EditableArtifactCacheAuthority,
-  type EditableArtifactModality,
-} from "@opengeni/sdk/editable-artifacts";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-
-import {
-  ArtifactLoading,
-  ArtifactProblem,
-  artifactLoadErrorView,
-  useArtifactLabels,
-  type ArtifactLoadErrorView,
-} from "./artifact-chrome";
-import { EditableArtifactWorkbenchHost } from "./editable-artifact-workbench";
-
-/**
- * The browser kernels an editor needs, one per modality, plus the host-built
- * Worker URL (for Vite: `@opengeni/sdk/editable-artifacts/worker?worker&url`).
- * Kernels come from `@opengeni/artifact-kernel-wasm-{document,spreadsheet,presentation}`.
- */
-export type EditableArtifactRuntimes = Readonly<{
-  document: Omit<EditableArtifactBrowserRuntime, "workerUrl" | "workerFactory">;
-  spreadsheet: Omit<EditableArtifactBrowserRuntime, "workerUrl" | "workerFactory">;
-  presentation: Omit<EditableArtifactBrowserRuntime, "workerUrl" | "workerFactory">;
-  workerUrl: string;
-  applicationOrigin?: string | undefined;
-  /** Loopback development only. */
-  allowInsecureDevelopmentAssets?: boolean | undefined;
-}>;
-
-/** Everything needed to open one artifact for the current principal. */
-export type OpenedEditableArtifact = Readonly<{
-  artifact: EditableArtifactResource;
-  authority: EditableArtifactCacheAuthority;
-  replicaId: string;
-}>;
-
-export type EditableArtifactViewProps = Readonly<{
-  /** Absolute API (or session proxy) base the live transport talks to. */
-  baseUrl: URL;
-  workspaceId: string;
-  artifactId: string;
-  /** Resolve metadata, cache authority, and replica; called again on retry. */
-  open: (signal: AbortSignal) => Promise<OpenedEditableArtifact>;
-  runtimes: EditableArtifactRuntimes;
-  transport?: CreateBrowserEditableArtifactSessionOptions["transport"];
-  /** Show the editor's own title header (hosts with their own header hide it). */
-  showHeader?: boolean | undefined;
-  /** Re-open when this changes (for example the host's credential version). */
-  authorityKey?: string | undefined;
-  describeError?: ((error: unknown) => ArtifactLoadErrorView) | undefined;
-  onTitle?: ((title: string) => void) | undefined;
-  /** Loading copy; defaults to the `opening` label. */
-  loadingLabel?: string | undefined;
-}>;
-
-type LoadState =
-  | Readonly<{ key: string | null; kind: "loading" }>
-  | Readonly<{ key: string; kind: "ready"; value: OpenedEditableArtifact }>
-  | Readonly<{ key: string; kind: "error"; error: unknown }>;
-
-/**
- * One editable document, spreadsheet, or presentation with its first-party
- * editor. The console dock/page and embedding hosts supply only data access.
- */
-export function EditableArtifactView({
-  baseUrl,
-  workspaceId,
-  artifactId,
-  open,
-  runtimes,
-  transport,
-  showHeader = true,
-  authorityKey,
-  describeError,
-  onTitle,
-  loadingLabel,
-}: EditableArtifactViewProps) {
-  const [loadEpoch, setLoadEpoch] = useState(0);
-  const labels = useArtifactLabels();
-  const loadKey = JSON.stringify([artifactId, authorityKey, baseUrl.href, workspaceId, loadEpoch]);
-  const [state, setState] = useState<LoadState>({ key: null, kind: "loading" });
-  const current = state.key === loadKey ? state : null;
-  const openRef = useRef(open);
-  openRef.current = open;
-  const onTitleRef = useRef(onTitle);
-  onTitleRef.current = onTitle;
-  useEffect(() => {
-    const abort = new AbortController();
-    setState({ key: loadKey, kind: "loading" });
-    void openRef
-      .current(abort.signal)
-      .then((value) => {
-        if (abort.signal.aborted) return;
-        setState({ key: loadKey, kind: "ready", value });
-        onTitleRef.current?.(value.artifact.title);
-      })
-      .catch((error: unknown) => {
-        if (!abort.signal.aborted) setState({ key: loadKey, kind: "error", error });
-      });
-    return () => abort.abort();
-  }, [loadKey]);
-
-  const ready = current?.kind === "ready" ? current.value : null;
-  const transportRef = useRef(transport);
-  transportRef.current = transport;
-  const sessionKey = useMemo(
-    () =>
-      ready
-        ? JSON.stringify({
-            baseUrl: baseUrl.href,
-            authorityKey,
-            workspaceId,
-            artifact: { id: ready.artifact.id, modality: ready.artifact.modality },
-            authority: ready.authority,
-            replicaId: ready.replicaId,
-            workerUrl: runtimes.workerUrl,
-          })
-        : "",
-    [authorityKey, baseUrl.href, ready, runtimes.workerUrl, workspaceId],
-  );
-  const createSession = useCallback(() => {
-    if (!ready) throw new Error("Artifact is not open");
-    return createBrowserEditableArtifactSession({
-      baseUrl,
-      workspaceId,
-      artifact: ready.artifact,
-      storageAuthority: ready.authority,
-      replicaId: ready.replicaId,
-      runtime: {
-        ...runtimeFor(runtimes, ready.artifact.modality),
-        workerUrl: runtimes.workerUrl,
-        ...(runtimes.applicationOrigin ? { applicationOrigin: runtimes.applicationOrigin } : {}),
-        ...(runtimes.allowInsecureDevelopmentAssets
-          ? { allowInsecureDevelopmentAssets: true }
-          : {}),
-      },
-      ...(transportRef.current ? { transport: transportRef.current } : {}),
-    });
-  }, [baseUrl, ready, runtimes, workspaceId]);
-
-  if (!current || current.kind === "loading")
-    return <ArtifactLoading label={loadingLabel ?? labels.opening} />;
-  if (current.kind === "error") {
-    return (
-      <ArtifactProblem
-        view={
-          describeError
-            ? describeError(current.error)
-            : artifactLoadErrorView(current.error, "editable", labels)
-        }
-        onRetry={() => setLoadEpoch((value) => value + 1)}
-      />
-    );
-  }
-  const { artifact } = current.value;
-  const surface = { title: artifact.title, showHeader };
-  return (
-    <div className="h-full min-h-0 bg-og-bg text-og-fg">
-      <EditableArtifactWorkbenchHost
-        sessionKey={sessionKey}
-        createSession={createSession}
-        document={surface}
-        spreadsheet={surface}
-        presentation={surface}
-      />
-    </div>
-  );
-}
-
-function runtimeFor(
-  runtimes: EditableArtifactRuntimes,
-  modality: EditableArtifactModality,
-): Omit<EditableArtifactBrowserRuntime, "workerUrl" | "workerFactory"> {
-  switch (modality) {
-    case "document":
-      return runtimes.document;
-    case "spreadsheet":
-      return runtimes.spreadsheet;
-    case "presentation":
-      return runtimes.presentation;
-  }
-}

package/src/components/artifacts/latest-task-runner.ts

@@ -1,49 +0,0 @@
-import { useRef } from "react";
-
-/**
- * Runs one task at a time; a task scheduled while another runs replaces any
- * task still waiting, so only the newest request starts next. Editors use it
- * for projection loads: replaying a long history emits one revision per
- * committed transaction, and composing a projection for each of them at once
- * would overrun the artifact Worker's bounded request queue.
- */
-export function createLatestTaskRunner(): (task: () => Promise<void>) => void {
-  let running = false;
-  let waiting: (() => Promise<void>) | null = null;
-  const drain = async () => {
-    running = true;
-    try {
-      while (waiting) {
-        const task = waiting;
-        waiting = null;
-        try {
-          await task();
-        } catch {
-          // Tasks settle their own errors; one failure must not stall the next.
-        }
-      }
-    } finally {
-      running = false;
-    }
-  };
-  return (task) => {
-    waiting = task;
-    if (!running) void drain();
-  };
-}
-
-/**
- * One runner per artifact session. A composition still pending on a replaced
- * session (for example one whose Worker stopped answering) must never hold up
- * the next session's first load, so the runner is scoped to the session object
- * rather than to the component.
- */
-export function useLatestTaskRunner(session: object): (task: () => Promise<void>) => void {
-  const runner = useRef<{ session: object; schedule: (task: () => Promise<void>) => void } | null>(
-    null,
-  );
-  if (runner.current?.session !== session) {
-    runner.current = { session, schedule: createLatestTaskRunner() };
-  }
-  return runner.current.schedule;
-}