@tangle-network/sandbox-ui 0.107.0 → 0.108.0

package/dist/{chunk-3GX5BSD4.js → chunk-72UF2H5H.js}

@@ -104,6 +104,33 @@ async function fetchJson(url, token, init) {
   if (!res.ok) throw await responseError(res, "Request failed");
   return res.json();
 }
+function readDegradation(raw) {
+  if (!raw || typeof raw !== "object") return null;
+  const record = raw;
+  if (typeof record.message !== "string") return null;
+  return {
+    kind: "hub-connections",
+    reason: typeof record.reason === "string" ? record.reason : "unknown",
+    message: record.message,
+    requestShape: typeof record.requestShape === "string" ? record.requestShape : "unknown"
+  };
+}
+function bumpHubFrameEpoch(epochs, sessionId) {
+  epochs.set(sessionId, (epochs.get(sessionId) ?? 0) + 1);
+}
+function withDegradation(prev, sessionId, value) {
+  const current = prev.get(sessionId) ?? null;
+  if (value === null) {
+    if (current === null) return prev;
+    const next = new Map(prev);
+    next.delete(sessionId);
+    return next;
+  }
+  if (current && current.reason === value.reason && current.message === value.message && current.requestShape === value.requestShape) {
+    return prev;
+  }
+  return new Map(prev).set(sessionId, value);
+}
 function useSessionStream({
   apiUrl,
   token,
@@ -119,11 +146,16 @@ function useSessionStream({
   const [isStreaming, setIsStreaming] = useState(false);
   const [error, setError] = useState(null);
   const [connected, setConnected] = useState(false);
+  const [degradationBySession, setDegradationBySession] = useState(() => /* @__PURE__ */ new Map());
+  const degradation = degradationBySession.get(sessionId) ?? null;
   const abortRef = useRef(null);
   const reconnectTimerRef = useRef(null);
   const activeAssistantMessageIdsRef = useRef(/* @__PURE__ */ new Set());
   const completedExecutionIdsRef = useRef(/* @__PURE__ */ new Set());
   const lastEventIdRef = useRef("");
+  const hubFrameEpochRef = useRef(/* @__PURE__ */ new Map());
+  const seedGenerationRef = useRef(/* @__PURE__ */ new Map());
+  const executionScopedStreamRef = useRef(false);
   const insertionCounterRef = useRef(0);
   const echoCounterRef = useRef(0);
   const pendingEchoesRef = useRef(/* @__PURE__ */ new Map());
@@ -169,6 +201,29 @@ function useSessionStream({
       setError(msg);
     }
   }, [apiUrl, token, sessionId]);
+  const seedDegradation = useCallback(async () => {
+    if (!token || !sessionId || !apiUrl) return;
+    const epochAtRequest = hubFrameEpochRef.current.get(sessionId) ?? 0;
+    const generation = (seedGenerationRef.current.get(sessionId) ?? 0) + 1;
+    seedGenerationRef.current.set(sessionId, generation);
+    let seeded;
+    try {
+      const url = `${apiUrl}/session/sessions/${encodeURIComponent(sessionId)}`;
+      const status = await fetchJson(url, token);
+      const field = status.hubConnectionsDegraded;
+      if (field === void 0 || field === null) {
+        seeded = null;
+      } else {
+        seeded = readDegradation(field);
+        if (!seeded) return;
+      }
+    } catch {
+      return;
+    }
+    if ((hubFrameEpochRef.current.get(sessionId) ?? 0) !== epochAtRequest) return;
+    if (seedGenerationRef.current.get(sessionId) !== generation) return;
+    setDegradationBySession((prev) => withDegradation(prev, sessionId, seeded));
+  }, [apiUrl, token, sessionId]);
   const connectSSE = useCallback(async () => {
     if (!token || !sessionId || !apiUrl || !enabled) return;
     if (reconnectTimerRef.current) {
@@ -181,6 +236,7 @@ function useSessionStream({
     try {
       const eventQuery = new URLSearchParams({ sessionId });
       const activeExecutionIds = [...activeAssistantMessageIdsRef.current];
+      executionScopedStreamRef.current = activeExecutionIds.length > 0;
       if (activeExecutionIds.length === 1) {
         eventQuery.set("executionId", activeExecutionIds[0]);
       } else if (activeExecutionIds.length > 1) {
@@ -198,6 +254,7 @@ function useSessionStream({
       if (!res.ok) throw await responseError(res, "Live response connection failed");
       setConnected(true);
       setError(null);
+      void seedDegradation();
       const reader = res.body?.getReader();
       if (!reader) throw new Error("No response body");
       const decoder = new TextDecoder();
@@ -387,7 +444,22 @@ function useSessionStream({
       const executionId = props.executionId ?? props.executionID ?? "";
       const stillStreaming = retireExecution(executionId);
       setIsStreaming(stillStreaming);
-      if (!stillStreaming) refetch();
+      if (!stillStreaming) {
+        refetch();
+        if (executionScopedStreamRef.current) void seedDegradation();
+      }
+    } else if (type === "hub.connections.degraded") {
+      const framedSessionId = typeof props.sessionId === "string" ? props.sessionId : null;
+      if (!framedSessionId) return;
+      const value = readDegradation(props);
+      if (!value) return;
+      bumpHubFrameEpoch(hubFrameEpochRef.current, framedSessionId);
+      setDegradationBySession((prev) => withDegradation(prev, framedSessionId, value));
+    } else if (type === "hub.connections.restored") {
+      const framedSessionId = typeof props.sessionId === "string" ? props.sessionId : null;
+      if (!framedSessionId) return;
+      bumpHubFrameEpoch(hubFrameEpochRef.current, framedSessionId);
+      setDegradationBySession((prev) => withDegradation(prev, framedSessionId, null));
     } else if (type === "session.error") {
       const executionId = props.executionId ?? props.executionID ?? "";
       const stillStreaming = retireExecution(executionId);
@@ -395,7 +467,7 @@ function useSessionStream({
       setError(formatError(readErrorDetails(props), "Agent response failed"));
       if (!stillStreaming) refetch();
     }
-  }, [refetch]);
+  }, [refetch, seedDegradation]);
   handleSSEEventRef.current = handleSSEEvent;
   const send = useCallback(async (text, options) => {
     if (!token || !sessionId || !apiUrl || !enabled) {
@@ -505,7 +577,17 @@ function useSessionStream({
       setConnected(false);
     };
   }, [enabled, token, sessionId, refetch, connectSSE]);
-  return { messages, partMap, isStreaming, send, abort, refetch, error, connected };
+  return {
+    messages,
+    partMap,
+    isStreaming,
+    send,
+    abort,
+    refetch,
+    error,
+    connected,
+    degradation
+  };
 }
 
 // src/hooks/use-sidecar-auth.ts

package/dist/{chunk-OI7HEWLZ.js → chunk-D5VXCWUG.js}

@@ -619,12 +619,24 @@ function DirectoryPane({
 import { Binary, ShieldCheck, TerminalSquare } from "lucide-react";
 
 // src/workspace/status-banner.tsx
-import { Loader2, AlertCircle, CheckCircle, Wifi } from "lucide-react";
+import { Loader2, AlertCircle, AlertTriangle, CheckCircle, Wifi } from "lucide-react";
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 var BANNER_STYLES = {
   provisioning: { bg: "bg-primary/5", border: "border-primary/20", text: "text-primary", icon: Loader2 },
   connecting: { bg: "bg-[var(--code-number)]/5", border: "border-[var(--code-number)]/20", text: "text-[var(--code-number)]", icon: Wifi },
   error: { bg: "bg-[var(--code-error)]/5", border: "border-[var(--code-error)]/20", text: "text-[var(--code-error)]", icon: AlertCircle },
+  // Degraded, not broken: the thing still works, with less than was asked for.
+  // `error` would overstate it and `info` would understate it, and a notice
+  // styled as neither gets read as neither. Uses the brand's theme-reactive
+  // `--surface-warning-*` triple rather than a `warning` color utility —
+  // `warning` is not registered in this package's `@theme`, so `bg-warning`
+  // and friends emit no rule at all.
+  warning: {
+    bg: "bg-[var(--surface-warning-bg)]",
+    border: "border-[var(--surface-warning-border)]",
+    text: "text-[var(--surface-warning-text)]",
+    icon: AlertTriangle
+  },
   success: { bg: "bg-[var(--code-success)]/5", border: "border-[var(--code-success)]/20", text: "text-[var(--code-success)]", icon: CheckCircle },
   info: { bg: "bg-surface-container-high", border: "border-[var(--md3-outline-variant)]", text: "text-muted-foreground", icon: AlertCircle }
 };
@@ -632,6 +644,7 @@ function StatusBanner({ type, message, detail, onDismiss, className }) {
   const style = BANNER_STYLES[type];
   const Icon = style.icon;
   const isAnimated = type === "provisioning" || type === "connecting";
+  const role = type === "error" ? "alert" : "status";
   return /* @__PURE__ */ jsxs3(
     "div",
     {
@@ -642,15 +655,17 @@ function StatusBanner({ type, message, detail, onDismiss, className }) {
         className
       ),
       children: [
-        /* @__PURE__ */ jsx4(
-          Icon,
-          {
-            className: cn("h-4 w-4 shrink-0", style.text, isAnimated && "animate-spin"),
-            ...isAnimated ? { "data-motion": "essential" } : {}
-          }
-        ),
-        /* @__PURE__ */ jsx4("span", { className: "font-medium text-foreground", children: message }),
-        detail && /* @__PURE__ */ jsx4("span", { className: "font-mono text-xs text-muted-foreground tabular-nums", children: detail }),
+        /* @__PURE__ */ jsxs3("div", { role, className: "flex min-w-0 items-center gap-2.5", children: [
+          /* @__PURE__ */ jsx4(
+            Icon,
+            {
+              className: cn("h-4 w-4 shrink-0", style.text, isAnimated && "animate-spin"),
+              ...isAnimated ? { "data-motion": "essential" } : {}
+            }
+          ),
+          /* @__PURE__ */ jsx4("span", { className: "font-medium text-foreground", children: message }),
+          detail && /* @__PURE__ */ jsx4("span", { className: "font-mono text-xs text-muted-foreground tabular-nums", children: detail })
+        ] }),
         onDismiss && /* @__PURE__ */ jsx4(
           "button",
           {

package/dist/hooks.d.ts

@@ -2,7 +2,7 @@ export { AgentStreamEvent, AppendUserMessageOptions, ApplySdkEventOptions, AuthU
 import { AgentInteractiveSessionControlClaim } from '@tangle-network/agent-interface';
 import * as _tanstack_react_query from '@tanstack/react-query';
 import { Session } from './types.js';
-export { e as SESSION_STREAM_RECONNECT_DELAY_MS, f as SendMessageOptions, S as SessionInfo, g as SessionStreamError, a as SidecarAuth, U as UseSessionStreamOptions, b as UseSessionStreamResult, c as UseSidecarAuthOptions, u as useSessionStream, d as useSidecarAuth } from './sdk-hooks-Cjt_Wq7g.js';
+export { f as SESSION_STREAM_RECONNECT_DELAY_MS, g as SendMessageOptions, S as SessionDegradation, a as SessionInfo, h as SessionStreamError, b as SidecarAuth, U as UseSessionStreamOptions, c as UseSessionStreamResult, d as UseSidecarAuthOptions, u as useSessionStream, e as useSidecarAuth } from './sdk-hooks-Djkjq4cp.js';
 import '@tangle-network/ui/types';
 import '@tangle-network/ui/stores';
 import '@tangle-network/ui/sdk-hooks';

package/dist/hooks.js

@@ -23,7 +23,7 @@ import {
   SessionStreamError,
   useSessionStream,
   useSidecarAuth
-} from "./chunk-3GX5BSD4.js";
+} from "./chunk-72UF2H5H.js";
 import {
   usePtySession
 } from "./chunk-F7LNWZQR.js";

package/dist/index.d.ts

@@ -18,7 +18,7 @@ export { AuthHeader, AuthHeaderProps, GitHubLoginButton, GitHubLoginButtonProps,
 export { TangleLoginButton, TangleLoginButtonProps } from './auth.js';
 export { AgentStreamEvent, AppendUserMessageOptions, ApplySdkEventOptions, AuthUser, AutomationStreamEvent, BeginAssistantMessageOptions, BotStreamEvent, CompleteAssistantMessageOptions, RealtimeSessionOptions, RealtimeSessionRegistry, RealtimeSessionRegistryProps, RealtimeSessionState, RealtimeSessionTarget, SSEEvent, SdkSessionAttachment, SdkSessionEvent, SdkSessionSeed, TaskStreamEvent, TerminalStreamEvent, UseAuthOptions, UseAuthResult, UseRunGroupsOptions, UseSSEStreamOptions, UseSSEStreamResult, UseSdkSessionOptions, UseSdkSessionReturn, UseToolCallStreamReturn, createAuthFetcher, useApiKey, useAuth, useAutoScroll, useDropdownMenu, useLiveTime, useRealtimeSession, useRunCollapseState, useRunGroups, useSSEStream, useSdkSession, useToolCallStream } from '@tangle-network/ui/hooks';
 export { SandboxMetrics, SidecarMetricsPayload, UsePtySessionOptions, UsePtySessionReturn, UseSandboxMetricsOptions, UseSandboxMetricsResult, useCreateSession, useDeleteSession, usePtySession, useRenameSession, useSandboxMetrics, useSessions } from './hooks.js';
-export { S as SessionInfo, a as SidecarAuth, U as UseSessionStreamOptions, b as UseSessionStreamResult, c as UseSidecarAuthOptions, u as useSessionStream, d as useSidecarAuth } from './sdk-hooks-Cjt_Wq7g.js';
+export { S as SessionDegradation, a as SessionInfo, b as SidecarAuth, U as UseSessionStreamOptions, c as UseSessionStreamResult, d as UseSidecarAuthOptions, u as useSessionStream, e as useSidecarAuth } from './sdk-hooks-Djkjq4cp.js';
 export { ActiveProjectActivity, ActiveSessionActivityOptions, ActiveSessionConnectionOptions, ActiveSessionConnectionState, ActiveSessionReconnectState, ActiveSessionRecord, ActiveSessionStatus, ActiveSessionTransportMode, ActiveSessionsState, RegisterActiveSessionOptions, SessionProjectKey, activeSessionsAtom, addMessage, addParts, bumpActiveSessionActivity, clearChat, getActiveSession, getAllActiveSessions, getAllProjectActivity, getSessionsByActivity, getSessionsForNavbar, getSessionsForProject, getTotalRunningSessionCount, hasBackgroundRunningSessions, isStreamingAtom, messagesAtom, partMapAtom, registerActiveSession, resetActiveSessions, setActiveSessionAttention, setActiveSessionConnection, setActiveSessionError, setActiveSessionRunning, setForegroundActiveSession, unregisterActiveSession, updateActiveSessionMeta, updatePart, useActiveSession, useActiveSessions, useActiveSessionsState, useHasBackgroundRunningSessions, useNavbarSessions, useProjectActivity, useProjectSessions, useSessionsByActivity, useTotalRunningSessions } from '@tangle-network/ui/stores';
 export { ChatSession, connectSession, disconnectSession, sessionAtom } from './stores.js';
 export { AgentBranding, CustomToolRenderer, DisplayVariant, FinalTextPart, GroupedMessage, MessageRun, MessageUser, ReasoningPart, Run, RunStats, SessionMessage, SessionPart, TextPart, ToolCategory, ToolDisplayMetadata, ToolPart, ToolState, ToolStatus, ToolTime } from '@tangle-network/ui/types';

package/dist/index.js

@@ -21,7 +21,7 @@ import {
 import {
   useSessionStream,
   useSidecarAuth
-} from "./chunk-3GX5BSD4.js";
+} from "./chunk-72UF2H5H.js";
 import {
   activeSessionsAtom,
   addMessage,
@@ -132,7 +132,7 @@ import {
   dispatchSessionCreated,
   shellShouldRevalidate,
   useOptimisticSessionItems
-} from "./chunk-OI7HEWLZ.js";
+} from "./chunk-D5VXCWUG.js";
 import {
   BRAND_PRISM_THEME,
   CodeSurface,

package/dist/{sdk-hooks-Cjt_Wq7g.d.ts → sdk-hooks-Djkjq4cp.d.ts}

@@ -38,6 +38,31 @@ interface SendMessageOptions {
      *  selected harness/model actually supports (a capability filter), never a hard-coded subset. */
     reasoningEffort?: ReasoningEffort;
 }
+/**
+ * A sandbox-level condition that degrades the session without ending it.
+ *
+ * Distinct from `error`, which reports a turn that failed: the session here is
+ * running and will answer, it is just missing something the caller asked for.
+ * Reported separately so it is not cleared by the next successful turn — the
+ * condition outlives the turn that revealed it.
+ */
+interface SessionDegradation {
+    /** Which capability is degraded. A union so this can grow without a break. */
+    readonly kind: 'hub-connections';
+    /** Machine-readable cause. */
+    readonly reason: string;
+    /** Operator/user-facing sentence, authored by the sidecar. */
+    readonly message: string;
+    /**
+     * What the session asked for, NOT how much it lost.
+     *
+     * There is deliberately no count of missing integrations: the sidecar reaches
+     * this state only for an attach-all request, and the call that would
+     * enumerate the tenant's connections is the one that failed authentication.
+     * Any number rendered here would be fabricated.
+     */
+    readonly requestShape: string;
+}
 interface UseSessionStreamResult {
     /** All messages in the session (fetched + streaming). */
     messages: SessionMessage[];
@@ -55,6 +80,21 @@ interface UseSessionStreamResult {
     error: string | null;
     /** Whether the SSE connection is active. */
     connected: boolean;
+    /**
+     * The degradation currently reported for THIS session, or `null`.
+     *
+     * Today the only one is a Hub credential the sandbox could not present, which
+     * leaves the agent with an EMPTY toolbelt while the session otherwise runs
+     * normally. Without surfacing it, that state is indistinguishable to the user
+     * from having connected no integrations at all — so a caller that renders a
+     * transcript should render this too.
+     *
+     * Seeded from session status rather than derived from the live stream alone:
+     * the sidecar's bus never replays, so a reload — or attaching a beat after
+     * spawn — would otherwise show a normal-looking session with no tools and no
+     * explanation. Live frames update it, and a recovered credential clears it.
+     */
+    degradation: SessionDegradation | null;
 }
 declare class SessionStreamError extends Error {
     readonly code: string;
@@ -102,4 +142,4 @@ interface SidecarAuth {
  */
 declare function useSidecarAuth({ resourceId, apiUrl, signMessage }: UseSidecarAuthOptions): SidecarAuth;
 
-export { type SessionInfo as S, type UseSessionStreamOptions as U, type SidecarAuth as a, type UseSessionStreamResult as b, type UseSidecarAuthOptions as c, useSidecarAuth as d, SESSION_STREAM_RECONNECT_DELAY_MS as e, type SendMessageOptions as f, SessionStreamError as g, useSessionStream as u };
+export { type SessionDegradation as S, type UseSessionStreamOptions as U, type SessionInfo as a, type SidecarAuth as b, type UseSessionStreamResult as c, type UseSidecarAuthOptions as d, useSidecarAuth as e, SESSION_STREAM_RECONNECT_DELAY_MS as f, type SendMessageOptions as g, SessionStreamError as h, useSessionStream as u };

package/dist/sdk-hooks.d.ts

@@ -1,4 +1,4 @@
 export { AgentStreamEvent, AppendUserMessageOptions, ApplySdkEventOptions, AutomationStreamEvent, BeginAssistantMessageOptions, BotStreamEvent, CompleteAssistantMessageOptions, ConnectionState, RealtimeSessionOptions, RealtimeSessionRegistry, RealtimeSessionRegistryProps, RealtimeSessionState, RealtimeSessionTarget, SSEEvent, SdkSessionAttachment, SdkSessionEvent, SdkSessionSeed, TaskStreamEvent, TerminalStreamEvent, UseRunGroupsOptions, UseSSEStreamOptions, UseSSEStreamResult, UseSdkSessionOptions, UseSdkSessionReturn, UseToolCallStreamReturn, useAutoScroll, useDropdownMenu, useRealtimeSession, useRunCollapseState, useRunGroups, useSSEStream, useSdkSession, useToolCallStream } from '@tangle-network/ui/sdk-hooks';
-export { S as SessionInfo, a as SidecarAuth, U as UseSessionStreamOptions, b as UseSessionStreamResult, c as UseSidecarAuthOptions, u as useSessionStream, d as useSidecarAuth } from './sdk-hooks-Cjt_Wq7g.js';
+export { a as SessionInfo, b as SidecarAuth, U as UseSessionStreamOptions, c as UseSessionStreamResult, d as UseSidecarAuthOptions, u as useSessionStream, e as useSidecarAuth } from './sdk-hooks-Djkjq4cp.js';
 import '@tangle-network/agent-interface';
 import '@tangle-network/ui/types';

package/dist/sdk-hooks.js

@@ -1,7 +1,7 @@
 import {
   useSessionStream,
   useSidecarAuth
-} from "./chunk-3GX5BSD4.js";
+} from "./chunk-72UF2H5H.js";
 import "./chunk-CZ7CSFO4.js";
 
 // src/sdk-hooks.ts

package/dist/workspace.d.ts

@@ -96,7 +96,7 @@ declare function DirectoryPane({ root, selectedPath, onSelect, onRefresh, onUplo
 /**
  * StatusBanner — full-width notification banner for connection/provisioning states.
  */
-type BannerType = "provisioning" | "connecting" | "error" | "success" | "info";
+type BannerType = "provisioning" | "connecting" | "error" | "warning" | "success" | "info";
 interface StatusBannerProps {
     type: BannerType;
     message: string;

package/dist/workspace.js

@@ -20,7 +20,7 @@ import {
   dispatchSessionCreated,
   shellShouldRevalidate,
   useOptimisticSessionItems
-} from "./chunk-OI7HEWLZ.js";
+} from "./chunk-D5VXCWUG.js";
 import "./chunk-BGVEHENC.js";
 import "./chunk-EI44GEQ5.js";
 import "./chunk-CZ7CSFO4.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangle-network/sandbox-ui",
-  "version": "0.107.0",
+  "version": "0.108.0",
   "description": "Unified UI component library for Tangle Sandbox — primitives, chat, dashboard, terminal, editor, and workspace components",
   "repository": {
     "type": "git",