From 8d8e53c903d73021047d59602de142729fa19788 Mon Sep 17 00:00:00 2001
From: Phillip Tarrant <ptarrant@gmail.com>
Date: Thu, 20 Nov 2025 10:07:24 -0600
Subject: [PATCH] Add screenshot viewing button to scan detail page

Display screenshot button in port table when a service has a captured
screenshot. Button opens screenshot in new tab with correct path
including the screenshot directory.
---
 app/web/templates/scan_detail.html | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/app/web/templates/scan_detail.html b/app/web/templates/scan_detail.html
index 926a9ca..041445e 100644
--- a/app/web/templates/scan_detail.html
+++ b/app/web/templates/scan_detail.html
@@ -331,6 +331,7 @@
                                     <th>Product</th>
                                     <th>Version</th>
                                     <th>Status</th>
+                                    <th>Screenshot</th>
                                 </tr>
                             </thead>
                             <tbody id="site-${siteIdx}-ip-${ipIdx}-ports"></tbody>
@@ -344,10 +345,11 @@
                 const ports = ip.ports || [];
 
                 if (ports.length === 0) {
-                    portsContainer.innerHTML = '<tr class="scan-row"><td colspan="7" class="text-center text-muted">No ports found</td></tr>';
+                    portsContainer.innerHTML = '<tr class="scan-row"><td colspan="8" class="text-center text-muted">No ports found</td></tr>';
                 } else {
                     ports.forEach(port => {
                         const service = port.services && port.services.length > 0 ? port.services[0] : null;
+                        const screenshotPath = service && service.screenshot_path ? service.screenshot_path : null;
 
                         const row = document.createElement('tr');
                         row.classList.add('scan-row');  // Fix white row bug
@@ -359,6 +361,7 @@
                             <td>${service ? service.product || '-' : '-'}</td>
                             <td class="mono">${service ? service.version || '-' : '-'}</td>
                             <td>${port.expected ? '<span class="badge badge-good">Expected</span>' : '<span class="badge badge-warning">Unexpected</span>'}</td>
+                            <td>${screenshotPath ? `<a href="/output/${screenshotPath.replace(/^\/?(?:app\/)?output\/?/, '')}" target="_blank" class="btn btn-sm btn-outline-primary" title="View Screenshot"><i class="bi bi-image"></i></a>` : '-'}</td>
                         `;
                         portsContainer.appendChild(row);
                     });