From c8bc1f750037aa2ce9698ed29eaaf3db20c19664 Mon Sep 17 00:00:00 2001
From: fuomag9 <1580624+fuomag9@users.noreply.github.com>
Date: Fri, 27 Feb 2026 13:32:59 +0100
Subject: [PATCH] fix: fixed-width host picker to prevent layout shift on long
 names

Replace minWidth/maxWidth with a fixed width:260 + flexShrink:0 so the
Autocomplete never resizes the header row. Chip labels also truncate
with ellipsis instead of wrapping.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 app/(dashboard)/analytics/AnalyticsClient.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/(dashboard)/analytics/AnalyticsClient.tsx b/app/(dashboard)/analytics/AnalyticsClient.tsx
index 64709d1f..eb6a9a0f 100644
--- a/app/(dashboard)/analytics/AnalyticsClient.tsx
+++ b/app/(dashboard)/analytics/AnalyticsClient.tsx
@@ -335,7 +335,7 @@ export default function AnalyticsClient() {
               onChange={(_e, v) => setSelectedHosts(v)}
               disableCloseOnSelect
               limitTags={2}
-              sx={{ minWidth: 220, maxWidth: 380 }}
+              sx={{ width: 260, flexShrink: 0 }}
               ListboxProps={{
                 // Prevent scroll from the dropdown list leaking to the page
                 style: { overscrollBehavior: 'contain' },
@@ -383,7 +383,7 @@ export default function AnalyticsClient() {
                       key={option}
                       label={option}
                       size="small"
-                      sx={{ maxWidth: 140 }}
+                      sx={{ maxWidth: 100, '& .MuiChip-label': { overflow: 'hidden', textOverflow: 'ellipsis' } }}
                     />
                   ));
                 }