@dxos/shell 0.6.1-main.e05b43b → 0.6.1-main.fac53f5

package/dist/bundle/shell.mjs

@@ -11,7 +11,7 @@ import * as React from "react";
 import React__default, { createContext, useContext, createElement, isValidElement, cloneElement, useState, useRef, useEffect, useMemo, useCallback, forwardRef, Children, Fragment, useLayoutEffect, useReducer, Suspense, StrictMode } from "react";
 import * as $7SXl2$reactdom from "react-dom";
 import $7SXl2$reactdom__default, { flushSync } from "react-dom";
-import { CaretDown, CaretRight, Minus, Check, Database, Power, Plus, Copy, UserCircle, Palette, Compass, Desktop, Robot, DeviceMobile, Devices, DotsThree, ShareFat, X, Placeholder, Warning, Key, PlugsConnected, Plugs, QrCode, Textbox, UserPlus, UsersThree, Planet } from "@phosphor-icons/react";
+import { CaretDown, CaretRight, Minus, Check, Database, Power, Plus, ArrowsClockwise, Copy, UserCircle, Palette, Compass, Desktop, Robot, DeviceMobile, Devices, DotsThree, ShareFat, X, Placeholder, Warning, Key, PlugsConnected, Plugs, QrCode, Textbox, UserPlus, UsersThree, Planet } from "@phosphor-icons/react";
 import { SpaceMember as SpaceMember$1, useMembers, useSpaceInvitations, useSpace } from "@dxos/react-client/echo";
 import { useClient, useAgentHostingClient, AlreadyJoinedError, useMulticastObservable, useConfig, ShellLayout as ShellLayout$1, ShellDisplay as ShellDisplay$1, ClientServicesProxy, Client, ClientContext, SystemStatus as SystemStatus$1, AgentHostingProvider, Config } from "@dxos/react-client";
 import { DeviceKind as DeviceKind$1, Device as Device$1, DeviceType, useHaloInvitations, useDevices, useIdentity } from "@dxos/react-client/halo";
@@ -25857,39 +25857,66 @@ var hueTheme = {
   const q = get$1(_, $);
   return typeof q == "function" ? q(j, ...U) : I;
 }, defaultTx = bindTheme(defaultTheme);
