From 98e95ebd9b0e9d45db2ce636fbfc14dae4917dd1 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;