@opengeni/react 5.0.4 → 5.0.5-canary.1

package/dist/plugin-details.d.ts

@@ -0,0 +1,14 @@
+import { type PluginDiscoveryItem } from "@opengeni/sdk";
+/** Embeddable plugin overview. Hosts own the dialog and installation actions. */
+export declare function PluginDetails({ item, onInstall, busy, installed, error, connections, onConnect, }: {
+    item: PluginDiscoveryItem;
+    onInstall?: () => void;
+    busy?: boolean;
+    installed?: boolean;
+    error?: string | null;
+    connections?: Record<string, boolean>;
+    onConnect?: (server: {
+        name: string;
+        endpoint: string | null;
+    }) => void;
+}): import("react").JSX.Element;

package/dist/plugin-discovery.d.ts

@@ -0,0 +1,14 @@
+import type { PluginDiscoveryItem, PluginDiscoveryPage } from "@opengeni/sdk";
+export type PluginDiscoveryProps = {
+    client: {
+        discoverPlugins(workspaceId: string, options?: {
+            query?: string;
+            provider?: string;
+            offset?: number;
+        }): Promise<PluginDiscoveryPage>;
+    };
+    workspaceId: string;
+    query: string;
+    onOpen: (item: PluginDiscoveryItem) => void;
+};
+export declare function PluginDiscovery(props: PluginDiscoveryProps): import("react").JSX.Element;

package/dist/session-ui.d.ts

@@ -19,3 +19,6 @@ export type { QueueSurfaceProps } from "./components/queue-surface.js";
 export { SessionChrome, sessionChromeGoalPillExplanation, sessionChromeGoalPillLabel, sessionChromeGoalPillState, } from "./components/session-chrome.js";
 export type { SessionChromeAgentsSignal, SessionChromeProps, SessionChromeSignalId, SessionChromeSignalTone, } from "./components/session-chrome.js";
 export { SessionCommandsPanel } from "./components/session-commands-panel.js";
+export { StartupTimings } from "./timeline/startup-timings.js";
+export { useStartupDetails, setStartupDetails } from "./timeline/startup-preference.js";
+export type { GenieLoadingOptions } from "./timeline/genie-loading.js";

package/dist/session-ui.js

@@ -13,15 +13,19 @@ import {
   sessionChromeGoalPillExplanation,
   sessionChromeGoalPillLabel,
   sessionChromeGoalPillState,
+  setStartupDetails,
+  useStartupDetails,
   userMessageLikelyNeedsDisclosure
-} from "./chunk-SCZ6SUBW.js";
+} from "./chunk-H63SQTGI.js";
 import "./chunk-YBM6CQRU.js";
 import "./chunk-5M6VTFJ5.js";
 import "./chunk-ZYRGEKWS.js";
 import "./chunk-NOSYBS2D.js";
 import "./chunk-PAJU5KKL.js";
+import "./chunk-M2HNWZYR.js";
 import "./chunk-JVYQRRC4.js";
