danvics/Pulse
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(ui): stabilize type badge order in unified agents table

Browse source 
Fixes #773

The type badge order was flapping between 'Host Docker' and 'Docker Host'
because Array.from(new Set([...])) doesn't preserve insertion order reliably.

Added a sortTypes helper that ensures types are always displayed in a
consistent order: 'host' before 'docker'. This prevents visual flapping
even when the underlying data sources update at slightly different times.
This commit is contained in:
rcourtman 2025-12-14 21:51:06 +00:00
parent 00bbe59fcc
commit b004f6d017
1 changed files with 13 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
frontend-modern/src/components/Settings/UnifiedAgents.tsx
View file

@ -317,6 +317,15 @@ export const UnifiedAgents: Component = () => {
// If we previously saw both 'host' and 'docker' for a hostname, keep both // If we previously saw both 'host' and 'docker' for a hostname, keep both
// unless BOTH sources are now empty (indicating intentional removal) // unless BOTH sources are now empty (indicating intentional removal)
const newHostTypes = new Map<string, Set<'host' | 'docker'>>(); const newHostTypes = new Map<string, Set<'host' | 'docker'>>();
// Helper to ensure consistent type order: 'host' always before 'docker'
const sortTypes = (types: ('host' | 'docker')[]): ('host' | 'docker')[] => {
const result: ('host' | 'docker')[] = [];
if (types.includes('host')) result.push('host');
if (types.includes('docker')) result.push('docker');
return result;
};
unified.forEach((entry, key) => { unified.forEach((entry, key) => {
const currentTypes = new Set(entry.types); const currentTypes = new Set(entry.types);
const prevTypes = previousHostTypes.get(key); const prevTypes = previousHostTypes.get(key);
@ -328,14 +337,16 @@ export const UnifiedAgents: Component = () => {
if (prevTypes.has('host') && !currentTypes.has('host') && hosts.length > 0) { if (prevTypes.has('host') && !currentTypes.has('host') && hosts.length > 0) {
// Host type disappeared but we still have host data overall // Host type disappeared but we still have host data overall
// This is likely a transient state - preserve the host type // This is likely a transient state - preserve the host type
entry.types = Array.from(new Set([...entry.types, 'host'])); currentTypes.add('host');
} }
if (prevTypes.has('docker') && !currentTypes.has('docker') && dockerHosts.length > 0) { if (prevTypes.has('docker') && !currentTypes.has('docker') && dockerHosts.length > 0) {
// Docker type disappeared but we still have docker data overall // Docker type disappeared but we still have docker data overall
entry.types = Array.from(new Set([...entry.types, 'docker'])); currentTypes.add('docker');
} }
} }
// Always ensure consistent order: 'host' before 'docker'
entry.types = sortTypes(Array.from(currentTypes));
newHostTypes.set(key, new Set(entry.types)); newHostTypes.set(key, new Set(entry.types));
}); });
previousHostTypes = newHostTypes; previousHostTypes = newHostTypes;