@opengeni/react 0.46.1 → 0.52.1

package/dist/{chunk-6EDV6YFE.js → chunk-X4S56Y2H.js}

@@ -1,15 +1,16 @@
+import {
+  formatBytes,
+  formatRelativeTime
+} from "./chunk-LAKLF4PA.js";
 import {
   useMutationRunner,
+  usePageLiveActivity,
   usePolledValue
-} from "./chunk-EB67J347.js";
+} from "./chunk-KZ73RL76.js";
 import {
   OpenGeniContext,
   useOpenGeni
-} from "./chunk-EKZH6IDG.js";
-import {
-  formatBytes,
-  formatRelativeTime
-} from "./chunk-LAKLF4PA.js";
+} from "./chunk-HDBG7XGO.js";
 import {
   cn
 } from "./chunk-22KP6LR5.js";
@@ -533,7 +534,7 @@ function MachineCard({
       className: cn(
         "og-root group relative flex flex-col gap-3 overflow-hidden rounded-og-lg border border-og-border",
         "bg-og-surface-1 p-4 shadow-og-sm transition-colors",
-        openable && "cursor-pointer hover:border-og-border-strong focus-visible:border-og-accent/60 focus-visible:outline-none",
+        openable && "cursor-pointer hover:border-og-border-strong focus-visible:border-og-accent/60 focus-visible:outline-hidden",
         machine.active && "border-og-accent/40",
         className
       ),
@@ -886,7 +887,14 @@ function MetricHistoryChart({
 }
 
 // src/components/machines/machine-detail.tsx
-import { ArrowLeftIcon, CpuIcon as CpuIcon2, LaptopIcon as LaptopIcon2, RadioIcon, ServerIcon as ServerIcon2 } from "lucide-react";
+import {
+  ArrowLeftIcon,
+  CpuIcon as CpuIcon2,
+  LaptopIcon as LaptopIcon2,
+  RadioIcon,
+  ServerIcon as ServerIcon2,
+  Trash2Icon
+} from "lucide-react";
 
 // src/components/machines/series.ts
 var METRIC_WINDOWS = ["15m", "1h", "6h", "24h"];
@@ -985,6 +993,7 @@ function MachineDetail({
   onWindowChange,
   loadingSeries,
   onBack,
+  onRemove,
   now = Date.now(),
   className
 }) {
@@ -1015,20 +1024,36 @@ function MachineDetail({
           machine.arch
         ] })
       ] }),
