@decentnetwork/lan 0.1.100 → 0.1.102

package/dist/ui/desktop/app.js

@@ -942,11 +942,20 @@ function PeerRow({ peer, T, active, onClick }) {
 function PeerSidebar({ T, peers, requests, activeId, onSelect, onAct, onAdd }) {
   const [q, setQ] = React.useState("");
   const [addr, setAddr] = React.useState("");
+  const [addState, setAddState] = React.useState(null);
   const submitAddr = () => {
-    if (addr.trim()) {
-      onAdd(addr);
-      setAddr("");
-    }
+    const v = addr.trim();
+    if (!v || addState && addState.kind === "sending") return;
+    setAddState({ kind: "sending", msg: T.addSending });
+    Promise.resolve(onAdd(v)).then((r) => {
+      if (r && r.ok) {
+        setAddr("");
+        setAddState({ kind: "ok", msg: T.addSent });
+      } else {
+        setAddState({ kind: "err", msg: r && r.error ? `${T.addFailed}: ${r.error}` : T.addFailed });
+      }
+      setTimeout(() => setAddState((s) => s && s.kind !== "sending" ? null : s), 6e3);
+    });
   };
   const filtered = peers.filter((p) => {
     if (!q) return true;
@@ -956,7 +965,12 @@ function PeerSidebar({ T, peers, requests, activeId, onSelect, onAct, onAdd }) {
   const online = peers.filter((p) => p.online).length;
   return /* @__PURE__ */ React.createElement("div", { style: { width: 320, flexShrink: 0, borderRight: "1px solid var(--line)", display: "flex", flexDirection: "column", background: "var(--panel)" } }, /* @__PURE__ */ React.createElement("div", { style: { padding: "12px 12px 10px", borderBottom: "1px solid var(--line)", display: "flex", flexDirection: "column", gap: 8 } }, /* @__PURE__ */ React.createElement("div", { style: { display: "flex", gap: 7 } }, /* @__PURE__ */ React.createElement("input", { value: addr, onChange: (e) => setAddr(e.target.value), onKeyDown: (e) => {
     if (e.key === "Enter") submitAddr();
-  }, placeholder: T.addPlaceholder, style: inputStyle }), /* @__PURE__ */ React.createElement(Btn, { tone: "solid", icon: "userPlus", onClick: submitAddr }, T.add)), /* @__PURE__ */ React.createElement("div", { style: { position: "relative", display: "flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement(Icon, { name: "search", size: 15, color: "var(--faint)", stroke: 2, style: { position: "absolute", left: 9 } }), /* @__PURE__ */ React.createElement("input", { value: q, onChange: (e) => setQ(e.target.value), placeholder: T.search, style: { ...inputStyle, paddingLeft: 30 } }))), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, overflow: "auto", padding: "10px 8px 16px" } }, /* @__PURE__ */ React.createElement(RequestsBlock, { T, requests, onAct }), /* @__PURE__ */ React.createElement(Section, { label: T.peers, count: `${online}/${peers.length}`, style: { margin: "6px 4px 8px" } }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 2 } }, filtered.map((p) => /* @__PURE__ */ React.createElement(PeerRow, { key: p.id, peer: p, T, active: p.id === activeId, onClick: () => onSelect(p.id) })), !filtered.length && /* @__PURE__ */ React.createElement("div", { style: { padding: 16, textAlign: "center", fontFamily: "var(--mono)", fontSize: 12, color: "var(--faint)" } }, "no matches"))));
+  }, placeholder: T.addPlaceholder, style: inputStyle }), /* @__PURE__ */ React.createElement(Btn, { tone: "solid", icon: "userPlus", onClick: submitAddr }, T.add)), addState && /* @__PURE__ */ React.createElement("div", { style: {
+    fontFamily: "var(--mono)",
+    fontSize: 11.5,
+    lineHeight: 1.35,
+    color: addState.kind === "err" ? "var(--bad, #e5484d)" : addState.kind === "ok" ? "var(--good, #46a758)" : "var(--faint)"
+  } }, addState.msg), /* @__PURE__ */ React.createElement("div", { style: { position: "relative", display: "flex", alignItems: "center" } }, /* @__PURE__ */ React.createElement(Icon, { name: "search", size: 15, color: "var(--faint)", stroke: 2, style: { position: "absolute", left: 9 } }), /* @__PURE__ */ React.createElement("input", { value: q, onChange: (e) => setQ(e.target.value), placeholder: T.search, style: { ...inputStyle, paddingLeft: 30 } }))), /* @__PURE__ */ React.createElement("div", { style: { flex: 1, overflow: "auto", padding: "10px 8px 16px" } }, /* @__PURE__ */ React.createElement(RequestsBlock, { T, requests, onAct }), /* @__PURE__ */ React.createElement(Section, { label: T.peers, count: `${online}/${peers.length}`, style: { margin: "6px 4px 8px" } }), /* @__PURE__ */ React.createElement("div", { style: { display: "flex", flexDirection: "column", gap: 2 } }, filtered.map((p) => /* @__PURE__ */ React.createElement(PeerRow, { key: p.id, peer: p, T, active: p.id === activeId, onClick: () => onSelect(p.id) })), !filtered.length && /* @__PURE__ */ React.createElement("div", { style: { padding: 16, textAlign: "center", fontFamily: "var(--mono)", fontSize: 12, color: "var(--faint)" } }, "no matches"))));
 }
 const inputStyle = {
   flex: 1,
@@ -1205,6 +1219,9 @@ const STR = {
     addPlaceholder: "paste a friend's carrier address\u2026",
     add: "Add",
     search: "search peers / ip\u2026",
+    addSending: "sending friend-request\u2026",
+    addSent: "friend-request sent \u2014 they appear once they accept",
+    addFailed: "could not send",
     requests: "Friend requests",
     accept: "accept",
     reject: "reject",
@@ -1277,6 +1294,9 @@ const STR = {
     addPlaceholder: "\u7C98\u8D34\u597D\u53CB\u7684 carrier \u5730\u5740\u2026",
     add: "\u6DFB\u52A0",
     search: "\u641C\u7D22\u597D\u53CB / IP\u2026",
+    addSending: "\u6B63\u5728\u53D1\u9001\u597D\u53CB\u8BF7\u6C42\u2026",
+    addSent: "\u597D\u53CB\u8BF7\u6C42\u5DF2\u53D1\u9001 \u2014 \u5BF9\u65B9\u63A5\u53D7\u540E\u4F1A\u51FA\u73B0\u5728\u5217\u8868",
+    addFailed: "\u53D1\u9001\u5931\u8D25",
     requests: "\u597D\u53CB\u8BF7\u6C42",
     accept: "\u63A5\u53D7",
     reject: "\u62D2\u7EDD",
@@ -1397,7 +1417,11 @@ function DkApp() {
     if (peer.id === activeId) setActiveId(null);
   };
   const onAdd = (address) => {
-    if (address && address.trim()) dkApi.add(address.trim()).then(data.refresh);
+    if (!address || !address.trim()) return Promise.resolve({ ok: false, error: "empty address" });
+    return dkApi.add(address.trim()).then((r) => {
+      data.refresh();
+      return r;
+    });
   };
   const onSend = (text) => {
     if (!activeId || !text || !text.trim()) return;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@decentnetwork/lan",
-  "version": "0.1.100",
+  "version": "0.1.102",
   "description": "Private virtual LAN for self-hosted services and AI agents, built on Elastos Carrier. NAT-traversal, name service, ACL, all over a peer-to-peer mesh — no public IP required.",
   "type": "module",
   "main": "./dist/index.js",
@@ -79,7 +79,7 @@
   },
   "dependencies": {
     "@decentnetwork/dora": "^0.1.6",
-    "@decentnetwork/peer": "^0.1.43",
+    "@decentnetwork/peer": "^0.1.45",
     "ink": "^5.2.1",
     "js-yaml": "^4.1.0",
     "react": "^18.3.1",