@decentnetwork/beagle 0.1.23 → 0.1.25

package/dist/desktop/app.js

@@ -1,4 +1,4 @@
-window.__DK_UI_VERSION="0.1.22";
+window.__DK_UI_VERSION="0.1.24";
 const ICON_PATHS = {
   // ---- tab bar (the four must feel like one set) ----
   users: '<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M22 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/>',
@@ -627,9 +627,25 @@ function DkBot({ seed, size = 30, radius = 7 }) {
     justifyContent: "center"
   } }, /* @__PURE__ */ React.createElement(Icon, { name: "bot", size: size * 0.56, color: "#fff", stroke: 1.9 }));
 }
+function DkImgAvatar({ url, seed, size, radius }) {
+  const [broken, setBroken] = React.useState(false);
+  if (broken)
+    return /* @__PURE__ */ React.createElement(DkIdenticon, { seed, size, radius });
+  return /* @__PURE__ */ React.createElement(
+    "img",
+    {
+      src: url,
+      alt: "",
+      width: size,
+      height: size,
+      onError: () => setBroken(true),
+      style: { width: size, height: size, borderRadius: radius, objectFit: "cover", flexShrink: 0, background: "var(--panel-2)" }
+    }
+  );
+}
 function DkAvatar({ peer, size = 30, radius = 7, dot = true }) {
   const d = Math.max(8, size * 0.3);
-  return /* @__PURE__ */ React.createElement("div", { style: { position: "relative", width: size, height: size, flexShrink: 0 } }, peer.agent ? /* @__PURE__ */ React.createElement(DkBot, { seed: peer.id, size, radius }) : /* @__PURE__ */ React.createElement(DkIdenticon, { seed: peer.userId || peer.id, size, radius }), dot && /* @__PURE__ */ React.createElement("span", { style: {
+  return /* @__PURE__ */ React.createElement("div", { style: { position: "relative", width: size, height: size, flexShrink: 0 } }, peer.agent ? /* @__PURE__ */ React.createElement(DkBot, { seed: peer.id, size, radius }) : peer.avatarUrl ? /* @__PURE__ */ React.createElement(DkImgAvatar, { url: peer.avatarUrl, seed: peer.userId || peer.id, size, radius }) : peer.punkId != null ? /* @__PURE__ */ React.createElement(DkPunkAvatar, { id: peer.punkId, size, radius, fallbackSeed: peer.userId || peer.id }) : /* @__PURE__ */ React.createElement(DkIdenticon, { seed: peer.userId || peer.id, size, radius }), dot && /* @__PURE__ */ React.createElement("span", { style: {
     position: "absolute",
     right: -2,
     bottom: -2,
@@ -764,7 +780,7 @@ function Btn({ children, icon, tone = "ghost", onClick, size = "md", title, styl
 function Section({ label, count, trailing, style }) {
   return /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, padding: "0 2px", ...style } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, fontWeight: 700, letterSpacing: 1, textTransform: "uppercase", color: "var(--faint)" } }, label), count != null && /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 11, fontWeight: 700, color: "var(--faint)" } }, count), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, height: 1, background: "var(--line)" } }), trailing);
 }
