From 66abba3d08021b1ff538d6266e4b4e590407bde2 Mon Sep 17 00:00:00 2001
From: Christophe Besson <cbesson@gmail.com>
Date: Sun, 20 Sep 2026 01:52:01 +0200
Subject: feat(hub): show the node's public key in Node → Overview
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

It was only the Node ID row's fallback, so it vanished the moment the node
announced itself — and was labelled Node ID when it did show. Own row, copy
button, and the profile's instructions no longer name the node dashboard
removed on 2026-09-01.

`.node-key` wraps: 44 base64 characters with no break opportunity pushed a
412px document to 417px, which unpins every sticky element on the page. The
width probe now measures the Overview table with a real key in it.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 .../src/meshbay_hub/static/node-page.js            | 22 +++++++++++++++++++++-
 1 file changed, 21 insertions(+), 1 deletion(-)

(limited to 'packages/meshbay-hub/src/meshbay_hub/static/node-page.js')

diff --git a/packages/meshbay-hub/src/meshbay_hub/static/node-page.js b/packages/meshbay-hub/src/meshbay_hub/static/node-page.js
index 2edcbab..0b05dad 100644
--- a/packages/meshbay-hub/src/meshbay_hub/static/node-page.js
+++ b/packages/meshbay-hub/src/meshbay_hub/static/node-page.js
@@ -216,6 +216,7 @@ export function NodePage({ groups, token, username }) {
   const [nodeRoster, setNodeRoster] = useState(null);
   const [unlinkBusy, setUnlinkBusy] = useState(false);
   const [tab, setTab] = useState('overview');
+  const [keyCopied, setKeyCopied] = useState(false);
 
   const fetchStatus = useCallback(async () => {
     setStatus('connecting');
@@ -257,6 +258,16 @@ export function NodePage({ groups, token, username }) {
     } catch {}
   }, []);
 
+  const copyNodeKey = useCallback(async () => {
+    const pk = nodeInfo && nodeInfo.pk_node_ed25519;
+    if (!pk) return;
+    try {
+      await navigator.clipboard.writeText(pk);
+      setKeyCopied(true);
+      setTimeout(() => setKeyCopied(false), 2000);
+    } catch { /* clipboard blocked -- the key is on screen to copy by hand */ }
+  }, [nodeInfo]);
+
   const addRoot = useCallback(async (groupId) => {
     const chosen = await platform.rootPicker.choose();
     if (!chosen) return;
@@ -725,7 +736,16 @@ export function NodePage({ groups, token, username }) {
             <tbody>
               <tr><td>${t('node.overview_version')}</td><td>${nodeInfo.version || '—'}</td></tr>
               <tr><td>${t('node.overview_node_id')}</td>
-                  <td><code>${nodeInfo.endpoint_hint || nodeInfo.pk_node_ed25519 || '—'}</code></td></tr>
+                  <td><code>${nodeInfo.endpoint_hint || '—'}</code></td></tr>
+              <tr><td>${t('node.overview_node_key')}</td>
+                  <td>
+                    <code class="node-key">${nodeInfo.pk_node_ed25519 || '—'}</code>
+                    ${nodeInfo.pk_node_ed25519 && html`
+                      <button class="btn btn-small btn-secondary" onClick=${copyNodeKey}>
+                        ${keyCopied ? t('node.overview_node_key_copied')
+                                    : t('node.overview_node_key_copy')}
+                      </button>`}
+                  </td></tr>
               <tr><td>${t('node.overview_quic_port')}</td><td>${nodeInfo.quic_port || '—'}</td></tr>
               <tr><td>${t('node.overview_hub')}</td><td>${nodeInfo.hub_url || '—'}</td></tr>
             </tbody>
-- 
cgit v1.2.3