feat: remove sidebar toggle button and ensure data loading

- Remove hamburger menu button from header
- Remove sidebar toggle JavaScript functionality
- Keep data loading functionality intact
- Maintain OpenShift Console visual identity
This commit is contained in:
2025-10-02 11:46:10 -03:00
parent b2b47c4f1c
commit 53ea070957

View File

@@ -522,9 +522,6 @@
<!-- OpenShift-like Header -->
<header class="openshift-header">
<div class="openshift-header-left">
<button class="hamburger-menu" id="sidebar-toggle">
<i class="fas fa-bars"></i>
</button>
<a href="#" class="openshift-logo">UWRU Scanner</a>
</div>
<div class="openshift-header-right">
@@ -605,7 +602,7 @@
</a>
</li>
</ul>
</div>
</div>
<div class="sidebar-section">
<h3 class="sidebar-section-title">Observe</h3>
@@ -635,39 +632,39 @@
<div class="page-header">
<h1 class="page-title">UWRU Scanner</h1>
<p class="page-description">User Workloads and Resource Usage Scanner - Identify and analyze workloads with resource configuration issues</p>
</div>
</div>
<!-- Metrics Cards -->
<div class="metrics-grid" id="metrics-grid">
<div class="metric-card">
<div class="metric-card">
<div class="metric-icon success">
<i class="fas fa-cube"></i>
</div>
<div class="metric-value" id="total-workloads">-</div>
<div class="metric-label">Total Workloads</div>
</div>
<div class="metric-card">
</div>
<div class="metric-card">
<div class="metric-icon info">
<i class="fas fa-layer-group"></i>
</div>
<div class="metric-value" id="total-namespaces">-</div>
<div class="metric-label">Namespaces</div>
</div>
<div class="metric-card">
<div class="metric-label">Namespaces</div>
</div>
<div class="metric-card">
<div class="metric-icon danger">
<i class="fas fa-exclamation-triangle"></i>
</div>
</div>
<div class="metric-value" id="critical-issues">-</div>
<div class="metric-label">Critical Issues</div>
</div>
<div class="metric-card">
<div class="metric-label">Critical Issues</div>
</div>
<div class="metric-card">
<div class="metric-icon warning">
<i class="fas fa-exclamation-circle"></i>
</div>
</div>
<div class="metric-value" id="total-warnings">-</div>
<div class="metric-label">Warnings</div>
</div>
</div>
</div>
<!-- Workloads Table Card -->
<div class="openshift-card">
@@ -677,14 +674,14 @@
<i class="fas fa-sync-alt"></i>
Refresh
</button>
</div>
</div>
<div class="table-content" id="workloads-table-container">
<div class="loading-spinner">
<div class="spinner"></div>
Loading workloads...
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Historical Analysis Section -->
@@ -692,7 +689,7 @@
<div class="page-header">
<h1 class="page-title">Historical Analysis</h1>
<p class="page-description">Resource consumption analysis and historical data</p>
</div>
</div>
<!-- Workloads List Card -->
<div class="openshift-card">
@@ -701,8 +698,8 @@
<button class="openshift-button" id="refresh-historical">
<i class="fas fa-sync-alt"></i>
Refresh
</button>
</div>
</button>
</div>
<div class="table-content" id="historical-workloads-container">
<div class="loading-spinner">
<div class="spinner"></div>
@@ -719,7 +716,7 @@
<i class="fas fa-times"></i>
Close
</button>
</div>
</div>
<div class="table-content" id="workload-details-content">
<!-- Workload details will be populated here -->
</div>
@@ -757,11 +754,6 @@
});
});
// Sidebar toggle
document.getElementById('sidebar-toggle').addEventListener('click', function() {
const sidebar = document.getElementById('sidebar');
sidebar.classList.toggle('open');
});
// Close workload details
document.getElementById('close-workload-details').addEventListener('click', function() {
@@ -794,7 +786,7 @@
if (section === 'workload-scanner') {
loadWorkloadScanner();
} else if (section === 'historical-analysis') {
loadHistoricalAnalysis();
loadHistoricalAnalysis();
}
}
@@ -878,8 +870,8 @@
<td>
<strong style="color: var(--pf-global--Color--100);">${namespace.namespace}</strong>
</td>
<td>${Object.keys(namespace.pods || {}).length}</td>
<td>${namespace.total_validations || 0}</td>
<td>${Object.keys(namespace.pods || {}).length}</td>
<td>${namespace.total_validations || 0}</td>
<td>
<span class="status-indicator ${getSeverityClass(namespace)}">
${getSeverityText(namespace)}
@@ -890,8 +882,8 @@
<i class="fas fa-search"></i>
Analyze
</button>
</td>
</tr>
</td>
</tr>
`).join('')}
</tbody>
</table>
@@ -990,19 +982,19 @@
<div style="padding: 20px; text-align: center; color: var(--pf-global--Color--300);">
<i class="fas fa-microchip" style="font-size: 48px; margin-bottom: 16px; color: var(--pf-global--info-color--100);"></i>
<p>CPU usage data will be displayed here</p>
</div>
</div>
</div>
</div>
<div class="openshift-card">
<div class="card-header">
<h3 class="card-title">Memory Usage</h3>
</div>
</div>
<div style="padding: 20px; text-align: center; color: var(--pf-global--Color--300);">
<i class="fas fa-memory" style="font-size: 48px; margin-bottom: 16px; color: var(--pf-global--warning-color--100);"></i>
<p>Memory usage data will be displayed here</p>
</div>
</div>
</div>
</div>
`;
`;
}
function analyzeWorkload(namespace) {
@@ -1043,8 +1035,8 @@
<i class="fas fa-exclamation-triangle" style="font-size: 48px; margin-bottom: 16px;"></i>
<h3 style="margin: 0 0 8px 0; color: var(--pf-global--Color--100);">Error</h3>
<p style="margin: 0;">${message}</p>
</div>
`;
</div>
`;
}
</script>
</body>