-import "./chunk-Z7WBDB4E.js";
+import "./chunk-V3WX3TQG.js";
+import "./chunk-HQV2I5HV.js";
 import "./chunk-R4KRSFGA.js";
 import "./chunk-VZTQ73XT.js";
 import {
@@ -33,6 +37,110 @@ import "./chunk-KZ73RL76.js";
 import "./chunk-NEXLLTP4.js";
 import "./chunk-VRBL3F5E.js";
 import "./chunk-22KP6LR5.js";
+
+// src/timeline/startup-timings.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var LABELS = {
+  queue: "Worker queue",
+  sandbox: "Sandbox",
+  rig: "Rig",
+  repository: "Repository",
+  files: "Files",
+  tools: "Tools",
+  model_preparation: "Runtime & model request",
+  provider_first_byte: "First model response"
+};
+function StartupTimings({ phases }) {
+  if (!phases.length)
+    return /* @__PURE__ */ jsx("p", { className: "text-og-sm text-og-fg-subtle", children: "No startup timings recorded yet." });
+  const byTurn = /* @__PURE__ */ new Map();
+  for (const phase of phases) {
+    const group = byTurn.get(phase.turnId) ?? [];
+    group.push(phase);
+    byTurn.set(phase.turnId, group);
+  }
+  const turns = [...byTurn.entries()].map(([turnId, turnPhases]) => ({
+    turnId,
+    phases: turnPhases,
+    startedAt: turnPhases.reduce(
+      (earliest, phase) => phase.startedAt < earliest ? phase.startedAt : earliest,
+      turnPhases[0].startedAt
+    )
+  })).sort((a, b) => b.startedAt.localeCompare(a.startedAt));
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
+    /* @__PURE__ */ jsx("p", { className: "text-og-xs text-og-fg-subtle", children: "Each turn has its own startup. Phases can overlap; durations are not additive." }),
+    turns.map((turn, index) => /* @__PURE__ */ jsx(
+      StartupTurn,
+      {
+        ...turn,
+        latest: index === 0 && turn.turnId !== null
+      },
+      turn.turnId ?? "unassigned"
+    ))
+  ] });
+}
+function StartupTurn({
+  turnId,
+  phases,
+  startedAt,
+  latest
+}) {
+  const status = phases.some((phase) => phase.status === "failed") ? "Failed" : phases.some((phase) => phase.status === "running") ? "In progress" : phases.some((phase) => phase.status === "cancelled") ? "Interrupted" : "Ready";
+  return /* @__PURE__ */ jsxs("details", { open: latest, className: "group border-b border-og-border pb-3", children: [
+    /* @__PURE__ */ jsxs("summary", { className: "cursor-pointer rounded py-3 text-og-sm text-og-fg-muted focus-visible:outline-2 focus-visible:outline-og-accent", children: [
+      /* @__PURE__ */ jsx("span", { className: "font-medium", children: turnId === null ? "Unassigned events" : latest ? "Latest turn" : "Earlier turn" }),
+      /* @__PURE__ */ jsx("span", { className: "ml-2 text-og-xs text-og-fg-subtle", children: new Date(startedAt).toLocaleTimeString([], {
+        hour: "2-digit",
+        minute: "2-digit",
+        second: "2-digit"
+      }) }),
+      /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: status === "Failed" ? "ml-2 text-og-xs text-og-status-failed" : "ml-2 text-og-xs text-og-fg-subtle",
+          children: status
+        }
+      ),
+      /* @__PURE__ */ jsx("span", { className: "mt-1 block break-all pl-4 font-og-mono text-og-xs text-og-fg-subtle", children: turnId ?? "No turn ID recorded" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "pb-2", children: [
+      /* @__PURE__ */ jsxs("p", { className: "text-og-xs text-og-fg-subtle", children: [
+        "Started ",
+        /* @__PURE__ */ jsx("time", { dateTime: startedAt, children: new Date(startedAt).toLocaleString() })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "overflow-x-auto", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-left text-og-xs", children: [
+        /* @__PURE__ */ jsxs("caption", { className: "sr-only", children: [
+          "Startup phases for ",
+          turnId ?? "unassigned events"
+        ] }),
+        /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-og-border text-og-fg-subtle", children: [
+          /* @__PURE__ */ jsx("th", { scope: "col", className: "py-2 font-medium", children: "Phase" }),
+          /* @__PURE__ */ jsx("th", { scope: "col", className: "px-3 py-2 font-medium", children: "Status" }),
+          /* @__PURE__ */ jsx("th", { scope: "col", className: "py-2 text-right font-medium", children: "Duration" })
+        ] }) }),
+        /* @__PURE__ */ jsx("tbody", { children: phases.map((phase) => /* @__PURE__ */ jsxs(
+          "tr",
+          {
+            className: "border-b border-og-border/40",
+            title: `Turn: ${phase.turnId ?? "unknown"} \xB7 Started: ${phase.startedAt}`,
+            children: [
+              /* @__PURE__ */ jsx("th", { scope: "row", className: "py-2.5 font-normal text-og-fg-muted", children: LABELS[phase.phase] }),
+              /* @__PURE__ */ jsx(
+                "td",
+                {
+                  className: `px-3 py-2.5 ${phase.status === "failed" ? "text-og-status-failed" : "text-og-fg-subtle"}`,
+                  children: phase.status === "running" ? "In progress" : phase.status
+                }
+              ),
+              /* @__PURE__ */ jsx("td", { className: "py-2.5 text-right font-og-mono tabular-nums text-og-fg-muted", children: phase.durationMs === null ? "\u2014" : phase.durationMs < 1e3 ? `${Math.round(phase.durationMs)} ms` : `${(phase.durationMs / 1e3).toFixed(1)} s` })
+            ]
+          },
+          phase.id
+        )) })
+      ] }) })
+    ] })
+  ] });
+}
 export {
   ApprovalSurface,
   BUILT_IN_TURN_SUMMARY_FACET_IDS,
@@ -43,12 +151,15 @@ export {
   SessionChrome,
   SessionCommandsPanel,
   SessionConversation,
+  StartupTimings,
   TimelineRow,
   UserMessageBody,
   createOlderHistoryLoadReceipt,
   sessionChromeGoalPillExplanation,
   sessionChromeGoalPillLabel,
   sessionChromeGoalPillState,
+  setStartupDetails,
+  useStartupDetails,
   userMessageLikelyNeedsDisclosure
 };
 //# sourceMappingURL=session-ui.js.map

package/dist/session-ui.js.map

@@ -1 +1 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
+{"version":3,"sources":["../src/timeline/startup-timings.tsx"],"sourcesContent":["import type { StartupPhaseItem } from \"./types\";\n\nconst LABELS: Record<StartupPhaseItem[\"phase\"], string> = {\n  queue: \"Worker queue\",\n  sandbox: \"Sandbox\",\n  rig: \"Rig\",\n  repository: \"Repository\",\n  files: \"Files\",\n  tools: \"Tools\",\n  model_preparation: \"Runtime & model request\",\n  provider_first_byte: \"First model response\",\n};\n\nexport function StartupTimings({ phases }: { phases: StartupPhaseItem[] }) {\n  if (!phases.length)\n    return <p className=\"text-og-sm text-og-fg-subtle\">No startup timings recorded yet.</p>;\n  const byTurn = new Map<string | null, StartupPhaseItem[]>();\n  for (const phase of phases) {\n    const group = byTurn.get(phase.turnId) ?? [];\n    group.push(phase);\n    byTurn.set(phase.turnId, group);\n  }\n  const turns = [...byTurn.entries()]\n    .map(([turnId, turnPhases]) => ({\n      turnId,\n      phases: turnPhases,\n      startedAt: turnPhases.reduce(\n        (earliest, phase) => (phase.startedAt < earliest ? phase.startedAt : earliest),\n        turnPhases[0]!.startedAt,\n      ),\n    }))\n    .sort((a, b) => b.startedAt.localeCompare(a.startedAt));\n  return (\n    <div className=\"space-y-3\">\n      <p className=\"text-og-xs text-og-fg-subtle\">\n        Each turn has its own startup. Phases can overlap; durations are not additive.\n      </p>\n      {turns.map((turn, index) => (\n        <StartupTurn\n          key={turn.turnId ?? \"unassigned\"}\n          {...turn}\n          latest={index === 0 && turn.turnId !== null}\n        />\n      ))}\n    </div>\n  );\n}\n\nfunction StartupTurn({\n  turnId,\n  phases,\n  startedAt,\n  latest,\n}: {\n  turnId: string | null;\n  phases: StartupPhaseItem[];\n  startedAt: string;\n  latest: boolean;\n}) {\n  const status = phases.some((phase) => phase.status === \"failed\")\n    ? \"Failed\"\n    : phases.some((phase) => phase.status === \"running\")\n      ? \"In progress\"\n      : phases.some((phase) => phase.status === \"cancelled\")\n        ? \"Interrupted\"\n        : \"Ready\";\n  return (\n    <details open={latest} className=\"group border-b border-og-border pb-3\">\n      <summary className=\"cursor-pointer rounded py-3 text-og-sm text-og-fg-muted focus-visible:outline-2 focus-visible:outline-og-accent\">\n        <span className=\"font-medium\">\n          {turnId === null ? \"Unassigned events\" : latest ? \"Latest turn\" : \"Earlier turn\"}\n        </span>\n        <span className=\"ml-2 text-og-xs text-og-fg-subtle\">\n          {new Date(startedAt).toLocaleTimeString([], {\n            hour: \"2-digit\",\n            minute: \"2-digit\",\n            second: \"2-digit\",\n          })}\n        </span>\n        <span\n          className={\n            status === \"Failed\"\n              ? \"ml-2 text-og-xs text-og-status-failed\"\n              : \"ml-2 text-og-xs text-og-fg-subtle\"\n          }\n        >\n          {status}\n        </span>\n        <span className=\"mt-1 block break-all pl-4 font-og-mono text-og-xs text-og-fg-subtle\">\n          {turnId ?? \"No turn ID recorded\"}\n        </span>\n      </summary>\n      <div className=\"pb-2\">\n        <p className=\"text-og-xs text-og-fg-subtle\">\n          Started <time dateTime={startedAt}>{new Date(startedAt).toLocaleString()}</time>\n        </p>\n        <div className=\"overflow-x-auto\">\n          <table className=\"w-full text-left text-og-xs\">\n            <caption className=\"sr-only\">\n              Startup phases for {turnId ?? \"unassigned events\"}\n            </caption>\n            <thead>\n              <tr className=\"border-b border-og-border text-og-fg-subtle\">\n                <th scope=\"col\" className=\"py-2 font-medium\">\n                  Phase\n                </th>\n                <th scope=\"col\" className=\"px-3 py-2 font-medium\">\n                  Status\n                </th>\n                <th scope=\"col\" className=\"py-2 text-right font-medium\">\n                  Duration\n                </th>\n              </tr>\n            </thead>\n            <tbody>\n              {phases.map((phase) => (\n                <tr\n                  key={phase.id}\n                  className=\"border-b border-og-border/40\"\n                  title={`Turn: ${phase.turnId ?? \"unknown\"} · Started: ${phase.startedAt}`}\n                >\n                  <th scope=\"row\" className=\"py-2.5 font-normal text-og-fg-muted\">\n                    {LABELS[phase.phase]}\n                  </th>\n                  <td\n                    className={`px-3 py-2.5 ${phase.status === \"failed\" ? \"text-og-status-failed\" : \"text-og-fg-subtle\"}`}\n                  >\n                    {phase.status === \"running\" ? \"In progress\" : phase.status}\n                  </td>\n                  <td className=\"py-2.5 text-right font-og-mono tabular-nums text-og-fg-muted\">\n                    {phase.durationMs === null\n                      ? \"—\"\n                      : phase.durationMs < 1000\n                        ? `${Math.round(phase.durationMs)} ms`\n                        : `${(phase.durationMs / 1000).toFixed(1)} s`}\n                  </td>\n                </tr>\n              ))}\n            </tbody>\n          </table>\n        </div>\n      </div>\n    </details>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/skill-discovery.d.ts

@@ -0,0 +1,29 @@
+export type SkillDiscoveryItem = {
+    id: string;
+    name: string;
+    source: string;
+    installs: number;
+    url: string;
+};
+export type SkillDiscoveryPage = {
+    items: SkillDiscoveryItem[];
+    nextCursor: null;
+};
+export type SkillDiscoveryClient = {
+    searchPublicSkills(workspaceId: string, query: string): Promise<SkillDiscoveryPage>;
+};
+export type SkillDiscoveryProps = {
+    installedSkills?: readonly {
+        name: string;
+        repositoryUrl: string;
+        sourceUrl: string;
+    }[];
+    client: SkillDiscoveryClient;
+    workspaceId: string;
+    query: string;
+    onImport: (url: string) => void;
+    canManage: boolean;
+    onSearch?: (() => void) | undefined;
+};
+/** Host-owned query and import flow; browse presentation is reusable independently. */
+export declare function SkillDiscovery(props: SkillDiscoveryProps): import("react").JSX.Element;

package/dist/timeline/activity-rail.d.ts

@@ -2,6 +2,8 @@ import type { RetainedArtifactLoader, RetainedScreenshotLoader, ToolRegistry } f
 import type { ActivityItem } from "./types.js";
 export type ActivityRailProps = {
     items: ActivityItem[];
+    /** The owning turn remains active between individual phase receipts. */
+    startupActive?: boolean;
     /** Renderer registry for tool calls. Defaults to {@link defaultToolRegistry}. */
     toolRegistry?: ToolRegistry | undefined;
     /** Drill into a spawned worker session. */
@@ -19,4 +21,4 @@ export type ActivityRailProps = {
     bare?: boolean | undefined;
     className?: string | undefined;
 };
-export declare function ActivityRail({ items, toolRegistry, onOpenSession, onMemoryClick, loadRetainedScreenshot, loadRetainedArtifact, bare, className, }: ActivityRailProps): import("react").JSX.Element;
+export declare function ActivityRail({ items, startupActive, toolRegistry, onOpenSession, onMemoryClick, loadRetainedScreenshot, loadRetainedArtifact, bare, className, }: ActivityRailProps): import("react").JSX.Element;

package/dist/timeline/genie-loading.d.ts

@@ -0,0 +1,24 @@
+import { type ReactNode } from "react";
+export type GenieLoadingRenderProps = {
+    startedAt: string;
+    detailsOpen: boolean;
+    onShowDetails: () => void;
+};
+export type GenieLoadingOptions = {
+    /** Replace the visual while preserving SDK loading visibility and transitions. */
+    render?: (props: GenieLoadingRenderProps) => ReactNode;
+    phrases?: readonly string[];
+    /** Public options stay independent of the renderer's declaration layout. */
+    orb?: {
+        state?: "working" | "searching" | "solving" | "listening" | "connecting" | "weaving" | "composing" | "breathing" | "shaping";
+        size?: 64 | 20;
+        speed?: number;
+    };
+};
+export declare const GenieLoadingOptionsContext: import("react").Context<GenieLoadingOptions | undefined>;
+/** Decorative copy never substitutes for a failure or claims measurable progress. */
+export declare function GenieLoading({ startedAt, onShowDetails, detailsOpen, }: {
+    startedAt: string;
+    onShowDetails: () => void;
+    detailsOpen?: boolean;
+}): string | number | bigint | boolean | import("react").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | Iterable<ReactNode> | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | import("react").ReactPortal | null | undefined> | null | undefined;

package/dist/timeline/startup-preference.d.ts

@@ -0,0 +1,3 @@
+export declare function setStartupDetails(value: boolean): void;
+/** Presentation preference only. Startup evidence is always retained. */
+export declare function useStartupDetails(): boolean;

package/dist/timeline/startup-timings.d.ts

@@ -0,0 +1,4 @@
+import type { StartupPhaseItem } from "./types.js";
+export declare function StartupTimings({ phases }: {
+    phases: StartupPhaseItem[];
+}): import("react").JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeni/react",
-  "version": "5.0.4",
+  "version": "5.0.5-canary.1",
   "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",
-    "@opengeni/sdk": "^5.0.3",
+    "@opengeni/connect": "^0.2.0-canary.3",
+    "@opengeni/sdk": "^5.0.5-canary.1",
     "clsx": "^2.1.1",
     "dequal": "2.0.3",
     "lucide-react": "^1.8.0",
@@ -144,6 +144,7 @@
     "react-resizable-panels": "^4.11.2",
     "remark-gfm": "^4.0.1",
     "tailwind-merge": "^3.5.0",
+    "thinking-orbs": "^0.3.1",
     "virtua": "^0.49.2"
   },
   "peerDependencies": {

package/src/components/message-timeline.tsx

@@ -1,4 +1,6 @@
+import { GenieLoadingOptionsContext, type GenieLoadingOptions } from "../timeline/genie-loading";
 import { ChildSessionLink } from "./child-session-link";
+import { useStartupDetails } from "../timeline/startup-preference";
 import type {
   DraftTimelineAnnotation,
   MediaGenerationResult,
@@ -26,7 +28,7 @@ import {
   XCircleIcon,
 } from "lucide-react";
 import type { ComponentType } from "react";
-import { AnimatePresence, motion } from "motion/react";
+import { AnimatePresence, motion, useReducedMotion } from "motion/react";
 import { Collapsible } from "radix-ui";
 import {
   Component,
@@ -191,6 +193,7 @@ export type MessageTimelineProps = {
    */
   computeLabel?: string | null | undefined;
   /** Customize collapsed turn facets for this timeline instance. */
+  genieLoading?: GenieLoadingOptions | undefined;
   turnSummary?: TurnSummaryOptions | undefined;
   /** Follow new events when pinned to the bottom. Defaults to true. */
   autoFollow?: boolean | undefined;
@@ -417,6 +420,7 @@ export function MessageTimeline({
   loadRetainedArtifact,
   loadVideoArtifactPlayback,
   computeLabel = null,
+  genieLoading,
   turnSummary,
   autoFollow = true,
   onAnnotate,
@@ -590,6 +594,20 @@ export function MessageTimeline({
     previousBulkFirstKeyRef.current !== firstGroupKey;
   const bulkRender = allGroups.length > 0 && (bulkActive || firstKeyChangedForBulk);
   const groups = useStableTimelineGroupKeys(allGroups, !bulkRender);
+  const turnsWithOutput = useMemo(
+    () =>
+      new Set(
+        resolvedItems.flatMap((item) =>
+          "turnId" in item &&
+          item.turnId &&
+          (item.kind === "tool-call" ||
+            ((item.kind === "agent-message" || item.kind === "reasoning") && item.text.trim()))
+            ? [item.turnId]
+            : [],
+        ),
+      ),
+    [resolvedItems],
+  );
 
   const applyCanSkipTipCatchup = useCallback((value: boolean) => {
     if (canSkipTipCatchupRef.current !== value) {
@@ -919,6 +937,7 @@ export function MessageTimeline({
         loadRetainedScreenshot,
         loadRetainedArtifact,
         loadVideoArtifactPlayback,
+        genieLoading,
         turnSummary,
       },
     }),
@@ -934,6 +953,7 @@ export function MessageTimeline({
       renderMessageText,
       resolveProviderLogo,
       toolRegistry,
+      genieLoading,
       turnSummary,
       userMessageDisclosureContext,
     ],
@@ -2007,6 +2027,12 @@ export function MessageTimeline({
                                 groupKey={key}
                                 group={group}
                                 nextGroup={groups[index + 1]?.group}
+                                startupDismissed={
+                                  group.kind === "activity" &&
+                                  group.items.some(
+                                    (item) => item.turnId && turnsWithOutput.has(item.turnId),
+                                  )
+                                }
                                 entranceEnabled={entranceEnabled}
                                 liveEntranceEnabled={
                                   group.kind === "activity" ? !bulkRender : undefined
@@ -2178,7 +2204,24 @@ function useStableTimelineGroupKeys(
         // Retain only same-kind matches. Activity → turn wrap must NOT keep the
         // activity chip's React key: that reused a collapsed TurnSummary and
         // skipped the settle beat (insta-collapse / content flash).
-        if (previous && previous.group.kind === group.kind && !usedKeys.has(previous.key)) {
+        const startupCompletion =
+          previous?.group.kind === "activity" &&
+          previous.group.items.every(
+            (item) =>
+              item.kind === "startup-phase" || (item.kind === "reasoning" && !item.text.trim()),
+          ) &&
+          group.kind === "turn" &&
+          group.outcome === "complete" &&
+          group.groups.every(
+            (child) =>
+              child.kind === "activity" &&
+              child.items.every((item) => item.kind === "startup-phase"),
+          );
+        if (
+          previous &&
+          (previous.group.kind === group.kind || startupCompletion) &&
+          !usedKeys.has(previous.key)
+        ) {
           retainedGroup = previous;
           break;
         }
@@ -2298,6 +2341,7 @@ type TimelineGroupEntryProps = {
   groupKey: string;
   group: TimelineGroup;
   nextGroup?: TimelineGroup | undefined;
+  startupDismissed: boolean;
   entranceEnabled: boolean;
   liveEntranceEnabled?: boolean | undefined;
   context: TimelineGroupEntryContext;
@@ -2320,6 +2364,7 @@ type TimelineGroupBehaviorProps = {
   loadRetainedScreenshot: MessageTimelineProps["loadRetainedScreenshot"];
   loadRetainedArtifact: MessageTimelineProps["loadRetainedArtifact"];
   loadVideoArtifactPlayback: MessageTimelineProps["loadVideoArtifactPlayback"];
+  genieLoading: MessageTimelineProps["genieLoading"];
   turnSummary: MessageTimelineProps["turnSummary"];
 };
 
@@ -2332,10 +2377,12 @@ const TimelineGroupEntry = memo(function TimelineGroupEntry({
   groupKey,
   group,
   nextGroup,
+  startupDismissed,
   entranceEnabled,
   liveEntranceEnabled,
   context,
 }: TimelineGroupEntryProps) {
+  const reducedMotion = useReducedMotion();
   const { behavior, userMessageDisclosureContext } = context;
   const contextCompactionCount =
     group.kind === "turn"
@@ -2347,23 +2394,45 @@ const TimelineGroupEntry = memo(function TimelineGroupEntry({
         ? 1
         : 0;
   return (
-    <div data-og-timeline-group-anchor="" data-og-group-key={groupKey}>
-      <EntranceAnimationProvider value={entranceEnabled} liveValue={liveEntranceEnabled}>
-        <TimelineGroupRenderBoundary resetKeys={[group, behavior]}>
-          <UserMessageDisclosureProvider value={userMessageDisclosureContext}>
-            <TimelineGroupView
-              {...behavior}
-              group={group}
-              foldLiveCluster={isAgentProgress(nextGroup)}
-              trailingAgentText={trailingAgentTextAfterTurn(group, nextGroup)}
-              contextCompactionCount={
-                contextCompactionCount > 0 ? contextCompactionCount : undefined
-              }
-            />
-          </UserMessageDisclosureProvider>
-        </TimelineGroupRenderBoundary>
-      </EntranceAnimationProvider>
-    </div>
+    <GenieLoadingOptionsContext.Provider value={behavior.genieLoading}>
+      <div data-og-timeline-group-anchor="" data-og-group-key={groupKey}>
+        <EntranceAnimationProvider value={entranceEnabled} liveValue={liveEntranceEnabled}>
+          <TimelineGroupRenderBoundary resetKeys={[group, behavior]}>
+            <UserMessageDisclosureProvider value={userMessageDisclosureContext}>
+              <AnimatePresence initial={false}>
+                <motion.div
+                  key={
+                    !startupDismissed &&
+                    group.kind === "activity" &&
+                    group.items.every(
+                      (item) =>
+                        item.kind === "startup-phase" ||
+                        (item.kind === "reasoning" && !item.text.trim()),
+                    )
+                      ? "preparation"
+                      : "content"
+                  }
+                  initial={false}
+                  exit={{ opacity: 0, height: 0 }}
+                  transition={{ duration: reducedMotion ? 0 : 0.2 }}
+                >
+                  <TimelineGroupView
+                    {...behavior}
+                    group={group}
+                    foldLiveCluster={isAgentProgress(nextGroup)}
+                    startupDismissed={startupDismissed}
+                    trailingAgentText={trailingAgentTextAfterTurn(group, nextGroup)}
+                    contextCompactionCount={
+                      contextCompactionCount > 0 ? contextCompactionCount : undefined
+                    }
+                  />
+                </motion.div>
+              </AnimatePresence>
+            </UserMessageDisclosureProvider>
+          </TimelineGroupRenderBoundary>
+        </EntranceAnimationProvider>
+      </div>
+    </GenieLoadingOptionsContext.Provider>
   );
 });
 
@@ -2389,6 +2458,7 @@ const TimelineGroupView = memo(function TimelineGroupView({
   insideTurn = false,
   nestClusterChips = false,
   foldLiveCluster = false,
+  startupDismissed = false,
   trailingAgentText,
   contextCompactionCount,
 }: {
@@ -2412,6 +2482,7 @@ const TimelineGroupView = memo(function TimelineGroupView({
       behind a neutral chip — the one place activity without an outcome still
       folds, bounding the DOM of days-long autonomous turns. */
   foldLiveCluster?: boolean;
+  startupDismissed?: boolean;
   /** Rendering inside an expanded turn group: the outer chip already owns the
       failure surface, so nested chips stay tinted but quiet (no repeated
       failure text, no auto-open) — one loud error, N calm sub-expands. */
@@ -2432,6 +2503,7 @@ const TimelineGroupView = memo(function TimelineGroupView({
   /** Secondary chip facet when this fold sits next to a compaction landmark. */
   contextCompactionCount?: number | undefined;
 }) {
+  const startupDetails = useStartupDetails();
   const enter = useEntranceAnimation();
   const settleChrome = useTurnSettleOpen();
   const foldMemory = useFoldMemory();
@@ -2463,6 +2535,29 @@ const TimelineGroupView = memo(function TimelineGroupView({
     group.kind === "turn" ? !!(enter && !insideTurn && !turnDefaultOpen) : liveActivitySettle;
   switch (group.kind) {
     case "activity":
+      // Preparation is one quiet surface, not a fold with eight technical steps.
+      if (
+        !startupDetails &&
+        !insideTurn &&
+        !group.outcome &&
+        group.items.every(
+          (item) =>
+            item.kind === "startup-phase" || (item.kind === "reasoning" && !item.text.trim()),
+        )
+      ) {
+        return (
+          <ActivityRail
+            items={group.items}
+            startupActive={!startupDismissed && !foldLiveCluster}
+            bare
+            toolRegistry={toolRegistry}
+            onOpenSession={onOpenSession}
+            onMemoryClick={onMemoryClick}
+            loadRetainedScreenshot={loadRetainedScreenshot}
+            loadRetainedArtifact={loadRetainedArtifact}
+          />
+        );
+      }
       if (insideTurn) {
         // Nested chips whenever the parent has ≥2 clusters. During outer settle
         // chrome they stay force-open so structure is visible and height stays
@@ -2542,6 +2637,18 @@ const TimelineGroupView = memo(function TimelineGroupView({
       );
     case "turn": {
       const activityItems = flattenActivityItems(group.groups);
+      if (
+        !startupDetails &&
+        group.outcome === "complete" &&
+        group.groups.every(
+          (child) =>
+            child.kind === "activity" &&
+            child.items.every(
+              (item) => item.kind === "startup-phase" && item.status === "complete",
+            ),
+        )
+      )
+        return <ActivityRail items={activityItems} startupActive={false} bare />;
       // Second-layer chips only when there are natural multi-cluster seams —
       // otherwise the outer turn chip alone is enough ("N steps" wrapping one
       // more "N steps" was the redundant double fold).
@@ -2727,7 +2834,7 @@ function isAgentProgress(next: TimelineGroup | undefined): boolean {
   return (
     next.kind === "activity" ||
     next.kind === "turn" ||
-    (next.kind === "item" && next.item.kind === "agent-message")
+    (next.kind === "item" && next.item.kind === "agent-message" && next.item.text.trim().length > 0)
   );
 }
 

package/src/components/sandbox-workspace.tsx

@@ -1002,6 +1002,8 @@ export type SandboxWorkspaceProps = ClientOverride & {
    *  omitted the workbench decides from the durable workspace capture. */
   initialTab?: string | undefined;
   onActiveTabChange?: ((activeTab: string) => void) | undefined;
+  /** Open a built-in or host-injected tab. A new requestId reopens the same tab. */
+  openTabRequest?: { tab: string; requestId: number } | null | undefined;
   initialFilePath?: string | null | undefined;
   onFilePathChange?: ((path: string | null) => void) | undefined;
   /** Presentation-only filter for Files tree nodes and selected-file viewing. */
@@ -1061,6 +1063,7 @@ export function SandboxWorkspace(props: SandboxWorkspaceProps): ReactNode {
     trailingTabs,
     initialTab,
     onActiveTabChange,
+    openTabRequest,
     initialFilePath,
     onFilePathChange,
     isFileNodeVisible,
@@ -1102,6 +1105,32 @@ export function SandboxWorkspace(props: SandboxWorkspaceProps): ReactNode {
   const nextFileRequestId = useRef(0);
   const nextComputerRequestId = useRef(0);
   const selectedTab = storedSelection?.sessionId === sessionId ? storedSelection.tab : null;
+  const handledTabRequest = useRef<{ sessionId: string; requestId: number } | null>(null);
+  useEffect(() => {
+    if (
+      !openTabRequest ||
+      (handledTabRequest.current?.sessionId === sessionId &&
+        handledTabRequest.current.requestId === openTabRequest.requestId)
+    )
+      return;
+    const available =
+      [...(leadingTabs ?? []), ...(trailingTabs ?? [])].some(
+        (tab) => tab.id === openTabRequest.tab,
+      ) || (surfaces ?? WORKBENCH_SURFACES).some((tab) => tab === openTabRequest.tab);
+    if (!available) return;
+    handledTabRequest.current = { sessionId, requestId: openTabRequest.requestId };
+    setStoredSelection({ sessionId, tab: openTabRequest.tab });
+    onActiveTabChange?.(openTabRequest.tab);
+    onCollapsedChange?.(false);
+  }, [
+    openTabRequest,
+    sessionId,
+    leadingTabs,
+    trailingTabs,
+    surfaces,
+    onActiveTabChange,
+    onCollapsedChange,
+  ]);
   const activeTabHint = selectedTab ?? initialTab ?? leadingTabs?.[0]?.id ?? null;
   const openFile = useCallback(
     (path: string, line?: number | null) => {