From 6a8933d8966f89e0b1cdcd9e5d67ddb0508f84f8 Mon Sep 17 00:00:00 2001
From: you <you@example.com>
Date: Sat, 21 Mar 2026 22:47:01 +0000
Subject: [PATCH] fix: detail pane shows clicked observation data, not parent
 packet

When expanding a grouped packet and clicking a child observation row,
the detail pane now shows that observation's observer, SNR/RSSI, path,
and timestamp instead of the parent packet's data.

Child rows use a new 'select-observation' action that builds a synthetic
packet object by overlaying observation-specific fields onto the parent
packet data (no extra API fetch needed).
---
 public/index.html |  2 +-
 public/packets.js | 13 ++++++++++++-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/public/index.html b/public/index.html
index 9dbc5f71..5bb120e3 100644
--- a/public/index.html
+++ b/public/index.html
@@ -84,7 +84,7 @@
   <script src="hop-resolver.js?v=1774126708"></script>
   <script src="app.js?v=1774126708"></script>
   <script src="home.js?v=1774042199"></script>
-  <script src="packets.js?v=1774132071"></script>
+  <script src="packets.js?v=1774166400"></script>
   <script src="map.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="channels.js?v=1774331200" onerror="console.error('Failed to load:', this.src)"></script>
   <script src="nodes.js?v=1774126708" onerror="console.error('Failed to load:', this.src)"></script>
diff --git a/public/packets.js b/public/packets.js
index 695d516f..89155387 100644
--- a/public/packets.js
+++ b/public/packets.js
@@ -581,6 +581,16 @@
           if (hash) selectPacket(null, hash);
           else selectPacket(Number(value));
         }
+        else if (action === 'select-observation') {
+          const parentHash = row.dataset.parentHash;
+          const group = packets.find(p => p.hash === parentHash);
+          const child = group?._children?.find(c => String(c.id) === String(value));
+          if (child) {
+            const parentData = group._fetchedData;
+            const obsPacket = parentData ? {...parentData.packet, observer_id: child.observer_id, observer_name: child.observer_name, snr: child.snr, rssi: child.rssi, path_json: child.path_json, timestamp: child.timestamp, first_seen: child.timestamp} : child;
+            selectPacket(child.id, parentHash, {packet: obsPacket, breakdown: parentData?.breakdown, observations: parentData?.observations});
+          }
+        }
         else if (action === 'select-hash') pktSelectHash(value);
         else if (action === 'toggle-select') { pktToggleGroup(value); pktSelectHash(value); }
       };
@@ -671,7 +681,7 @@
             let childPath = [];
             try { childPath = JSON.parse(c.path_json || '[]'); } catch {}
             const childPathStr = renderPath(childPath);
-            html += `<tr class="group-child" data-id="${c.id}" data-hash="${c.hash || ''}" data-action="select" data-value="${c.id}" tabindex="0" role="row">
+            html += `<tr class="group-child" data-id="${c.id}" data-hash="${c.hash || ''}" data-action="select-observation" data-value="${c.id}" data-parent-hash="${p.hash}" tabindex="0" role="row">
               <td></td><td class="col-region">${childRegion ? `<span class="badge-region">${childRegion}</span>` : '—'}</td>
               <td class="col-time">${timeAgo(c.timestamp)}</td>
               <td class="mono col-hash">${truncate(c.hash || '', 8)}</td>
@@ -1217,6 +1227,7 @@
       const group = packets.find(p => p.hash === hash);
       if (group && data.observations) {
         group._children = data.observations.map(o => ({...pkt, ...o, _isObservation: true}));
+        group._fetchedData = data;
         // Sort: group by observer, earliest-observer first, then by time within each observer
         const earliest = {};
         for (const c of group._children) {