-const AgentConfig = ({ agentActive: _, agentStatus: $, onAgentDestroy: I, onAgentCreate: j }) => {
-  const { t: U } = useTranslation("os");
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("h2", { className: mx(descriptionText, "text-center mbs-4") }, U("agent heading")), _ ? /* @__PURE__ */ React__default.createElement("div", { role: "group", className: "flex gap-2 items-center" }, /* @__PURE__ */ React__default.createElement(Avatar.Root, { status: $ ? "active" : "inactive", variant: "square" }, /* @__PURE__ */ React__default.createElement(Avatar.Frame, { classNames: "place-self-center" }, /* @__PURE__ */ React__default.createElement(Database, { weight: "duotone", width: 24, height: 24, x: 8, y: 8 })), /* @__PURE__ */ React__default.createElement(Avatar.Label, { classNames: "flex-1 text-sm truncate" }, U("agent device label"))), /* @__PURE__ */ React__default.createElement(Tooltip.Root, null, /* @__PURE__ */ React__default.createElement(Tooltip.Trigger, { asChild: !0 }, /* @__PURE__ */ React__default.createElement(
-    Button,
+const AgentConfig = ({
+  agentStatus: _,
+  validationMessage: $,
+  onAgentDestroy: I,
+  onAgentCreate: j,
+  onAgentRefresh: U
+}) => {
+  const { t: q } = useTranslation("os");
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("h2", { className: mx(descriptionText, "text-center mbs-4") }, q("agent heading")), $ && /* @__PURE__ */ React__default.createElement("p", { role: "alert", className: mx(valenceColorText("error"), "mlb-2") }, $), _ === "created" || _ === "creating" || _ === "getting" || _ === "destroying" ? /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
+    "div",
     {
-      variant: "ghost",
-      classNames: "pli-0 is-[--rail-action] bs-[--rail-action]",
-      "data-testid": "agent.destroy",
-      onClick: I
+      role: "group",
+      className: "mlb-2 flex gap-2 items-center",
+      "aria-describedby": "devices-panel.create-agent.description"
     },
-    /* @__PURE__ */ React__default.createElement("span", { className: "sr-only" }, U("destroy agent label")),
-    /* @__PURE__ */ React__default.createElement(Power, { className: getSize(5) })
-  )), /* @__PURE__ */ React__default.createElement(Tooltip.Portal, null, /* @__PURE__ */ React__default.createElement(Tooltip.Content, { side: "bottom", classNames: "z-50" }, U("destroy agent label"))))) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
+    /* @__PURE__ */ React__default.createElement(Avatar.Root, { status: _ === "created" ? "warning" : "inactive", variant: "square" }, /* @__PURE__ */ React__default.createElement(Avatar.Frame, { classNames: "place-self-center" }, /* @__PURE__ */ React__default.createElement(
+      Database,
+      {
+        weight: "duotone",
+        width: 24,
+        height: 24,
+        x: 8,
+        y: 8,
+        ..._ !== "created" && { className: "opacity-50" }
+      }
+    )), /* @__PURE__ */ React__default.createElement(Avatar.Label, { classNames: "flex-1 text-sm truncate" }, q(
+      _ === "created" ? "agent requested label" : _ === "creating" ? "creating agent label" : _ === "destroying" ? "destroying agent label" : "getting agent label"
+    ))),
+    _ === "created" && /* @__PURE__ */ React__default.createElement(Tooltip.Root, null, /* @__PURE__ */ React__default.createElement(Tooltip.Trigger, { asChild: !0 }, /* @__PURE__ */ React__default.createElement(
+      Button,
+      {
+        variant: "ghost",
+        classNames: "pli-0 is-[--rail-action] bs-[--rail-action]",
+        "data-testid": "agent.destroy",
+        onClick: I
+      },
+      /* @__PURE__ */ React__default.createElement("span", { className: "sr-only" }, q("destroy agent label")),
+      /* @__PURE__ */ React__default.createElement(Power, { className: getSize(5) })
+    )), /* @__PURE__ */ React__default.createElement(Tooltip.Portal, null, /* @__PURE__ */ React__default.createElement(Tooltip.Content, { side: "bottom", classNames: "z-50" }, q("destroy agent label"))))
+  ), _ === "created" && /* @__PURE__ */ React__default.createElement("p", { id: "devices-panel.create-agent.description", className: mx(descriptionText, "mlb-2") }, q("agent requested description"))) : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(
     Button,
     {
       variant: "ghost",
       classNames: "mlb-2 is-full justify-start gap-2 !pis-0 !pie-3",
-      "data-testid": "devices-panel.create-agent",
-      onClick: j,
+      "data-testid": _ === "creatable" ? "devices-panel.create-agent" : "devices-panel.agent-error",
+      onClick: _ === "creatable" ? j : U,
       "aria-describedby": "devices-panel.create-agent.description"
     },
-    /* @__PURE__ */ React__default.createElement("div", { role: "img", className: mx(getSize(8), "m-1 rounded-sm surface-input grid place-items-center") }, /* @__PURE__ */ React__default.createElement(Plus, { weight: "light", className: getSize(6) })),
-    /* @__PURE__ */ React__default.createElement("span", { className: "grow font-medium text-start" }, U("create agent label"))
-  ), /* @__PURE__ */ React__default.createElement("p", { id: "devices-panel.create-agent.clickwrap-message", className: mx(descriptionText, "mbe-2") }, /* @__PURE__ */ React__default.createElement(
+    /* @__PURE__ */ React__default.createElement("div", { role: "img", className: mx(getSize(8), "m-1 rounded-sm surface-input grid place-items-center") }, _ === "creatable" ? /* @__PURE__ */ React__default.createElement(Plus, { weight: "light", className: getSize(6) }) : /* @__PURE__ */ React__default.createElement(ArrowsClockwise, { weight: "light", className: getSize(6) })),
+    /* @__PURE__ */ React__default.createElement("span", { className: "grow font-medium text-start" }, q(_ === "creatable" ? "create agent label" : ""))
+  ), _ === "creatable" && /* @__PURE__ */ React__default.createElement("div", { role: "none", className: "space-y-2", id: "devices-panel.create-agent.description" }, /* @__PURE__ */ React__default.createElement("p", { className: descriptionText }, /* @__PURE__ */ React__default.createElement(
     Trans,
     {
-      t: U,
+      t: q,
       i18nKey: "create agent clickwrap",
       components: {
         tosLink: /* @__PURE__ */ React__default.createElement(Link, { target: "_blank", rel: "noreferrer" })
       }
     }
-  )), /* @__PURE__ */ React__default.createElement("p", { id: "devices-panel.create-agent.description", className: descriptionText }, U("create agent description"))));
+  )), /* @__PURE__ */ React__default.createElement("p", { className: descriptionText }, q("create agent description")))));
 }, ClipboardContext = createContext({
   textValue: "",
   setTextValue: async (_) => {
@@ -69864,39 +69891,67 @@ const IdentityListItem = forwardRef(({ identity: _, presence: $, onClick: I, cla
   x: 8,
   y: 8
 }, DeviceListItem = forwardRef(
-  ({ device: _, onClickAdd: $, onClickEdit: I, onClickReset: j, onClickJoinExisting: U, classNames: q, connectionState: G, ...K }, Y) => {
-    var re;
-    const { t: J } = useTranslation("os"), Z = keyToFallback(_.deviceKey), Q = useId("identityListItem__label"), ee = _.profile ? J("device name placeholder", { os: _.profile.os, platform: _.profile.platform }) : generateName(_.deviceKey.toHex()), te = _.kind === DeviceKind$1.CURRENT;
+  ({
+    device: _,
+    onClickAdd: $,
+    onClickEdit: I,
+    onClickReset: j,
+    onClickJoinExisting: U,
+    classNames: q,
+    connectionState: G,
+    onAgentDestroy: K,
+    ...Y
+  }, J) => {
+    var ae, se;
+    const { t: Z } = useTranslation("os"), Q = keyToFallback(_.deviceKey), ee = useId("identityListItem__label"), te = _.profile ? Z("device name placeholder", { os: _.profile.os, platform: _.profile.platform }) : generateName(_.deviceKey.toHex()), re = _.kind === DeviceKind$1.CURRENT;
     return /* @__PURE__ */ React__default.createElement(
       ListItem.Root,
       {
-        ...K,
+        ...Y,
         classNames: ["flex gap-2 items-center mlb-2", q],
-        "data-testid": `device-list-item${te ? "-current" : ""}`,
-        labelId: Q,
-        ref: Y
+        "data-testid": `device-list-item${re ? "-current" : ""}`,
+        labelId: ee,
+        ref: J
       },
       /* @__PURE__ */ React__default.createElement(
         Avatar.Root,
         {
-          status: te && G === ConnectionState$1.OFFLINE ? "error" : _.presence === Device$1.PresenceState.ONLINE ? "active" : "inactive",
-          labelId: Q,
-          hue: Z.hue,
+          status: re && G === ConnectionState$1.OFFLINE ? "error" : _.presence === Device$1.PresenceState.ONLINE ? "active" : "inactive",
+          labelId: ee,
+          hue: Q.hue,
           variant: "square"
         },
-        /* @__PURE__ */ React__default.createElement(Avatar.Frame, { classNames: "place-self-center" }, (re = _.profile) != null && re.type ? _.profile.type === DeviceType.BROWSER ? /* @__PURE__ */ React__default.createElement(Compass, { ...iconProps }) : _.profile.type === DeviceType.NATIVE ? /* @__PURE__ */ React__default.createElement(Desktop, { ...iconProps }) : [DeviceType.AGENT, DeviceType.AGENT_MANAGED].includes(_.profile.type) ? /* @__PURE__ */ React__default.createElement(Robot, { ...iconProps }) : _.profile.type === DeviceType.MOBILE ? /* @__PURE__ */ React__default.createElement(DeviceMobile, { ...iconProps }) : /* @__PURE__ */ React__default.createElement(Devices, { ...iconProps }) : /* @__PURE__ */ React__default.createElement(Avatar.Fallback, { text: Z.emoji })),
-        /* @__PURE__ */ React__default.createElement(Avatar.Label, { classNames: "flex-1 text-sm truncate" }, ee),
-        te && /* @__PURE__ */ React__default.createElement(Tag, { color: "primary" }, J("current device tag label")),
-        _.kind === DeviceKind$1.CURRENT && /* @__PURE__ */ React__default.createElement(DropdownMenu2.Root, null, /* @__PURE__ */ React__default.createElement(DropdownMenu2.Trigger, { asChild: !0 }, /* @__PURE__ */ React__default.createElement(
+        /* @__PURE__ */ React__default.createElement(Avatar.Frame, { classNames: "place-self-center" }, (ae = _.profile) != null && ae.type ? _.profile.type === DeviceType.AGENT_MANAGED ? /* @__PURE__ */ React__default.createElement(Database, { ...iconProps }) : _.profile.type === DeviceType.BROWSER ? /* @__PURE__ */ React__default.createElement(Compass, { ...iconProps }) : _.profile.type === DeviceType.NATIVE ? /* @__PURE__ */ React__default.createElement(Desktop, { ...iconProps }) : [DeviceType.AGENT, DeviceType.AGENT_MANAGED].includes(_.profile.type) ? /* @__PURE__ */ React__default.createElement(Robot, { ...iconProps }) : _.profile.type === DeviceType.MOBILE ? /* @__PURE__ */ React__default.createElement(DeviceMobile, { ...iconProps }) : /* @__PURE__ */ React__default.createElement(Devices, { ...iconProps }) : /* @__PURE__ */ React__default.createElement(Avatar.Fallback, { text: Q.emoji })),
+        /* @__PURE__ */ React__default.createElement(Avatar.Label, { classNames: "flex-1 text-sm truncate" }, te),
+        re && /* @__PURE__ */ React__default.createElement(Tag, { color: "primary" }, Z("current device tag label")),
+        ((se = _.profile) == null ? void 0 : se.type) === DeviceType.AGENT_MANAGED ? /* @__PURE__ */ React__default.createElement(Tooltip.Root, null, /* @__PURE__ */ React__default.createElement(Tooltip.Trigger, { asChild: !0 }, /* @__PURE__ */ React__default.createElement(
+          Button,
+          {
+            variant: "ghost",
+            classNames: "pli-0 is-[--rail-action] bs-[--rail-action]",
+            "data-testid": "agent.destroy",
+            onClick: K
+          },
+          /* @__PURE__ */ React__default.createElement("span", { className: "sr-only" }, Z("destroy agent label")),
+          /* @__PURE__ */ React__default.createElement(Power, { className: getSize(5) })
+        )), /* @__PURE__ */ React__default.createElement(Tooltip.Portal, null, /* @__PURE__ */ React__default.createElement(Tooltip.Content, { side: "bottom", classNames: "z-50" }, Z("destroy agent label")))) : _.kind === DeviceKind$1.CURRENT && /* @__PURE__ */ React__default.createElement(DropdownMenu2.Root, null, /* @__PURE__ */ React__default.createElement(DropdownMenu2.Trigger, { asChild: !0 }, /* @__PURE__ */ React__default.createElement(
           Button,
           {
             variant: "ghost",
             classNames: "pli-0 is-[--rail-action] bs-[--rail-action]",
-            "data-testid": `device-list-item${te ? "-current" : ""}.options`
+            "data-testid": `device-list-item${re ? "-current" : ""}.options`
           },
-          /* @__PURE__ */ React__default.createElement("span", { className: "sr-only" }, J("more options label")),
+          /* @__PURE__ */ React__default.createElement("span", { className: "sr-only" }, Z("more options label")),
           /* @__PURE__ */ React__default.createElement(DotsThree, { className: getSize(5) })
-        )), /* @__PURE__ */ React__default.createElement(DropdownMenu2.Content, null, /* @__PURE__ */ React__default.createElement(DropdownMenu2.Viewport, null, /* @__PURE__ */ React__default.createElement(DropdownMenu2.Item, { "data-testid": "device-list-item-current.join-existing", onClick: U }, /* @__PURE__ */ React__default.createElement(ShareFat, { className: getSize(5) }), J("choose join new identity label")), /* @__PURE__ */ React__default.createElement(DropdownMenu2.Item, { "data-testid": "device-list-item-current.reset", onClick: j }, /* @__PURE__ */ React__default.createElement(Power, { className: getSize(5) }), J("reset device label")))))
+        )), /* @__PURE__ */ React__default.createElement(DropdownMenu2.Content, null, /* @__PURE__ */ React__default.createElement(DropdownMenu2.Viewport, null, /* @__PURE__ */ React__default.createElement(
+          DropdownMenu2.Item,
+          {
+            "data-testid": "device-list-item-current.join-existing",
+            onClick: U
+          },
+          /* @__PURE__ */ React__default.createElement(ShareFat, { className: getSize(5) }),
+          Z("choose join new identity label")
+        ), /* @__PURE__ */ React__default.createElement(DropdownMenu2.Item, { "data-testid": "device-list-item-current.reset", onClick: j }, /* @__PURE__ */ React__default.createElement(Power, { className: getSize(5) }), Z("reset device label")))))
       )
     );
   }
@@ -69906,18 +69961,20 @@ const IdentityListItem = forwardRef(({ identity: _, presence: $, onClick: I, cla
   onClickAdd: I,
   onClickEdit: j,
   onClickReset: U,
-  onClickJoinExisting: q
+  onClickJoinExisting: q,
+  onAgentDestroy: G
 }) => {
-  const { t: G } = useTranslation("os");
-  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("h2", { className: mx(descriptionText, "text-center mbs-4") }, G("devices heading")), _.length > 0 && /* @__PURE__ */ React__default.createElement(List, null, _.map((K) => /* @__PURE__ */ React__default.createElement(
+  const { t: K } = useTranslation("os");
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement("h2", { className: mx(descriptionText, "text-center mbs-4") }, K("devices heading")), _.length > 0 && /* @__PURE__ */ React__default.createElement(List, null, _.map((Y) => /* @__PURE__ */ React__default.createElement(
     DeviceListItem,
     {
-      key: K.deviceKey.toHex(),
-      device: K,
-      onClickEdit: () => j == null ? void 0 : j(K),
+      key: Y.deviceKey.toHex(),
+      device: Y,
+      onClickEdit: () => j == null ? void 0 : j(Y),
       onClickReset: U,
       onClickJoinExisting: q,
-      connectionState: $
+      connectionState: $,
+      onAgentDestroy: G
     }
   ))), /* @__PURE__ */ React__default.createElement(
     Button,
@@ -69928,7 +69985,7 @@ const IdentityListItem = forwardRef(({ identity: _, presence: $, onClick: I, cla
       onClick: I
     },
     /* @__PURE__ */ React__default.createElement("div", { role: "img", className: mx(getSize(8), "m-1 rounded-sm surface-input grid place-items-center") }, /* @__PURE__ */ React__default.createElement(Plus, { weight: "light", className: getSize(6) })),
-    /* @__PURE__ */ React__default.createElement("span", { className: "grow font-medium text-start" }, G("choose add device label")),
+    /* @__PURE__ */ React__default.createElement("span", { className: "grow font-medium text-start" }, K("choose add device label")),
     /* @__PURE__ */ React__default.createElement(CaretRight, { weight: "bold", className: getSize(4) })
   ));
 }, minutesInMonth = 43200, minutesInDay = 1440;
@@ -70034,16 +70091,6 @@ function formatDistance(_, $, I) {
 function formatDistanceToNow(_, $) {
   return formatDistance(_, Date.now(), $);
 }
-var LogLevel;
-(function(_) {
-  _[_.TRACE = 5] = "TRACE", _[_.DEBUG = 10] = "DEBUG", _[_.INFO = 11] = "INFO", _[_.WARN = 12] = "WARN", _[_.ERROR = 13] = "ERROR";
-})(LogLevel || (LogLevel = {}));
-var QueryLogsRequest;
-(function(_) {
-  (function($) {
-    $[$.INCLUSIVE = 1] = "INCLUSIVE", $[$.EXPLICIT = 2] = "EXPLICIT";
-  })(_.MatchingOptions || (_.MatchingOptions = {}));
-})(QueryLogsRequest || (QueryLogsRequest = {}));
 var SystemStatus;
 (function(_) {
   _[_.ACTIVE = 0] = "ACTIVE", _[_.INACTIVE = 1] = "INACTIVE";
@@ -70110,6 +70157,16 @@ var ConnectionState;
 (function(_) {
   _[_.OFFLINE = 0] = "OFFLINE", _[_.ONLINE = 1] = "ONLINE";
 })(ConnectionState || (ConnectionState = {}));
+var LogLevel;
+(function(_) {
+  _[_.TRACE = 5] = "TRACE", _[_.DEBUG = 10] = "DEBUG", _[_.INFO = 11] = "INFO", _[_.WARN = 12] = "WARN", _[_.ERROR = 13] = "ERROR";
+})(LogLevel || (LogLevel = {}));
+var QueryLogsRequest;
+(function(_) {
+  (function($) {
+    $[$.INCLUSIVE = 1] = "INCLUSIVE", $[$.EXPLICIT = 2] = "EXPLICIT";
+  })(_.MatchingOptions || (_.MatchingOptions = {}));
+})(QueryLogsRequest || (QueryLogsRequest = {}));
 var ContextDisposedError = class extends Error {
   constructor() {
     super("Context disposed.");
@@ -79262,80 +79319,98 @@ const identityMachine = createMachine(
     }))
   }
 }), IdentityActionChooser = (_) => {
-  const { send: $ } = _, I = useClient(), j = useHaloInvitations(), U = useAgentHostingClient(), q = useCallback((K) => {
-    const Y = InvitationEncoder.encode(K);
-    K.state === Invitation.State.CONNECTING && log$2.info(JSON.stringify({ invitationCode: Y, authCode: K.authCode }));
-  }, []), G = () => {
-    j.forEach((Y) => Y.cancel());
-    const K = I.halo.share();
-    process.env.NODE_ENV !== "production" && K.subscribe(q), $ == null || $({ type: "selectInvitation", invitation: K });
+  const { send: $ } = _, I = useClient(), j = useHaloInvitations(), U = useCallback((G) => {
+    const K = InvitationEncoder.encode(G);
+    G.state === Invitation.State.CONNECTING && log$2.info(JSON.stringify({ invitationCode: K, authCode: G.authCode }));
+  }, []), q = () => {
+    j.forEach((K) => K.cancel());
+    const G = I.halo.share();
+    process.env.NODE_ENV !== "production" && G.subscribe(U), $ == null || $({ type: "selectInvitation", invitation: G });
   };
-  return /* @__PURE__ */ React__default.createElement(
-    IdentityActionChooserImpl,
-    {
-      ..._,
-      onCreateInvitationClick: G,
-      agentHostingEnabled: !!U
-    }
-  );
+  return /* @__PURE__ */ React__default.createElement(IdentityActionChooserImpl, { ..._, onCreateInvitationClick: q });
 }, IdentityActionChooserImpl = ({
   send: _,
   onCreateInvitationClick: $,
   devices: I,
   connectionState: j,
-  onAgentDestroy: U,
-  onAgentCreate: q,
-  agentStatus: G,
-  agentActive: K,
-  agentHostingEnabled: Y
-}) => /* @__PURE__ */ React__default.createElement("div", { role: "none", className: "bs-40 grow overflow-y-auto overflow-x-hidden" }, /* @__PURE__ */ React__default.createElement(
-  DeviceList,
-  {
-    devices: I,
-    connectionState: j,
-    onClickAdd: $,
-    onClickJoinExisting: () => _ == null ? void 0 : _({ type: "chooseJoinNewIdentity" }),
-    onClickReset: () => _ == null ? void 0 : _({ type: "chooseResetStorage" })
-  }
-), Y && /* @__PURE__ */ React__default.createElement(AgentConfig, { agentActive: K, agentStatus: G, onAgentDestroy: U, onAgentCreate: q })), useAgentHandlers = ({
+  agentHostingEnabled: U,
+  ...q
+}) => {
+  const G = I.find((K) => {
+    var Y;
+    return ((Y = K.profile) == null ? void 0 : Y.type) === DeviceType.AGENT_MANAGED;
+  });
+  return /* @__PURE__ */ React__default.createElement("div", { role: "none", className: "bs-40 grow overflow-y-auto overflow-x-hidden" }, /* @__PURE__ */ React__default.createElement(
+    DeviceList,
+    {
+      devices: I,
+      connectionState: j,
+      onClickAdd: $,
+      onClickJoinExisting: () => _ == null ? void 0 : _({ type: "chooseJoinNewIdentity" }),
+      onClickReset: () => _ == null ? void 0 : _({ type: "chooseResetStorage" }),
+      onAgentDestroy: q.onAgentDestroy
+    }
+  ), !G && U && /* @__PURE__ */ React__default.createElement(AgentConfig, { ...q }));
+}, useAgentHandlers = ({
   invitations: _,
   identity: $
 }) => {
-  const [I, j] = useState(""), [U, q] = useState(""), [G, K] = useState(!1), Y = useAgentHostingClient(), J = useClient();
-  useEffect(() => {
-    (async () => {
-      if (Y) {
-        const re = await (Y == null ? void 0 : Y.getAgent(($ == null ? void 0 : $.identityKey.truncate()) ?? "foo"));
-        re ? (K(!0), q(re)) : (K(!1), j("No agent deployed via provider."));
-      } else
-        j("No agent provider configured.");
-    })();
-  }, []);
-  const Z = useCallback(async (te) => {
-    const re = InvitationEncoder.encode(te);
-    if (te.state === Invitation.State.CONNECTING && (log$2.info(JSON.stringify({ invitationCode: re, authCode: te.authCode })), invariant($, "Identity not found"), Y))
+  const [I, j] = useState(""), [U, q] = useState("getting"), G = useAgentHostingClient(), K = useClient(), Y = async () => {
+    if (G) {
+      q("getting");
+      try {
+        const re = await (G == null ? void 0 : G.getAgent(($ == null ? void 0 : $.identityKey.truncate()) ?? "never"));
+        q(re ? "created" : "creatable");
+      } catch (re) {
+        q("error"), j(`Couldn’t check agent status: ${re.message}`);
+      }
+    } else
+      q("error"), j("No agent provider configured.");
+  }, J = async (re) => {
+    if (invariant($, "Identity not found"), G) {
+      q("creating"), j("");
       try {
-        const ae = await (Y == null ? void 0 : Y.createAgent(re, $.identityKey.truncate()));
-        q(ae), K(!0), j("");
+        await (G == null ? void 0 : G.createAgent(re, $.identityKey.truncate())) ? q("created") : (q("creatable"), j("Error creating agent."));
       } catch (ae) {
-        j(`error creating agent: ${ae.message}`);
+        return j(`Error creating agent: ${ae.message}`), Y();
       }
+    } else
+      q("error"), j("No agent provider configured.");
+  }, Z = async () => {
+    if (invariant($, "Identity not found"), G) {
+      q("destroying"), j("");
+      try {
+        await (G == null ? void 0 : G.destroyAgent($.identityKey.truncate())), q("creatable");
+      } catch (re) {
+        return j(`Error destroying agent: ${re.message}`), Y();
+      }
+    } else
+      q("error"), j("No agent provider configured.");
+  };
+  useEffect(() => {
+    Y();
   }, []);
-  return { onAgentCreate: async () => {
-    _.forEach((re) => re.cancel()), J.halo.share({
-      type: Invitation.Type.INTERACTIVE,
-      authMethod: Invitation.AuthMethod.NONE,
-      multiUse: !0
-    }).subscribe(Z);
-  }, onAgentDestroy: async () => {
-    const te = J.halo.identity.get();
-    invariant(te, "Identity not found");
-    try {
-      await (Y == null ? void 0 : Y.destroyAgent(te.identityKey.truncate())), j("No agent deployed via provider."), q(""), K(!1);
-    } catch (re) {
-      j(`error destroying agent: ${re.message}`);
-    }
-  }, validationMessage: I, agentStatus: U, agentActive: G };
+  const Q = useCallback(async (re) => {
+    const ae = InvitationEncoder.encode(re);
+    if (re.state === Invitation.State.CONNECTING)
+      return log$2.info(JSON.stringify({ invitationCode: ae, authCode: re.authCode })), J(ae);
+  }, []);
+  return {
+    onAgentCreate: async () => {
+      _.forEach((ae) => ae.cancel()), K.halo.share({
+        type: Invitation.Type.INTERACTIVE,
+        authMethod: Invitation.AuthMethod.NONE,
+        multiUse: !0
+      }).subscribe(Q);
+    },
+    onAgentDestroy: Z,
+    onAgentRefresh: async () => {
+      j(""), await Y();
+    },
+    validationMessage: I,
+    agentStatus: U,
+    agentHostingEnabled: !!G
+  };
 };
 var qrcode = { exports: {} };
 (function(_, $) {
@@ -80632,7 +80707,7 @@ const invitationStatusValue = /* @__PURE__ */ new Map([
   )), /* @__PURE__ */ React__default.createElement(Toolbar.Root, { classNames: "flex justify-center items-center gap-1 pt-3" }, /* @__PURE__ */ React__default.createElement(EmojiPickerToolbarButton, { emoji: Q, onChangeEmoji: le, classNames: "bs-[--rail-action]" }), /* @__PURE__ */ React__default.createElement(HuePickerToolbarButton, { hue: te, onChangeHue: de, classNames: "bs-[--rail-action]" }), /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Tooltip.Root, null, /* @__PURE__ */ React__default.createElement(Tooltip.Trigger, { asChild: !0 }, /* @__PURE__ */ React__default.createElement(
     Toolbar.Button,
     {
-      classNames: "bs-[--rail-action] justify-self-start",
+      classNames: "bs-[--rail-action]",
       "data-testid": "update-profile-form-copy-key",
       onClick: () => se(fe)
     },
@@ -80641,10 +80716,7 @@ const invitationStatusValue = /* @__PURE__ */ new Map([
   )), /* @__PURE__ */ React__default.createElement(Tooltip.Portal, null, /* @__PURE__ */ React__default.createElement(Tooltip.Content, { side: "bottom", classNames: "z-50" }, Y(oe ? "copy success label" : "copy self public key label"), /* @__PURE__ */ React__default.createElement(Tooltip.Arrow, null))), /* @__PURE__ */ React__default.createElement(Tooltip.Root, null, /* @__PURE__ */ React__default.createElement(Tooltip.Trigger, { asChild: !0 }, /* @__PURE__ */ React__default.createElement(
     Toolbar.Button,
     {
-      classNames: [
-        "bs-[--rail-action] is-[--rail-action] justify-self-end",
-        !he && "text-error-500"
-      ],
+      classNames: ["bs-[--rail-action]", !he && "text-error-500"],
       onClick: () => G == null ? void 0 : G(he ? ConnectionState$1.OFFLINE : ConnectionState$1.ONLINE)
     },
     /* @__PURE__ */ React__default.createElement("span", { className: "sr-only" }, Y(he ? "disconnect label" : "connect label")),
@@ -88290,7 +88362,12 @@ const os = {
   "create agent label": "Start an agent",
   "destroy agent label": "Shut down agent",
   "agent device label": "Your agent",
-  "shell fallback title": "Shell failed to connect"
+  "shell fallback title": "Shell failed to connect",
+  "creating agent label": "Starting agent…",
+  "destroying agent label": "Stopping agent…",
+  "getting agent label": "Checking agent status…",
+  "agent requested label": "Agent requested",
+  "agent requested description": "The agent service is creating an agent for you. Once the agent connects, it will display in the devices list."
 }, enUS = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   os