-Object.assign(window, { DkIdenticon, DkBot, DkAvatar, StatusDot, Mono, shortKey, RouteTag, Tag, Unread, Btn, Section });
+Object.assign(window, { DkIdenticon, DkBot, DkAvatar, DkImgAvatar, StatusDot, Mono, shortKey, RouteTag, Tag, Unread, Btn, Section });
 const __TWEAKS_STYLE = `
   .twk-panel{position:fixed;right:16px;bottom:16px;z-index:2147483646;width:280px;
     max-height:calc(100vh - 32px);display:flex;flex-direction:column;
@@ -1586,6 +1602,7 @@ function DkGroupSender({ grp, T, avatar }) {
   const [open, setOpen] = React.useState(false);
   const [busy, setBusy] = React.useState(false);
   const [done, setDone] = React.useState(null);
+  const [showProf, setShowProf] = React.useState(false);
   const seed = grp.senderId || grp.sender;
   const addFriend = () => {
     setBusy(true);
@@ -1638,7 +1655,26 @@ function DkGroupSender({ grp, T, avatar }) {
       }
     },
     done || (T && T.add || "Add friend")
-  )) : /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--ui)", fontSize: 11.5, color: "var(--dim)", lineHeight: 1.45 } }, T && T.groupSenderUnknown || "The group relays only this display name. Register Beagle as a group agent (/agent add <beagle address> in the group) to receive full member identities you can add as friends."))));
+  ), /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      onClick: () => {
+        setOpen(false);
+        setShowProf(true);
+      },
+      style: {
+        padding: "6px 10px",
+        borderRadius: 8,
+        border: "1px solid var(--line)",
+        background: "transparent",
+        color: "var(--text)",
+        fontFamily: "var(--ui)",
+        fontSize: 12,
+        cursor: "pointer"
+      }
+    },
+    T && T.pubOpen || "View public profile"
+  )) : /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--ui)", fontSize: 11.5, color: "var(--dim)", lineHeight: 1.45 } }, T && T.groupSenderUnknown || "The group relays only this display name. Register Beagle as a group agent (/agent add <beagle address> in the group) to receive full member identities you can add as friends."))), showProf && grp.senderId && /* @__PURE__ */ React.createElement(DkPublicProfile, { T, userid: grp.senderId, fallbackName: grp.sender, onClose: () => setShowProf(false) }));
 }
 function dkThreadIsGroup(thread) {
   return (thread || []).some((m) => !m.day && m.dir !== "out" && !m.file && (dkGroupParse(m.text) || {}).strong);
@@ -2149,6 +2185,7 @@ function Conversation({ T, peer, lang, thread: threadProp, onSend, onSendFile, o
   const fileRef = React.useRef(null);
   const rtcFileRef = React.useRef(null);
   const [menu, setMenu] = React.useState(false);
+  const [pubProfile, setPubProfile] = React.useState(false);
   const [selMode, setSelMode] = React.useState(false);
   const [sel, setSel] = React.useState(() => /* @__PURE__ */ new Set());
   const [hidden, setHidden] = React.useState(() => /* @__PURE__ */ new Set());
@@ -2397,7 +2434,7 @@ function Conversation({ T, peer, lang, thread: threadProp, onSend, onSendFile, o
       onDrop
     },
     dragOver && /* @__PURE__ */ React.createElement("div", { style: { position: "absolute", inset: 0, zIndex: 30, background: "rgba(91,140,255,0.10)", border: "2px dashed var(--accent)", borderRadius: 12, display: "flex", alignItems: "center", justifyContent: "center", pointerEvents: "none", fontFamily: "var(--mono)", fontSize: 14, color: "var(--accent)" } }, lang === "zh" ? "\u677E\u5F00\u53D1\u9001\u6587\u4EF6" : "Drop to send file"),
-    /* @__PURE__ */ React.createElement("div", { style: { height: 60, flexShrink: 0, borderBottom: "1px solid var(--line)", display: "flex", alignItems: "center", gap: 12, padding: "0 16px", background: "var(--panel)" } }, /* @__PURE__ */ React.createElement(DkAvatar, { peer, size: 34, radius: 8 }), /* @__PURE__ */ React.createElement("div", { style: { minWidth: 0 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: peer.alias ? "var(--ui)" : "var(--mono)", fontSize: 15, fontWeight: 700, color: "var(--text)" } }, peer.alias || shortKey(peer.userId, 10, 6)), peer.agent && /* @__PURE__ */ React.createElement(Tag, { tone: "accent" }, "agent"), isGroup && /* @__PURE__ */ React.createElement(Tag, null, T && T.groupTag || "group"), /* @__PURE__ */ React.createElement(RouteTag, { peer })), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, marginTop: 2 } }, /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: peer.userId, title: peer.userId }, shortKey(peer.userId, 10, 6)), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement("button", { onClick: () => onOpenNet(peer), title: T && T.openNet || "Network view", style: { background: "none", border: "none", cursor: "pointer", padding: 0, color: "var(--accent)", display: "inline-flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement(Icon, { name: "network", size: 12, stroke: 2 })), /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: peer.ip, title: peer.ip }, peer.ip), peer.address && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement(
+    /* @__PURE__ */ React.createElement("div", { style: { height: 60, flexShrink: 0, borderBottom: "1px solid var(--line)", display: "flex", alignItems: "center", gap: 12, padding: "0 16px", background: "var(--panel)" } }, /* @__PURE__ */ React.createElement("div", { onClick: () => setPubProfile(true), title: T && T.pubOpen || "View public profile", style: { cursor: "pointer", flexShrink: 0 } }, /* @__PURE__ */ React.createElement(DkAvatar, { peer, size: 34, radius: 8 })), /* @__PURE__ */ React.createElement("div", { style: { minWidth: 0 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8 } }, /* @__PURE__ */ React.createElement("span", { onClick: () => setPubProfile(true), style: { fontFamily: peer.alias ? "var(--ui)" : "var(--mono)", fontSize: 15, fontWeight: 700, color: "var(--text)", cursor: "pointer" } }, peer.alias || shortKey(peer.userId, 10, 6)), peer.agent && /* @__PURE__ */ React.createElement(Tag, { tone: "accent" }, "agent"), isGroup && /* @__PURE__ */ React.createElement(Tag, null, T && T.groupTag || "group"), /* @__PURE__ */ React.createElement(RouteTag, { peer })), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 8, marginTop: 2 } }, /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: peer.userId, title: peer.userId }, shortKey(peer.userId, 10, 6)), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement("button", { onClick: () => onOpenNet(peer), title: T && T.openNet || "Network view", style: { background: "none", border: "none", cursor: "pointer", padding: 0, color: "var(--accent)", display: "inline-flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement(Icon, { name: "network", size: 12, stroke: 2 })), /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: peer.ip, title: peer.ip }, peer.ip), peer.address && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement("span", { style: { color: "var(--line)" } }, "\xB7"), /* @__PURE__ */ React.createElement(
       Mono,
       {
         size: 11.5,
@@ -2555,7 +2592,8 @@ ${peer.address}`
         onClick: (e) => e.stopPropagation(),
         style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain", borderRadius: 6 }
       }
