improve: remove redundant Load Details button and auto-load accordion data

- Remove Load Details button from workload table
- Replace with simple 'Click to expand' text
- Auto-load data when accordion is expanded
- Simplify user experience by removing redundant action
- Data loads automatically on accordion toggle
This commit is contained in:
2025-10-03 09:00:01 -03:00
parent ff932a56f0
commit 7744ea9889

View File

@@ -2519,10 +2519,9 @@
<td>${workload.memory_usage || 'N/A'}</td> <td>${workload.memory_usage || 'N/A'}</td>
<td>${workload.last_updated ? new Date(workload.last_updated).toLocaleString() : 'N/A'}</td> <td>${workload.last_updated ? new Date(workload.last_updated).toLocaleString() : 'N/A'}</td>
<td> <td>
<button class="openshift-button" onclick="loadWorkloadDetails('${workload.name}', '${workload.namespace}', ${index})"> <span style="color: var(--pf-global--Color--300); font-size: 12px;">
<i class="fas fa-chart-line"></i> Click to expand
Load Details </span>
</button>
</td> </td>
</tr> </tr>
<tr class="workload-details-row" id="details-${index}" style="display: none;"> <tr class="workload-details-row" id="details-${index}" style="display: none;">
@@ -2561,10 +2560,21 @@
const icon = expandBtn.querySelector('i'); const icon = expandBtn.querySelector('i');
if (detailsRow.style.display === 'none') { if (detailsRow.style.display === 'none') {
// Expand the accordion
detailsRow.style.display = 'table-row'; detailsRow.style.display = 'table-row';
icon.classList.remove('fa-chevron-right'); icon.classList.remove('fa-chevron-right');
icon.classList.add('fa-chevron-down'); icon.classList.add('fa-chevron-down');
// Load data automatically when expanding
const workloadRow = expandBtn.closest('.workload-row');
const workloadName = workloadRow.dataset.workload;
const namespace = workloadRow.dataset.namespace;
if (workloadName && namespace) {
loadWorkloadDetails(workloadName, namespace, index);
}
} else { } else {
// Collapse the accordion
detailsRow.style.display = 'none'; detailsRow.style.display = 'none';
icon.classList.remove('fa-chevron-down'); icon.classList.remove('fa-chevron-down');
icon.classList.add('fa-chevron-right'); icon.classList.add('fa-chevron-right');
@@ -2599,9 +2609,6 @@
updateWorkloadDetailsAccordion(data, index); updateWorkloadDetailsAccordion(data, index);
// Expand the accordion after loading
toggleWorkloadDetails(index);
} catch (error) { } catch (error) {
console.error('Error loading workload details:', error); console.error('Error loading workload details:', error);
container.innerHTML = ` container.innerHTML = `