feat: remove redundant upload results

public/script.js

@@ -1116,63 +1116,49 @@ function updateMultiNodeProgress(successfulUploads, totalNodes) {
 
 // Display firmware upload results
 function displayFirmwareUploadResults(results) {
-    const container = document.getElementById('firmware-nodes-list');
+    // No need to display separate results widget - the progress area already shows all the information
+    // Just update the progress area to show final status
+    const progressHeader = document.querySelector('.progress-header h3');
+    const progressSummary = document.getElementById('progress-summary');
     
-    const successCount = results.filter(r => r.success).length;
+    if (progressHeader && progressSummary) {
-    const failureCount = results.filter(r => !r.success).length;
+        const successCount = results.filter(r => r.success).length;
+        const totalCount = results.length;
+        const successRate = Math.round((successCount / totalCount) * 100);
         
-    const resultsHTML = `
+        if (successCount === totalCount) {
-        <div class="firmware-upload-results" id="firmware-upload-results">
+            progressHeader.textContent = `📤 Firmware Upload Complete (${successCount}/${totalCount} Successful)`;
-            <div class="results-header">
+            progressSummary.innerHTML = `<span>✅ All uploads completed successfully at ${new Date().toLocaleTimeString()}</span>`;
-                <h3>📊 Upload Results</h3>
+        } else {
-                <div class="results-summary">
+            progressHeader.textContent = `📤 Firmware Upload Results (${successCount}/${totalCount} Successful)`;
-                    <span class="success-count">✅ ${successCount} Successful</span>
+            progressSummary.innerHTML = `<span>⚠️ Upload completed with ${totalCount - successCount} failure(s) at ${new Date().toLocaleTimeString()}</span>`;
-                    <span class="failure-count">❌ ${failureCount} Failed</span>
+        }
-                    <span class="total-count">📊 ${results.length} Total</span>
-                </div>
-            </div>
-            <div class="results-list">
-                ${results.map(result => `
-                    <div class="result-item ${result.success ? 'success' : 'error'}">
-                        <div class="result-node-info">
-                            <span class="node-name">${result.hostname || result.nodeIp}</span>
-                            <span class="node-ip">${result.nodeIp}</span>
-                        </div>
-                        <div class="result-status">
-                            ${result.success ? '✅ Success' : '❌ Failed'}
-                        </div>
-                        <div class="result-details">
-                            ${result.success ? 
-                                `Uploaded successfully at ${new Date(result.timestamp).toLocaleTimeString()}` :
-                                `Error: ${result.error}`
-                            }
-                        </div>
-                    </div>
-                `).join('')}
-            </div>
-            <div class="results-actions">
-                <button onclick="clearFirmwareResults()" class="clear-btn">Clear Results</button>
-                <button onclick="refreshFirmwareView()" class="refresh-btn">Refresh View</button>
-            </div>
-        </div>
-    `;
-    
-    // Append results below the progress area instead of replacing everything
-    // First, check if there's already a results section and remove it
-    const existingResults = container.querySelector('#firmware-upload-results');
-    if (existingResults) {
-        existingResults.remove();
     }
-    
-    // Append the new results below the progress area
-    container.insertAdjacentHTML('beforeend', resultsHTML);
 }
 
 // Clear firmware upload results
 function clearFirmwareResults() {
-    const resultsSection = document.getElementById('firmware-upload-results');
+    const container = document.getElementById('firmware-nodes-list');
-    if (resultsSection) {
+    container.innerHTML = '';
-        resultsSection.remove();
+}
+
+// Add refresh button to progress area
+function addRefreshButtonToProgress() {
+    const progressHeader = document.querySelector('.progress-header');
+    if (progressHeader && !progressHeader.querySelector('.progress-refresh-btn')) {
+        const refreshBtn = document.createElement('button');
+        refreshBtn.className = 'progress-refresh-btn';
+        refreshBtn.innerHTML = `
+            <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="14" height="14">
+                <path d="M1 4v6h6M23 20v-6h-6"/>
+                <path d="M20.49 9A9 9 0 0 0 5.64 5.64L1 10m22 4l-4.64 4.36A9 9 0 0 1 3.51 15"/>
+            </svg>
+        `;
+        refreshBtn.title = 'Refresh firmware view';
+        refreshBtn.onclick = refreshFirmwareView;
+        
+        // Add the refresh button to the header
+        progressHeader.appendChild(refreshBtn);
     }
 }
 
@@ -1203,6 +1189,7 @@ function populateNodeSelect() {
 function refreshFirmwareView() {
     updateFirmwareStats();
     populateNodeSelect();
+    addRefreshButtonToProgress(); // Add refresh button after populating nodes
 }
 
 // Update firmware statistics

public/styles.css

@@ -1132,6 +1132,37 @@ p {
     font-weight: 600;
 }
 
+.progress-header {
+    position: relative;
+}
+
+.progress-refresh-btn {
+    position: absolute;
+    top: 0;
+    right: 0;
+    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.05) 100%);
+    border: 1px solid rgba(255, 255, 255, 0.15);
+    color: rgba(255, 255, 255, 0.9);
+    padding: 0.5rem;
+    border-radius: 8px;
+    cursor: pointer;
+    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.progress-refresh-btn:hover {
+    background: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.08) 100%);
+    border-color: rgba(255, 255, 255, 0.25);
+    transform: translateY(-1px);
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+}
+
+.progress-refresh-btn:active {
+    transform: translateY(0);
+}
+
 .progress-info,
 .results-summary {
     display: flex;