-    )))
+    ))),
+    pubProfile && /* @__PURE__ */ React.createElement(DkPublicProfile, { T, userid: peer.userId, fallbackName: peer.alias, onClose: () => setPubProfile(false) })
   );
 }
 function MenuItem({ icon, label, onClick, danger }) {
@@ -2890,6 +2928,40 @@ function DkPunkPicker({ T, onPick, onClose }) {
     /* @__PURE__ */ React.createElement("img", { src: p.image, alt: `punk #${p.id}`, style: { width: "100%", height: "100%", imageRendering: "pixelated", display: "block" } })
   ))))));
 }
+function DkPublicProfile({ T, userid, fallbackName, onClose }) {
+  const [st, setSt] = React.useState({ loading: true });
+  React.useEffect(() => {
+    let dead = false;
+    setSt({ loading: true });
+    fetch(`/api/ens-profile?userid=${encodeURIComponent(userid)}`).then((r) => r.json()).then((d) => {
+      if (!dead)
+        setSt({ loading: false, prof: d.ok && d.profile || null });
+    }).catch(() => {
+      if (!dead)
+        setSt({ loading: false, prof: null });
+    });
+    return () => {
+      dead = true;
+    };
+  }, [userid]);
+  const prof = st.prof;
+  const LINK_BASE = { twitter: "https://x.com/", linkedin: "https://www.linkedin.com/in/", github: "https://github.com/" };
+  const links = prof ? Object.entries(prof.links || {}) : [];
+  const lbl = { width: 110, flexShrink: 0, fontFamily: "var(--mono)", fontSize: 11, fontWeight: 600, color: "var(--faint)", textTransform: "uppercase", letterSpacing: 0.5 };
+  const rowS = { display: "flex", alignItems: "center", gap: 10, padding: "10px 0", borderTop: "1px solid var(--line)" };
+  return /* @__PURE__ */ React.createElement("div", { onClick: onClose, style: { position: "fixed", inset: 0, zIndex: 90, background: "color-mix(in oklab, #000, transparent 38%)", display: "flex", alignItems: "center", justifyContent: "center", padding: 24 } }, /* @__PURE__ */ React.createElement("div", { onClick: (e) => e.stopPropagation(), style: { width: 420, maxWidth: "94vw", background: "var(--panel)", border: "1px solid var(--line)", borderRadius: 16, padding: "20px 22px", display: "flex", flexDirection: "column", gap: 14 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 14 } }, prof && prof.avatarUrl ? /* @__PURE__ */ React.createElement(DkImgAvatar, { url: prof.avatarUrl, seed: userid, size: 56, radius: 14 }) : prof && prof.punkId != null ? /* @__PURE__ */ React.createElement(DkPunkAvatar, { id: prof.punkId, size: 56, radius: 14, fallbackSeed: userid }) : /* @__PURE__ */ React.createElement(DkIdenticon, { seed: userid, size: 56, radius: 14 }), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, minWidth: 0 } }, /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 17, fontWeight: 700, color: "var(--text)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" } }, prof && prof.displayName || fallbackName || shortKey(userid, 10, 6)), prof && prof.ens && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--mono)", fontSize: 12, color: "var(--accent)", marginTop: 2 } }, prof.ens)), /* @__PURE__ */ React.createElement(Btn, { icon: "x", size: "sm", onClick: onClose })), st.loading ? /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12.5, color: "var(--faint)" } }, T.dirLoading || "loading\u2026") : !prof ? /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12.5, color: "var(--faint)" } }, T.pubNone || "No public profile \u2014 this user has not registered a beagles.eth name.") : /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column" } }, prof.description && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12.5, color: "var(--dim)", paddingBottom: 12, lineHeight: 1.5 } }, prof.description), links.length > 0 && /* @__PURE__ */ React.createElement("div", { style: { ...rowS, gap: 8, flexWrap: "wrap" } }, /* @__PURE__ */ React.createElement("span", { style: lbl }, T.linksCard || "links"), links.map(([k, h]) => /* @__PURE__ */ React.createElement(
+    "a",
+    {
+      key: k,
+      href: (LINK_BASE[k] || "") + h,
+      target: "_blank",
+      rel: "noreferrer",
+      style: { display: "inline-flex", alignItems: "center", gap: 5, padding: "4px 10px", borderRadius: 999, border: "1px solid var(--line)", textDecoration: "none", fontFamily: "var(--ui)", fontSize: 12, color: "var(--accent)" }
+    },
+    k,
+    " \u2197"
+  ))), prof.eth && /* @__PURE__ */ React.createElement("div", { style: rowS }, /* @__PURE__ */ React.createElement("span", { style: lbl }, "ethereum"), /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: prof.eth, title: prof.eth }, shortKey(prof.eth, 8, 6))), prof.sol && /* @__PURE__ */ React.createElement("div", { style: rowS }, /* @__PURE__ */ React.createElement("span", { style: lbl }, "solana"), /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: prof.sol, title: prof.sol }, shortKey(prof.sol, 8, 6))), /* @__PURE__ */ React.createElement("div", { style: rowS }, /* @__PURE__ */ React.createElement("span", { style: lbl }, T.userId || "user id"), /* @__PURE__ */ React.createElement(Mono, { size: 11.5, dim: true, copy: userid, title: userid }, shortKey(userid, 10, 6))))));
+}
 function DkEnsCard({ T, me, onRecord }) {
   const [st, setSt] = React.useState({ loading: true });
   const [label, setLabel] = React.useState("");
@@ -3098,7 +3170,7 @@ function ProfileTab({ T, me, onEdit }) {
     setEditing(false);
   } }));
 }