-      /* @__PURE__ */ jsx7("div", { className: "flex shrink-0 items-center gap-0.5 rounded-og-md border border-og-border bg-og-surface-1 p-0.5", children: METRIC_WINDOWS.map((w) => /* @__PURE__ */ jsx7(
-        "button",
-        {
-          type: "button",
-          onClick: () => onWindowChange(w),
-          "data-active": w === window2,
-          className: cn(
-            "rounded-og-sm px-2 py-1 font-og-mono text-og-xs transition-colors",
-            w === window2 ? "bg-og-surface-3 text-og-fg shadow-og-sm" : "text-og-fg-subtle hover:text-og-fg-muted"
-          ),
-          children: w
-        },
-        w
-      )) })
+      /* @__PURE__ */ jsxs7("div", { className: "flex shrink-0 items-center gap-2", children: [
+        onRemove && machine.enrollmentId && !machine.isSessionGroup ? /* @__PURE__ */ jsxs7(
+          "button",
+          {
+            type: "button",
+            "data-remove-machine": true,
+            "aria-label": `Remove machine ${machine.name}`,
+            onClick: () => onRemove(machine),
+            className: "inline-flex min-h-9 items-center gap-1.5 rounded-og-sm border border-og-status-failed/40 px-2.5 py-1 font-medium text-og-xs text-og-status-failed transition-colors hover:bg-og-status-failed/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-og-status-failed/50 pointer-coarse:min-h-11",
+            children: [
+              /* @__PURE__ */ jsx7(Trash2Icon, { className: "size-3.5", "aria-hidden": true }),
+              /* @__PURE__ */ jsx7("span", { className: "hidden sm:inline", children: "Remove machine" })
+            ]
+          }
+        ) : null,
+        /* @__PURE__ */ jsx7("div", { className: "flex items-center gap-0.5 rounded-og-md border border-og-border bg-og-surface-1 p-0.5", children: METRIC_WINDOWS.map((w) => /* @__PURE__ */ jsx7(
+          "button",
+          {
+            type: "button",
+            onClick: () => onWindowChange(w),
+            "data-active": w === window2,
+            className: cn(
+              "rounded-og-sm px-2 py-1 font-og-mono text-og-xs transition-colors",
+              w === window2 ? "bg-og-surface-3 text-og-fg shadow-og-sm" : "text-og-fg-subtle hover:text-og-fg-muted"
+            ),
+            children: w
+          },
+          w
+        )) })
+      ] })
     ] }),
     /* @__PURE__ */ jsxs7(
       "div",
@@ -1144,7 +1169,7 @@ function EmptyState({ onEnroll }) {
         /* @__PURE__ */ jsx8("span", { className: "flex size-10 items-center justify-center rounded-full bg-og-surface-2 text-og-fg-subtle", children: /* @__PURE__ */ jsx8(LaptopIcon3, { className: "size-5", "aria-hidden": true }) }),
         /* @__PURE__ */ jsxs8("div", { className: "space-y-1", children: [
           /* @__PURE__ */ jsx8("p", { className: "text-og-base font-medium text-og-fg", children: "No machines yet" }),
-          /* @__PURE__ */ jsx8("p", { className: "max-w-xs text-og-sm text-og-fg-muted", children: "Enroll your own computer to run the agent on it \u2014 your files, your terminal, your desktop." })
+          /* @__PURE__ */ jsx8("p", { className: "max-w-xs text-og-sm text-og-fg-muted", children: "Connect your own computer to run the agent on it \u2014 your files, your terminal, your desktop." })
         ] }),
         onEnroll ? /* @__PURE__ */ jsxs8(
           "button",
@@ -1155,7 +1180,7 @@ function EmptyState({ onEnroll }) {
             className: "inline-flex items-center gap-1.5 rounded-og-sm bg-og-accent px-3 py-1.5 text-og-sm font-medium text-og-accent-fg transition-colors hover:bg-og-accent-strong pointer-coarse:min-h-11",
             children: [
               /* @__PURE__ */ jsx8(PlusIcon, { className: "size-3.5", "aria-hidden": true }),
-              "Enroll a machine"
+              "Connect a machine"
             ]
           }
         ) : null
@@ -1195,7 +1220,7 @@ function Header({
           className: "inline-flex items-center gap-1.5 rounded-og-sm border border-og-border px-2.5 py-1 text-og-sm font-medium text-og-fg-muted transition-colors hover:border-og-border-strong hover:text-og-fg pointer-coarse:min-h-11",
           children: [
             /* @__PURE__ */ jsx8(PlusIcon, { className: "size-3.5", "aria-hidden": true }),
-            "Enroll machine"
+            "Connect a machine"
           ]
         }
       ) : null
@@ -1724,6 +1749,9 @@ function OpenGeniProvider({
   );
   const callbackRef = useRef2(onWorkspaceControlEvent);
   const reconcilersRef = useRef2(/* @__PURE__ */ new Map());
+  const reconcileInFlightRef = useRef2(/* @__PURE__ */ new Map());
+  const workspaceControlSequencesRef = useRef2(/* @__PURE__ */ new Map());
+  const pageLive = usePageLiveActivity();
   callbackRef.current = onWorkspaceControlEvent;
   const verifyApiContract = useCallback(async () => {
     try {
@@ -1756,28 +1784,54 @@ function OpenGeniProvider({
     []
   );
   const reconcileSession = useMemo(
-    () => async (sessionId) => {
-      await verifyApiContract();
-      const callbacks = [...reconcilersRef.current.get(sessionId)?.values() ?? []];
-      await Promise.all(callbacks.map((reconcile) => reconcile()));
+    () => (sessionId) => {
+      const existing = reconcileInFlightRef.current.get(sessionId);
+      if (existing) return existing;
+      const promise = (async () => {
+        await withTimeout(verifyApiContract(), 1e4, "API contract reconciliation");
+        const callbacks = [...reconcilersRef.current.get(sessionId)?.values() ?? []];
+        await withTimeout(
+          Promise.all(callbacks.map((reconcile) => reconcile())).then(() => void 0),
+          15e3,
+          "session reconciliation"
+        );
+      })().finally(() => {
+        if (reconcileInFlightRef.current.get(sessionId) === promise) {
+          reconcileInFlightRef.current.delete(sessionId);
+        }
+      });
+      reconcileInFlightRef.current.set(sessionId, promise);
+      return promise;
     },
     [verifyApiContract]
   );
   useEffect(() => {
+    if (!pageLive) {
+      setWorkspaceControlConnectionState("idle");
+      return;
+    }
     const controller = new AbortController();
-    setWorkspaceControlEvent(null);
     setWorkspaceControlConnectionState("connecting");
     void (async () => {
       try {
         await verifyApiContract();
         const workspace = await client.getWorkspace(workspaceId);
+        const resumeAfter = Math.max(
+          workspaceControlSequencesRef.current.get(workspaceId) ?? 0,
+          workspace.inferenceControl.revision
+        );
+        workspaceControlSequencesRef.current.set(workspaceId, resumeAfter);
         const stream = client.streamWorkspaceControlEvents(workspaceId, {
-          after: workspace.inferenceControl.revision,
+          after: resumeAfter,
           signal: controller.signal,
           onStateChange: setWorkspaceControlConnectionState
         });
         for await (const event of stream) {
           if (controller.signal.aborted) return;
+          workspaceControlSequencesRef.current.set(
+            workspaceId,
+            Math.max(workspaceControlSequencesRef.current.get(workspaceId) ?? 0, event.sequence)
+          );
           setWorkspaceControlEvent(
             (current) => !current || event.sequence > current.sequence ? event : current
           );
@@ -1792,7 +1846,7 @@ function OpenGeniProvider({
       }
     })();
     return () => controller.abort();
-  }, [client, verifyApiContract, workspaceId]);
+  }, [client, pageLive, verifyApiContract, workspaceId]);
   const value = useMemo(
     () => ({
       client,
@@ -1816,6 +1870,20 @@ function OpenGeniProvider({
     contractMismatch ? /* @__PURE__ */ jsx12(ApiContractMismatchScreen, { mismatch: contractMismatch }) : null
   ] });
 }
+function withTimeout(promise, timeoutMs, label) {
+  let timer;
+  return Promise.race([
+    promise,
+    new Promise((_resolve, reject) => {
+      timer = setTimeout(
+        () => reject(new Error(`${label} timed out after ${timeoutMs}ms`)),
+        timeoutMs
+      );
+    })
+  ]).finally(() => {
+    if (timer !== void 0) clearTimeout(timer);
+  });
+}
 function ApiContractMismatchScreen({ mismatch }) {
   return /* @__PURE__ */ jsx12(
     "div",
@@ -1856,6 +1924,23 @@ function reloadForContractMismatchOnce(mismatch) {
 
 // src/hooks/use-machines.ts
 var EMPTY = { activeSandboxId: null, activeEpoch: 0, machines: [] };
+function swapFailureMessage(result) {
+  if (result.reason?.trim()) return result.reason;
+  switch (result.code) {
+    case "recovery_in_progress":
+      return "The managed sandbox is still recovering. Try again shortly.";
+    case "recovery_degraded":
+      return "The managed sandbox recovery is degraded and needs attention.";
+    case "recovery_unrecoverable":
+      return "The managed sandbox could not be recovered.";
+    case "offline_enrollment":
+      return "The selected machine is offline.";
+    case "concurrent_swap":
+      return "The session route changed concurrently. Refresh and try again.";
+    default:
+      return "The session stayed on its current sandbox.";
+  }
+}
 function useMachines(options = {}) {
   const { client, workspaceId } = useOpenGeni(options);
   const machinesClient = options.machinesClient ?? client;
@@ -1884,8 +1969,11 @@ function useMachines(options = {}) {
   const { run, mutating, mutationError, clearMutationError } = useMutationRunner(identityKey);
   const [attachState, setAttachState] = useState4(() => ({ identity: identityKey, sandboxId: null }));
   const attachingSandboxId = attachState.identity === identityKey ? attachState.sandboxId : null;
+  const [removeState, setRemoveState] = useState4(() => ({ identity: identityKey, enrollmentId: null }));
+  const removingEnrollmentId = removeState.identity === identityKey ? removeState.enrollmentId : null;
   const data = loadedData ?? EMPTY;
   const canAttach = sessionId !== void 0 && (typeof machinesClient.attachMachine === "function" || typeof machinesClient.swapActiveSandbox === "function");
+  const canRemove = typeof machinesClient.removeEnrollment === "function";
   const attach = useCallback2(
     async (sandboxId) => {
       if (sessionId === void 0) return false;
@@ -1894,7 +1982,10 @@ function useMachines(options = {}) {
       const ownedIdentity = identityKey;
       setAttachState({ identity: ownedIdentity, sandboxId });
       const result = await run(async () => {
-        await runSwap();
+        const response = await runSwap();
+        if (response && typeof response === "object" && "swapped" in response && response.swapped === false) {
+          throw new Error(swapFailureMessage(response));
+        }
         return true;
       });
       if (identityRef.current === ownedIdentity) {
@@ -1912,6 +2003,24 @@ function useMachines(options = {}) {
     },
     [machinesClient, workspaceId]
   );
+  const remove = useCallback2(
+    async (enrollmentId, request = {}) => {
+      if (!machinesClient.removeEnrollment) return null;
+      const ownedIdentity = identityKey;
+      setRemoveState({ identity: ownedIdentity, enrollmentId });
+      const result = await run(
+        () => machinesClient.removeEnrollment(workspaceId, enrollmentId, request)
+      );
+      if (identityRef.current === ownedIdentity) {
+        setRemoveState({ identity: ownedIdentity, enrollmentId: null });
+        if (result?.outcome === "removed" || result?.outcome === "already_removed") {
+          await refresh();
+        }
+      }
+      return result;
+    },
+    [machinesClient, workspaceId, identityKey, run, refresh]
+  );
   return {
     machines: data.machines,
     activeSandboxId: data.activeSandboxId,
@@ -1922,8 +2031,11 @@ function useMachines(options = {}) {
     attach,
     canAttach,
     fetchSeries,
-    attaching: mutating,
+    attaching: mutating && attachingSandboxId !== null,
     attachingSandboxId,
+    remove,
+    canRemove,
+    removingEnrollmentId,
     mutationError,
     clearMutationError
   };
@@ -1957,4 +2069,4 @@ export {
   OpenGeniProvider,
   useMachines
 };
-//# sourceMappingURL=chunk-6EDV6YFE.js.map
+//# sourceMappingURL=chunk-X4S56Y2H.js.map