@opengeni/react 6.0.0-canary.1 → 6.1.0

package/dist/components/message-timeline.d.ts

@@ -98,8 +98,8 @@ export type MessageTimelineProps = {
     hasNewer?: boolean | undefined;
     /** A newer history page is being fetched. */
     loadingNewer?: boolean | undefined;
-    /** Page forward through history without loading the whole gap to the tip. */
-    onLoadNewer?: (() => void) | undefined;
+    /** Page forward through history. Return the request promise to enable inline error/retry. */
+    onLoadNewer?: (() => unknown) | undefined;
     /**
      * Reload the live tip window. When omitted, Jump to latest only re-pins and
      * scrolls the in-memory window.

package/dist/index.js

@@ -108,7 +108,7 @@ import {
   useWorkspaceModelCatalog,
   userMessageLikelyNeedsDisclosure,
   v4aToGitFileDiff
-} from "./chunk-CC7AVRIJ.js";
+} from "./chunk-TDSEILUH.js";
 import "./chunk-YBM6CQRU.js";
 import "./chunk-5M6VTFJ5.js";
 import "./chunk-ZYRGEKWS.js";
@@ -219,7 +219,7 @@ import {
   useSession,
   useSessionEvents,
   useTurnQueue
-} from "./chunk-PZ27MCZP.js";
+} from "./chunk-L2NBTKRX.js";
 import {
   FILE_ONLY_MESSAGE_TEXT,
   composeSendInput,

package/dist/session-ui.js

@@ -18,7 +18,7 @@ import {
   setStartupDetails,
   useStartupDetails,
   userMessageLikelyNeedsDisclosure
-} from "./chunk-CC7AVRIJ.js";
+} from "./chunk-TDSEILUH.js";
 import "./chunk-YBM6CQRU.js";
 import "./chunk-5M6VTFJ5.js";
 import "./chunk-ZYRGEKWS.js";
@@ -33,7 +33,7 @@ import "./chunk-R4KRSFGA.js";
 import "./chunk-VZTQ73XT.js";
 import {
   createOlderHistoryLoadReceipt
-} from "./chunk-PZ27MCZP.js";
+} from "./chunk-L2NBTKRX.js";
 import "./chunk-NYESIADM.js";
 import "./chunk-PLYRL5ER.js";
 import "./chunk-KZ73RL76.js";

package/dist/session.js

@@ -28,7 +28,7 @@ import {
   useSession,
   useSessionEvents,
   useTurnQueue
-} from "./chunk-PZ27MCZP.js";
+} from "./chunk-L2NBTKRX.js";
 import {
   FILE_ONLY_MESSAGE_TEXT,
   composeSendInput,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeni/react",
-  "version": "6.0.0-canary.1",
+  "version": "6.1.0",
   "description": "React hooks and styled components for OpenGeni: live session streaming, chat composer, message timeline, session status, and fleet views — token-themed (CSS variables), dark-first, built on Tailwind v4 + Radix + Motion.",
   "license": "Apache-2.0",
   "repository": {
@@ -133,8 +133,8 @@
     "@dnd-kit/utilities": "3.2.2",
     "@fontsource-variable/noto-sans-arabic": "5.2.10",
     "@fontsource-variable/noto-sans-jp": "5.2.10",
-    "@opengeni/connect": "^0.2.0-canary.10",
-    "@opengeni/sdk": "^6.0.0-canary.1",
+    "@opengeni/connect": "^0.2.0",
+    "@opengeni/sdk": "^6.1.0",
     "clsx": "^2.1.1",
     "dequal": "2.0.3",
     "lucide-react": "^1.8.0",

package/src/components/message-timeline.tsx

@@ -229,8 +229,8 @@ export type MessageTimelineProps = {
   hasNewer?: boolean | undefined;
   /** A newer history page is being fetched. */
   loadingNewer?: boolean | undefined;
-  /** Page forward through history without loading the whole gap to the tip. */
-  onLoadNewer?: (() => void) | undefined;
+  /** Page forward through history. Return the request promise to enable inline error/retry. */
+  onLoadNewer?: (() => unknown) | undefined;
   /**
    * Reload the live tip window. When omitted, Jump to latest only re-pins and
    * scrolls the in-memory window.
@@ -461,6 +461,67 @@ export function MessageTimeline({
   // can acquire a different first-delta id when older text arrives).
   const sourceItems = events ?? items;
   const olderBoundaryKey = sourceItems?.[0]?.id;
+  const newerBoundaryKey = `${events?.[0]?.sessionId ?? ""}:${olderBoundaryKey ?? ""}`;
+  const newerScopeRef = useRef(newerBoundaryKey);
+  newerScopeRef.current = newerBoundaryKey;
+  const newerAttemptRef = useRef<{ pending: boolean } | null>(null);
+  const newerRetryButtonRef = useRef<HTMLButtonElement | null>(null);
+  const [newerRetryPending, setNewerRetryPending] = useState(false);
+  const [newerFailure, setNewerFailure] = useState<{ key: string; message: string } | null>(null);
+  useEffect(() => {
+    newerScopeRef.current = newerBoundaryKey;
+    newerAttemptRef.current = null;
+    setNewerFailure(null);
+    setNewerRetryPending(false);
+    return () => {
+      newerScopeRef.current = "";
+      newerAttemptRef.current = null;
+    };
+  }, [newerBoundaryKey]);
+  const requestNewer = useCallback(
+    (explicitRetry = false) => {
+      if (
+        newerScopeRef.current !== newerBoundaryKey ||
+        !onLoadNewer ||
+        loadingNewer ||
+        (newerAttemptRef.current && (!explicitRetry || newerAttemptRef.current.pending))
+      ) {
+        return;
+      }
+      const attempt = { pending: true };
+      newerAttemptRef.current = attempt;
+      if (explicitRetry) setNewerRetryPending(true);
+      const isCurrent = () =>
+        newerAttemptRef.current === attempt && newerScopeRef.current === newerBoundaryKey;
+      // Both synchronous host errors and rejected promises belong to this
+      // boundary. Retain the failed attempt so observers cannot hot-retry it.
+      void Promise.resolve()
+        .then(() => (isCurrent() ? onLoadNewer() : undefined))
+        .then(
+          () => {
+            if (!isCurrent()) return;
+            newerAttemptRef.current = null;
+            // The successful page removes the recovery control. Return focus
+            // to the reading surface without moving the reader's viewport.
+            if (document.activeElement === newerRetryButtonRef.current) {
+              scrollRef.current?.focus({ preventScroll: true });
+            }
+            setNewerFailure(null);
+            setNewerRetryPending(false);
+          },
+          (reason: unknown) => {
+            if (!isCurrent()) return;
+            attempt.pending = false;
+            setNewerRetryPending(false);
+            setNewerFailure({
+              key: newerBoundaryKey,
+              message: reason instanceof Error ? reason.message : String(reason),
+            });
+          },
+        );
+    },
+    [onLoadNewer, loadingNewer, newerBoundaryKey],
+  );
   const previousSourceIdsRef = useRef(new Set<string>());
   const previousSourceBoundaryRef = useRef<string | undefined>(undefined);
   const readingAnchorRef = useRef<TimelineAnchor | null>(null);
@@ -1586,14 +1647,14 @@ export function MessageTimeline({
         // An underfilled history window has both sentinels visible. Advancing
         // it automatically would undo an explicit older-page navigation.
         if (maxScrollOf(root) > 1 && entries.some((entry) => entry.isIntersecting)) {
-          onLoadNewer();
+          requestNewer();
         }
       },
       { root, rootMargin: "0px 0px 1200px 0px" },
     );
     observer.observe(target);
     return () => observer.disconnect();
-  }, [hasNewer, loadingNewer, onLoadNewer, firstGroupKey]);
+  }, [hasNewer, loadingNewer, onLoadNewer, requestNewer, firstGroupKey]);
 
   // Late layout that React commits cannot see (images decoding, fonts, code
   // blocks) grows content without a commit. While pinned, soft-follow the tip;
@@ -2061,6 +2122,29 @@ export function MessageTimeline({
                           {groups.length > 0 && trailingState ? (
                             <div data-og-timeline-trailing-state="">{trailingState}</div>
                           ) : null}
+                          {hasNewer && newerFailure?.key === newerBoundaryKey ? (
+                            <div
+                              data-og-newer-error=""
+                              className="flex flex-col items-center gap-2 px-4 py-3 text-center text-og-menu text-og-fg-muted"
+                            >
+                              <p role="status" className="max-w-prose [overflow-wrap:anywhere]">
+                                Couldn’t load later activity. {newerFailure.message}
+                              </p>
+                              <button
+                                ref={newerRetryButtonRef}
+                                type="button"
+                                data-og-retry-newer=""
+                                className="min-h-11 rounded-og-md border border-og-border px-3 py-2 text-og-fg hover:bg-og-surface-2 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-og-accent"
+                                aria-disabled={loadingNewer || newerRetryPending}
+                                aria-busy={newerRetryPending}
+                                onClick={() => requestNewer(true)}
+                              >
+                                {newerRetryPending
+                                  ? "Retrying later activity…"
+                                  : "Retry later activity"}
+                              </button>
+                            </div>
+                          ) : null}
                           {hasNewer ? (
                             <div
                               ref={bottomSentinelRef}

package/src/components/session-conversation.tsx

@@ -84,9 +84,7 @@ function Conversation({
         onLoadOlder={feed.loadOlder}
         hasNewer={feed.hasNewer}
         loadingNewer={feed.loadingNewer}
-        onLoadNewer={() => {
-          void feed.loadNewer();
-        }}
+        onLoadNewer={feed.loadNewer}
         onJumpToStart={async () => {
           await feed.loadOldest();
         }}

package/src/hooks/use-session-events.ts

@@ -140,6 +140,7 @@ export function useSessionEvents(
   const [eventWindow, setEventWindow] = useState<BrowserSessionEventWindow>(EMPTY_EVENT_WINDOW);
   const [connectionState, setConnectionState] = useState<SessionEventsConnectionState>("idle");
   const [error, setError] = useState<Error | null>(null);
+  const [newerError, setNewerError] = useState<Error | null>(null);
   const [hasOlder, setHasOlder] = useState(false);
   const [hasNewer, setHasNewer] = useState(false);
   const [sessionStatusProjection, setSessionStatusProjection] = useState<SessionStatus | null>(
@@ -186,6 +187,7 @@ export function useSessionEvents(
   // Navigation belongs to the session/client lifetime, not the transport.
   useEffect(() => {
     navigationGenerationRef.current += 1;
+    setNewerError(null);
     loadingOlderRef.current = false;
     loadingNewerRef.current = false;
     loadingOldestRef.current = false;
@@ -691,6 +693,7 @@ export function useSessionEvents(
       initialWindowLoadedRef.current = true;
       viewModeRef.current = "history";
       loadingOldestRef.current = false;
+      setNewerError(null);
       startTransition(() => {
         if (status !== undefined) {
           setSessionStatusProjection(status);
@@ -736,6 +739,7 @@ export function useSessionEvents(
         return false;
       }
       if (window.events.length === 0) {
+        setNewerError(null);
         hasNewerRef.current = false;
         setHasNewer(false);
         // Caught up with durable history — resume the live tip stream.
@@ -788,6 +792,7 @@ export function useSessionEvents(
         resumeLive = true;
       }
       loadingNewerRef.current = false;
+      setNewerError(null);
       startTransition(() => {
         if (status !== undefined) {
           setSessionStatusProjection(status);
@@ -803,6 +808,16 @@ export function useSessionEvents(
       });
       published = true;
       return newer;
+    } catch (reason) {
+      // A settled request from an old navigation lifetime is not a failure of
+      // the current session. Preserve current loading/error state as well.
+      if (navigationGenerationRef.current !== generation) {
+        return false;
+      }
+      setNewerError(reason instanceof Error ? reason : new Error(String(reason)));
+      // Keep authorization and integrity failures actionable for callers;
+      // timeline-owned invocations attach their own explicit recovery UI.
+      throw reason;
     } finally {
       if (!published && navigationGenerationRef.current === generation) {
         loadingNewerRef.current = false;
@@ -817,6 +832,7 @@ export function useSessionEvents(
     }
     loadingLatestRef.current = true;
     setLoadingLatest(true);
+    setNewerError(null);
     let published = false;
     try {
       streamAbortRef.current?.abort();
@@ -873,7 +889,7 @@ export function useSessionEvents(
     loadOldest,
     loadingLatest: !identityMatches ? false : loadingLatest,
     jumpToLatest,
-    error: identityMatches ? error : null,
+    error: identityMatches ? (newerError ?? error) : null,
   };
 }
 

package/styles/compiled.css

@@ -1785,6 +1785,9 @@
 :where(.og-root).max-w-md,:where(.og-root) .max-w-md {
     max-width: var(--container-md);
   }
+:where(.og-root).max-w-prose,:where(.og-root) .max-w-prose {
+    max-width: 65ch;
+  }
 :where(.og-root).max-w-sm,:where(.og-root) .max-w-sm {
     max-width: var(--container-sm);
   }