-Object.assign(window, { ProfileTab, DkPunkAvatar });
+Object.assign(window, { ProfileTab, DkPunkAvatar, DkPublicProfile });
 function DkDirAvatar({ p, size }) {
   const [broken, setBroken] = React.useState(false);
   if (p.punkId != null && !(p.avatar && !broken)) {
@@ -4142,6 +4214,18 @@ const STR = {
     linksCard: "Links",
     linkPlaceholder: "username or profile URL",
     save: "save",
+    updTitle: "Update available",
+    updLater: "Later",
+    updNow: "Update now",
+    updRestart: "Restart",
+    updBusy: "Updating\u2026 (about a minute)",
+    updDone: "Updated \u2014 restart to apply.",
+    updRestarting: "Restarting\u2026 this page reloads when it\u2019s back. (If beagle was started by hand in a terminal, run it again.)",
+    updNpx: "Running via npx \u2014 restarting picks up the latest version automatically.",
+    updDev: "Running from a source checkout \u2014 update with:",
+    updLanNote: "agentnet (lan) updates separately; the daemon restart is manual:",
+    pubOpen: "View public profile",
+    pubNone: "No public profile \u2014 this user has not registered a beagles.eth name.",
     ensNoEthWallet: "no Ethereum wallet extension found (MetaMask\u2026)",
     ensNoSolWallet: "no Solana wallet extension found (Phantom\u2026)",
     ensWalletOwned: "registered via your mobile wallet as",
@@ -4286,6 +4370,18 @@ const STR = {
     linksCard: "\u793E\u4EA4\u8D26\u53F7",
     linkPlaceholder: "\u7528\u6237\u540D\u6216\u4E3B\u9875\u94FE\u63A5",
     save: "\u4FDD\u5B58",
+    updTitle: "\u53D1\u73B0\u65B0\u7248\u672C",
+    updLater: "\u7A0D\u540E",
+    updNow: "\u7ACB\u5373\u66F4\u65B0",
+    updRestart: "\u91CD\u542F",
+    updBusy: "\u66F4\u65B0\u4E2D\u2026(\u7EA6\u4E00\u5206\u949F)",
+    updDone: "\u66F4\u65B0\u5B8C\u6210\u2014\u2014\u91CD\u542F\u540E\u751F\u6548\u3002",
+    updRestarting: "\u6B63\u5728\u91CD\u542F\u2026\u5B8C\u6210\u540E\u672C\u9875\u4F1A\u81EA\u52A8\u5237\u65B0\u3002(\u5982\u679C beagle \u662F\u5728\u7EC8\u7AEF\u91CC\u624B\u52A8\u542F\u52A8\u7684,\u8BF7\u91CD\u65B0\u8FD0\u884C\u4E00\u6B21\u3002)",
+    updNpx: "\u4F60\u662F\u7528 npx \u8FD0\u884C\u7684\u2014\u2014\u91CD\u542F\u5373\u81EA\u52A8\u83B7\u53D6\u6700\u65B0\u7248\u3002",
+    updDev: "\u5F53\u524D\u4ECE\u6E90\u7801\u76EE\u5F55\u8FD0\u884C,\u8BF7\u624B\u52A8\u66F4\u65B0:",
+    updLanNote: "agentnet(lan)\u9700\u5355\u72EC\u5347\u7EA7,daemon \u91CD\u542F\u9700\u624B\u52A8\u6267\u884C:",
+    pubOpen: "\u67E5\u770B\u516C\u5F00\u8D44\u6599",
+    pubNone: "\u6682\u65E0\u516C\u5F00\u8D44\u6599\u2014\u2014\u5BF9\u65B9\u8FD8\u6CA1\u6709\u6CE8\u518C beagles.eth \u540D\u5B57\u3002",
     ensNoEthWallet: "\u672A\u68C0\u6D4B\u5230\u4EE5\u592A\u574A\u94B1\u5305\u63D2\u4EF6(MetaMask \u7B49)",
     ensNoSolWallet: "\u672A\u68C0\u6D4B\u5230 Solana \u94B1\u5305\u63D2\u4EF6(Phantom \u7B49)",
     ensWalletOwned: "\u5DF2\u901A\u8FC7\u624B\u673A\u94B1\u5305\u6CE8\u518C\u4E3A",
@@ -4333,12 +4429,82 @@ function RailBtn({ icon, label, active, soon, onClick }) {
     gap: 3
   } }, /* @__PURE__ */ React.createElement(Icon, { name: icon, size: 20, stroke: active ? 2.1 : 1.8, color: active ? "var(--accent)" : "var(--dim)" }), /* @__PURE__ */ React.createElement("span", { style: { fontSize: 9, fontWeight: 600, letterSpacing: 0.2, color: active ? "var(--accent)" : "var(--faint)" } }, label), soon && /* @__PURE__ */ React.createElement("span", { style: { position: "absolute", top: 5, right: 6, width: 6, height: 6, borderRadius: 999, background: "var(--warn)" } }));
 }
+function DkUpdateModal({ T, info, onClose }) {
+  const [phase, setPhase] = React.useState("idle");
+  const [err, setErr] = React.useState(null);
+  const behind = (info.updates || []).filter((u) => u.behind);
+  const appBehind = behind.some((u) => u.pkg !== "@decentnetwork/lan");
+  const lanBehind = behind.find((u) => u.pkg === "@decentnetwork/lan");
+  const short = (pkg) => pkg.replace("@decentnetwork/", "");
+  const doUpdate = () => {
+    setPhase("running");
+    setErr(null);
+    fetch("/api/update-run", { method: "POST" }).then((r) => r.json()).then((d) => {
+      if (d.ok)
+        setPhase("done");
+      else {
+        setPhase("error");
+        setErr(d.error || "update failed");
+      }
+    }).catch((e) => {
+      setPhase("error");
+      setErr(String(e && e.message || e));
+    });
+  };
+  const doRestart = () => {
+    setPhase("restarting");
+    fetch("/api/update-restart", { method: "POST" }).catch(() => {
+    });
+    const poll = setInterval(() => {
+      fetch("/api/update-check").then((r) => {
+        if (r.ok) {
+          clearInterval(poll);
+          window.location.reload();
+        }
+      }).catch(() => {
+      });
+    }, 1500);
+  };
+  const btn = (label, onClick, tone) => /* @__PURE__ */ React.createElement("button", { onClick, style: {
+    padding: "7px 14px",
+    borderRadius: 9,
+    cursor: "pointer",
+    fontFamily: "var(--ui)",
+    fontSize: 12.5,
+    border: tone ? "none" : "1px solid var(--line)",
+    background: tone ? "var(--accent)" : "transparent",
+    color: tone ? "#fff" : "var(--text)"
+  } }, label);
+  return /* @__PURE__ */ React.createElement("div", { style: { position: "fixed", inset: 0, zIndex: 95, background: "color-mix(in oklab, #000, transparent 38%)", display: "flex", alignItems: "center", justifyContent: "center", padding: 24 } }, /* @__PURE__ */ React.createElement("div", { style: { width: 430, maxWidth: "94vw", background: "var(--panel)", border: "1px solid var(--line)", borderRadius: 16, padding: "20px 22px", display: "flex", flexDirection: "column", gap: 14 } }, /* @__PURE__ */ React.createElement("span", { style: { fontFamily: "var(--mono)", fontSize: 13.5, fontWeight: 700, color: "var(--text)" } }, T.updTitle || "Update available"), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 6 } }, behind.map((u) => /* @__PURE__ */ React.createElement("div", { key: u.pkg, style: { display: "flex", alignItems: "center", gap: 10, fontFamily: "var(--mono)", fontSize: 12.5 } }, /* @__PURE__ */ React.createElement("span", { style: { width: 70, color: "var(--faint)" } }, short(u.pkg)), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--dim)" } }, u.current), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--faint)" } }, "\u2192"), /* @__PURE__ */ React.createElement("span", { style: { color: "var(--accent)", fontWeight: 700 } }, u.latest)))), phase === "idle" && appBehind && info.mode === "dev" && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12, color: "var(--dim)", lineHeight: 1.5 } }, T.updDev || "Running from a source checkout \u2014 update with:", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("code", { style: { fontFamily: "var(--mono)", fontSize: 11.5, color: "var(--text)" } }, "git pull && npm run build")), phase === "idle" && appBehind && info.mode === "npx" && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12, color: "var(--dim)", lineHeight: 1.5 } }, T.updNpx || "Running via npx \u2014 restarting picks up the latest version automatically."), lanBehind && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12, color: "var(--dim)", lineHeight: 1.5 } }, T.updLanNote || "agentnet (lan) updates separately; the daemon restart is manual:", /* @__PURE__ */ React.createElement("br", null), /* @__PURE__ */ React.createElement("code", { style: { fontFamily: "var(--mono)", fontSize: 11.5, color: "var(--text)", userSelect: "all" } }, "npm i -g @decentnetwork/lan@latest && sudo agentnet down && sudo agentnet up --real-tun")), phase === "running" && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12.5, color: "var(--dim)" } }, T.updBusy || "Updating\u2026 (about a minute)"), phase === "done" && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12.5, color: "var(--online)" } }, T.updDone || "Updated \u2014 restart to apply."), phase === "restarting" && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12.5, color: "var(--dim)" } }, T.updRestarting || "Restarting\u2026 this page reloads when it\u2019s back. (If beagle was started by hand in a terminal, run it again.)"), phase === "error" && /* @__PURE__ */ React.createElement("div", { style: { fontFamily: "var(--ui)", fontSize: 12, color: "var(--danger)", wordBreak: "break-word" } }, err), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", justifyContent: "flex-end", gap: 8 } }, (phase === "idle" || phase === "error") && btn(T.updLater || "Later", onClose), phase === "idle" && appBehind && info.mode === "global" && btn(T.updNow || "Update now", doUpdate, true), phase === "idle" && appBehind && info.mode === "npx" && btn(T.updRestart || "Restart", doRestart, true), phase === "done" && btn(T.updRestart || "Restart", doRestart, true))));
+}
 function DkApp() {
   const [t, setTweak] = useTweaks(DK_DEFAULTS);
   const [tab, setTab] = React.useState(t.startTab || "chat");
   const [activeId, setActiveId] = React.useState(null);
   const data = useDaemonData();
   const me = data.me;
+  const [upd, setUpd] = React.useState(null);
+  React.useEffect(() => {
+    let dead = false;
+    const check = () => fetch("/api/update-check").then((r) => r.json()).then((d) => {
+      if (dead || !d.ok)
+        return;
+      const behind = (d.updates || []).filter((u) => u.behind);
+      if (!behind.length)
+        return;
+      const key = behind.map((u) => u.pkg + "@" + u.latest).join(",");
+      if (localStorage.getItem("dk-upd-dismissed") === key)
+        return;
+      setUpd({ ...d, key });
+    }).catch(() => {
+    });
+    check();
+    const timer = setInterval(check, 6 * 3600 * 1e3);
+    return () => {
+      dead = true;
+      clearInterval(timer);
+    };
+  }, []);
   const [backend, setBackend] = React.useState(null);
   const refreshBackend = React.useCallback(() => {
     dkGet("/api/backend").then((b) => {
@@ -4555,6 +4721,16 @@ function DkApp() {
     color: "#fff",
     fontSize: 12,
     fontWeight: 600
-  } }, n.label)))), /* @__PURE__ */ React.createElement(IncomingCallModal, { T, ctl: callCtl, peers }), /* @__PURE__ */ React.createElement(CallOverlay, { T, ctl: callCtl, peers }), /* @__PURE__ */ React.createElement(RtcFileInbox, { T, peers, ctl: rtcFileCtl }));
+  } }, n.label)))), /* @__PURE__ */ React.createElement(IncomingCallModal, { T, ctl: callCtl, peers }), /* @__PURE__ */ React.createElement(CallOverlay, { T, ctl: callCtl, peers }), /* @__PURE__ */ React.createElement(RtcFileInbox, { T, peers, ctl: rtcFileCtl }), upd && /* @__PURE__ */ React.createElement(
+    DkUpdateModal,
+    {
+      T,
+      info: upd,
+      onClose: () => {
+        localStorage.setItem("dk-upd-dismissed", upd.key);
+        setUpd(null);
+      }
+    }
+  ));
 }
 ReactDOM.createRoot(document.getElementById("root")).render(/* @__PURE__ */ React.createElement(DkApp, null));

