From 335af2874a7fec4bfaa9157bd2a02f0539e43249 Mon Sep 17 00:00:00 2001
From: you <you@example.com>
Date: Thu, 19 Mar 2026 06:22:42 +0000
Subject: [PATCH] Fix node claiming: grid not updating after first claim

myNodesGrid element was only rendered when hasNodes was true on
initial page load. Claiming first node called loadMyNodes() but
the grid container didn't exist. Now always render the grid div.
Also dynamically update hero text and hide onboarding prompt.
---
 public/home.js | 14 +++++++++++++-
 1 file changed, 13 insertions(+), 1 deletion(-)

diff --git a/public/home.js b/public/home.js
index 1429f63..8add353 100644
--- a/public/home.js
+++ b/public/home.js
@@ -72,7 +72,7 @@
         </div>
       </section>
 
-      ${hasNodes ? '<div class="my-nodes-grid" id="myNodesGrid"><div class="my-nodes-loading">Loading your nodes…</div></div>' : ''}
+      ${hasNodes ? '<div class="my-nodes-grid" id="myNodesGrid"><div class="my-nodes-loading">Loading your nodes…</div></div>' : '<div class="my-nodes-grid" id="myNodesGrid"></div>'}
 
       ${!hasNodes ? `
         <div class="onboarding-prompt">
@@ -209,6 +209,18 @@
     const grid = document.getElementById('myNodesGrid');
     if (!grid) return;
     const myNodes = getMyNodes();
+
+    // Update hero text dynamically
+    const h1 = document.querySelector('.home-hero h1');
+    const heroP = document.querySelector('.home-hero p');
+    if (myNodes.length) {
+      if (h1) h1.textContent = 'My Mesh';
+      if (heroP) heroP.textContent = 'Your nodes at a glance. Add more by searching below.';
+      // Hide onboarding prompt
+      const onboard = document.querySelector('.onboarding-prompt');
+      if (onboard) onboard.style.display = 'none';
+    }
+
     if (!myNodes.length) {
       grid.innerHTML = '';
       return;