From 9737735caeb80c7feed0e9ae4bcd07615edb478f Mon Sep 17 00:00:00 2001
From: rcourtman <courtmanr@gmail.com>
Date: Wed, 1 Oct 2025 06:53:15 +0000
Subject: [PATCH] fix: stable node group sorting in dashboard for duplicate
 hostnames

addresses #479

when displaying grouped guests in the dashboard, node groups with the same
hostname were being sorted inconsistently, causing the groups to swap
positions on each data refresh.

fixed by adding instance ID as a secondary sort key when node names are
equal. this ensures stable, consistent ordering even when multiple nodes
share the same hostname.
---
 frontend-modern/src/components/Dashboard/Dashboard.tsx | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/frontend-modern/src/components/Dashboard/Dashboard.tsx b/frontend-modern/src/components/Dashboard/Dashboard.tsx
index 83639aa27..7f3117604 100644
--- a/frontend-modern/src/components/Dashboard/Dashboard.tsx
+++ b/frontend-modern/src/components/Dashboard/Dashboard.tsx
@@ -917,10 +917,13 @@ export function Dashboard(props: DashboardProps) {
                 <tbody class="divide-y divide-gray-200 dark:divide-gray-700">
                   <For
                     each={Object.entries(groupedGuests()).sort(([instanceIdA], [instanceIdB]) => {
-                      // Sort by node name for display, not instance ID
+                      // Sort by node name for display, with instance ID as tiebreaker for duplicate hostnames
                       const nodeA = nodeByInstance()[instanceIdA];
                       const nodeB = nodeByInstance()[instanceIdB];
-                      return (nodeA?.name || '').localeCompare(nodeB?.name || '');
+                      const nameCompare = (nodeA?.name || '').localeCompare(nodeB?.name || '');
+                      if (nameCompare !== 0) return nameCompare;
+                      // If names are equal (duplicate hostnames), sort by instance ID for stability
+                      return instanceIdA.localeCompare(instanceIdB);
                     })}
                     fallback={<></>}
                   >