package/dist/server.js

@@ -154,6 +154,126 @@ async function ensAvatarDelete(call, fullName) {
         // best-effort only
     }
 }
+function ensPubFromEntry(ens, v) {
+    const t = v?.texts ?? {};
+    return {
+        ens,
+        avatarUrl: t.avatar || null,
+        punkId: v?.nft === "CryptoPunks" && typeof v?.nftid === "number" && v.nftid > 0 ? v.nftid : null,
+        displayName: t.displayName || null,
+        description: t.description || null,
+        links: {
+            ...(t["com.twitter"] ? { twitter: t["com.twitter"] } : {}),
+            ...(t["com.linkedin"] ? { linkedin: t["com.linkedin"] } : {}),
+            ...(t["com.github"] ? { github: t["com.github"] } : {}),
+        },
+        eth: v?.addresses?.["60"] || null,
+        sol: v?.addresses?.["501"] || null,
+    };
+}
+/** userid → EnsPub from the cached /names listing. Bounded wait so the UI
+ *  poll never blocks on a cold cache — the fetch continues in the background
+ *  and the next poll finds it cached. */
+async function ensPublicByUserid(maxWaitMs = 300) {
+    const p = fetchDiscoverJson(`${ENS_GATEWAY}/names`).catch(() => null);
+    const raw = (await Promise.race([p, new Promise((r) => setTimeout(() => r(null), maxWaitMs))]));
+    const map = new Map();
+    if (raw && typeof raw === "object") {
+        for (const [ens, v] of Object.entries(raw)) {
+            const uid = v?.texts?.carrierUserId;
+            if (uid)
+                map.set(uid, ensPubFromEntry(ens, v));
+        }
+    }
+    return map;
+}
+// ── self-update ─────────────────────────────────────────────────────────────
+// npm registry is consulted at most once per TTL (and only while a UI is
+// open); the UI pops a confirm dialog when something is behind. "Update"
+// reinstalls the global package in place and restarts this process —
+// pm2/launchd/systemd bring it back; a bare terminal run exits with a hint.
+const UPDATE_TTL_MS = 6 * 3600_000;
+const BEAGLE_PKG = "@decentnetwork/beagle";
+let updateCache = null;
+const BEAGLE_ROOT = join(dirname(fileURLToPath(import.meta.url)), "..");
+function beagleVersion() {
+    try {
+        return JSON.parse(readFileSync(join(BEAGLE_ROOT, "package.json"), "utf-8")).version ?? "";
+    }
+    catch {
+        return "";
+    }
+}
+/** How this copy of beagle got onto disk — decides what "update" can do.
+ *  npx cache paths contain _npx AND node_modules, so test _npx first. */
+function installMode() {
+    if (BEAGLE_ROOT.includes("_npx"))
+        return "npx";
+    if (BEAGLE_ROOT.includes(join("node_modules", "@decentnetwork", "beagle")))
+        return "global";
+    return "dev";
+}
+async function npmLatest(pkg) {
+    const ctl = new AbortController();
+    const t = setTimeout(() => ctl.abort(), 8000);
+    try {
+        const r = await fetch(`https://registry.npmjs.org/${pkg.replace("/", "%2F")}/latest`, { signal: ctl.signal });
+        if (!r.ok)
+            return null;
+        return (await r.json()).version ?? null;
+    }
+    catch {
+        return null;
+    }
+    finally {
+        clearTimeout(t);
+    }
+}
+function verLt(a, b) {
+    const pa = a.split(".").map((x) => parseInt(x, 10));
+    const pb = b.split(".").map((x) => parseInt(x, 10));
+    if (pa.some(Number.isNaN) || pb.some(Number.isNaN))
+        return false;
+    for (let i = 0; i < 3; i++) {
+        const d = (pb[i] ?? 0) - (pa[i] ?? 0);
+        if (d !== 0)
+            return d > 0;
+    }
+    return false;
+}
+/** Run `npm i -g @decentnetwork/beagle@latest`. npm is found on PATH, else via
+ *  npm-cli.js next to the running node (covers pm2/cron environments whose
+ *  PATH lacks the nvm shims). */
+async function npmSelfUpdate() {
+    const { spawn } = await import("node:child_process");
+    const args = ["i", "-g", `${BEAGLE_PKG}@latest`];
+    const npmCli = join(dirname(process.execPath), "..", "lib", "node_modules", "npm", "bin", "npm-cli.js");
+    const attempts = [
+        { cmd: "npm", args },
+        ...(existsSync(npmCli) ? [{ cmd: process.execPath, args: [npmCli, ...args] }] : []),
+    ];
+    for (const a of attempts) {
+        const r = await new Promise((resolveRun) => {
+            const ch = spawn(a.cmd, a.args, { shell: process.platform === "win32" });
+            let out = "";
+            const timer = setTimeout(() => ch.kill("SIGKILL"), 5 * 60_000);
+            ch.stdout?.on("data", (c) => (out += c));
+            ch.stderr?.on("data", (c) => (out += c));
+            ch.on("error", (e) => { clearTimeout(timer); resolveRun({ code: null, out, spawnErr: e.message }); });
+            ch.on("close", (code) => { clearTimeout(timer); resolveRun({ code, out }); });
+        });
+        if (r.spawnErr)
+            continue; // npm not found this way — try the next resolver
+        const tail = r.out.slice(-2000);
+        if (r.code === 0)
+            return { ok: true, log: tail };
+        const hint = /EACCES|permission denied/i.test(r.out)
+            ? " — no write access to the global npm dir; run `sudo npm i -g @decentnetwork/beagle@latest` manually"
+            : "";
+        return { ok: false, error: `npm exited ${r.code}${hint}`, log: tail };
+    }
+    return { ok: false, error: "npm not found — update manually: npm i -g @decentnetwork/beagle@latest" };
+}
 /** True only when the request came from the local machine. Used to gate the
  *  "Sign in with Decent" routes so binding the UI to a LAN IP can't expose
  *  identity signing to other hosts. The popup always runs in the local user's
@@ -478,9 +598,9 @@ export function startBeagleServer(opts) {
                 }
             }
             // Punk directory (proxied): a random batch by type, and one punk by id.
-            if (req.method === "GET" && url.startsWith("/api/punk-list")) {
+            if (req.method === "GET" && url === "/api/punk-list") {
                 try {
-                    const q = new URL(url, "http://localhost");
+                    const q = new URL(req.url || "", "http://localhost");
                     const type = (q.searchParams.get("type") || "any").toLowerCase().replace(/[^a-z]/g, "") || "any";
                     const limit = Math.min(60, Math.max(1, Number(q.searchParams.get("limit")) || 24));
                     const list = await punksFetch(`/api/punks/filter/${type}/any?limit=${limit}`);
@@ -1092,11 +1212,103 @@ export function startBeagleServer(opts) {
             // One bootstrap call for the desktop UI: composes the design's DK_*
             // shapes (me / peers / requests / exits) from diag + friends-list +
             // ipam + routes, so the client data layer is a single poll.
+            // ── self-update: check (cached), run (localhost), restart (localhost) ──
+            if (req.method === "GET" && url === "/api/update-check") {
+                const force = new URL(req.url || "", "http://localhost").searchParams.get("force") === "1";
+                if (!force && updateCache && Date.now() - updateCache.at < UPDATE_TTL_MS) {
+                    sendJson(res, 200, updateCache.body);
+                    return;
+                }
+                const [beagleLatest, peerLatest, lanLatest] = await Promise.all([
+                    npmLatest(BEAGLE_PKG),
+                    npmLatest("@decentnetwork/peer"),
+                    npmLatest("@decentnetwork/lan"),
+                ]);
+                const curLan = opts.meExtra?.lanVer ?? "";
+                const row = (pkg, current, latest) => ({
+                    pkg,
+                    current,
+                    latest,
+                    behind: !!(current && latest && verLt(current, latest)),
+                });
+                const body = {
+                    ok: true,
+                    checkedAt: Date.now(),
+                    mode: installMode(),
+                    updates: [
+                        row(BEAGLE_PKG, beagleVersion(), beagleLatest),
+                        // peer ships inside beagle: reinstalling beagle refreshes it too.
+                        row("@decentnetwork/peer", opts.meExtra?.peerVer ?? "", peerLatest),
+                        ...(curLan && curLan !== "(none)" ? [row("@decentnetwork/lan", curLan, lanLatest)] : []),
+                    ],
+                };
+                updateCache = { at: Date.now(), body };
+                sendJson(res, 200, body);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/update-run") {
+                if (!isLocalRequest(req)) {
+                    sendJson(res, 403, { ok: false, error: "update runs only from this machine (localhost)" });
+                    return;
+                }
+                const mode = installMode();
+                if (mode === "dev") {
+                    sendJson(res, 400, { ok: false, error: "running from a source checkout — update with: git pull && npm run build" });
+                    return;
+                }
+                if (mode === "npx") {
+                    // npx with @latest re-resolves on every launch: restarting IS the update.
+                    sendJson(res, 200, { ok: true, npx: true });
+                    return;
+                }
+                const r = await npmSelfUpdate();
+                updateCache = null; // next check reflects the new install
+                sendJson(res, r.ok ? 200 : 502, r);
+                return;
+            }
+            if (req.method === "POST" && url === "/api/update-restart") {
+                if (!isLocalRequest(req)) {
+                    sendJson(res, 403, { ok: false, error: "restart only from this machine (localhost)" });
+                    return;
+                }
+                sendJson(res, 200, { ok: true });
+                // Let the response flush, then exit 0: pm2/launchd/systemd restart the
+                // process; a bare `beagle` in a terminal just exits (the UI says so).
+                setTimeout(() => process.exit(0), 400);
+                return;
+            }
+            // Public profile card for any userid (friend or directory row): what
+            // they published on their beagles.eth record. Read-only, no signing.
+            if (req.method === "GET" && url === "/api/ens-profile") {
+                const q = new URL(req.url || "", "http://localhost").searchParams;
+                let userid = q.get("userid") || "";
+                if (!userid) {
+                    sendJson(res, 400, { ok: false, error: "userid required" });
+                    return;
+                }
+                // A 52-char Carrier ADDRESS also works (group cards only have that):
+                // its first 32 bytes are the pubkey, i.e. the userid.
+                try {
+                    const bytes = peerAddr.base58ToBytes(userid);
+                    if (bytes.length === peerAddr.CARRIER_ADDRESS_SIZE)
+                        userid = peerAddr.bytesToBase58(bytes.slice(0, 32));
+                }
+                catch { /* not base58 — leave as-is */ }
+                let prof = (await ensPublicByUserid(1500)).get(userid) ?? null;
+                if (!prof) {
+                    const rec = await ensFetchJson(`/getAddress/${encodeURIComponent(userid)}`);
+                    if (rec)
+                        prof = ensPubFromEntry(rec.name, rec);
+                }
+                sendJson(res, 200, { ok: true, registered: !!prof, profile: prof });
+                return;
+            }
             if (req.method === "GET" && url === "/api/desktop") {
-                const [diag, pending, flist] = await Promise.all([
+                const [diag, pending, flist, ensPub] = await Promise.all([
                     opts.call({ op: "diag" }),
                     opts.call({ op: "friends-pending" }),
                     opts.call({ op: "friends-list" }),
+                    ensPublicByUserid(),
                 ]);
                 const d = (diag.ok ? diag.data : {}) ?? {};
                 const identity = d.identity ?? {};
@@ -1147,6 +1359,8 @@ export function startBeagleServer(opts) {
                     // null = backend didn't report it (daemon); the UI then hides the
                     // toggle rather than showing a state it cannot know.
                     autoAccept: typeof node.autoAccept === "boolean" ? node.autoAccept : null,
+                    avatarUrl: ensPub.get(identity.userid ?? "")?.avatarUrl ?? null,
+                    punkId: ensPub.get(identity.userid ?? "")?.punkId ?? null,
                 };
                 const fl = (flist.ok ? (flist.data?.friends ?? []) : []);
                 const peers = fl.map((f) => {
@@ -1177,6 +1391,8 @@ export function startBeagleServer(opts) {
                         lastMsg: lm ? (lm.dir === "out" ? "you: " : "") + (lm.text ?? "") : "",
                         lastTime: fmtTime(lm?.ts),
                         wire: "163",
+                        avatarUrl: ensPub.get(uid)?.avatarUrl ?? null,
+                        punkId: ensPub.get(uid)?.punkId ?? null,
                     };
                 });
                 const pend = pending.ok ? (pending.data?.pending ?? []) : [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decentnetwork/beagle",
-  "version": "0.1.23",
+  "version": "0.1.25",
   "description": "Beagle — P2P chat, file transfer and calls for regular users, on the Decent Network. No admin privilege required.",
   "type": "module",
   "main": "./dist/index.js",