From a0ccc3d00a2ac4e9d90d9bf06f9eea0ee0c239a2 Mon Sep 17 00:00:00 2001
From: priestlypython <andre@optinampout.com>
Date: Wed, 14 Jan 2026 12:42:46 -0800
Subject: [PATCH] fix: Add cache-busting to detail modal API calls

Fixes issue where modal shows same data for all captures.

Changes:
- Add timestamp-based cache buster to API requests
- Add cache-control headers (no-cache, no-store, must-revalidate)
- Clear modal content when closing to prevent stale data
- Ensures each capture loads fresh, unique data

This resolves the issue where clicking 'View Data' on different
markers showed the same cached data instead of unique per-capture data.
---
 static/js/detail-modal.js | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/static/js/detail-modal.js b/static/js/detail-modal.js
index d529836..8cebb1d 100644
--- a/static/js/detail-modal.js
+++ b/static/js/detail-modal.js
@@ -16,8 +16,16 @@ async function viewCaptureDetails(captureId) {
     console.log('Loading state set, about to fetch from:', `/api/v1/captures/${captureId}`);
 
     try {
-        // Fetch capture details
-        const response = await fetch(`/api/v1/captures/${captureId}`);
+        // Fetch capture details with cache-busting
+        const cacheBuster = Date.now();
+        const response = await fetch(`/api/v1/captures/${captureId}?_=${cacheBuster}`, {
+            method: 'GET',
+            headers: {
+                'Cache-Control': 'no-cache, no-store, must-revalidate',
+                'Pragma': 'no-cache',
+                'Expires': '0'
+            }
+        });
 
         console.log('Response status:', response.status);
         console.log('Response ok:', response.ok);
@@ -222,6 +230,13 @@ function renderMatchedDevices(matches) {
 
 function closeDetailModal() {
     const modal = document.getElementById('detail-modal');
+    const modalBody = document.getElementById('modal-body-content');
+
+    // Clear modal content to prevent stale data
+    if (modalBody) {
+        modalBody.innerHTML = '';
+    }
+
     modal.classList.remove('active');
 }