From 3992d6f34479fb4c1d6b3b284120559eb5278a5c Mon Sep 17 00:00:00 2001
From: Sarah Gillespie <73313222+gillespi314@users.noreply.github.com>
Date: Wed, 12 Jun 2024 13:49:58 -0500
Subject: [PATCH] Fix UI bug in OS settings modal on "My device" page (#19502)

---
 changes/19103-my-device-os-settings                           | 2 ++
 .../OSSettingsErrorCell/OSSettingsErrorCell.tsx               | 4 +++-
 2 files changed, 5 insertions(+), 1 deletion(-)
 create mode 100644 changes/19103-my-device-os-settings

diff --git a/changes/19103-my-device-os-settings b/changes/19103-my-device-os-settings
new file mode 100644
index 0000000000..123426477f
--- /dev/null
+++ b/changes/19103-my-device-os-settings
@@ -0,0 +1,2 @@
+- Fixed UI bug where error detail was overflowing the table in "OS settings" modal in "My device"
+  page UI.
diff --git a/frontend/pages/hosts/details/OSSettingsModal/OSSettingsTable/OSSettingsErrorCell/OSSettingsErrorCell.tsx b/frontend/pages/hosts/details/OSSettingsModal/OSSettingsTable/OSSettingsErrorCell/OSSettingsErrorCell.tsx
index 640da82716..3e8abd790c 100644
--- a/frontend/pages/hosts/details/OSSettingsModal/OSSettingsTable/OSSettingsErrorCell/OSSettingsErrorCell.tsx
+++ b/frontend/pages/hosts/details/OSSettingsModal/OSSettingsTable/OSSettingsErrorCell/OSSettingsErrorCell.tsx
@@ -138,7 +138,9 @@ const OSSettingsErrorCell = ({
         // we dont want the default "w250" class so we pass in empty string
         classes={""}
         className={
-          showRefetchButton ? `${baseClass}__failed-message` : undefined
+          isFailed || showRefetchButton
+            ? `${baseClass}__failed-message`
+            : undefined
         }
       />
       {showRefetchButton && (