From 4ccfbf638e2e0d8ecbde6bf403d02f12ec772f42 Mon Sep 17 00:00:00 2001
From: Shivam Sharma <shivxmsharma@gmail.com>
Date: Tue, 17 Mar 2026 23:01:30 +0530
Subject: [PATCH] fix(ui-components): guard ThemeToggle against invalid stored
 theme

---
 packages/ui-components/src/Common/ThemeToggle/index.tsx | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/ui-components/src/Common/ThemeToggle/index.tsx b/packages/ui-components/src/Common/ThemeToggle/index.tsx
index 923aba5f90d16..b76ac9bbb98b5 100644
--- a/packages/ui-components/src/Common/ThemeToggle/index.tsx
+++ b/packages/ui-components/src/Common/ThemeToggle/index.tsx
@@ -33,7 +33,9 @@ const ThemeToggle: FC<ThemeToggleProps> = ({
   ariaLabel,
   themeLabels = { system: 'System', light: 'Light', dark: 'Dark' },
 }) => {
-  const TriggerIcon = themeIcons[currentTheme];
+  const normalizedTheme: Theme =
+    currentTheme in themeIcons ? currentTheme : 'system';
+  const TriggerIcon = themeIcons[normalizedTheme];
 
   return (
     <DropdownMenu.Root>
@@ -60,7 +62,7 @@ const ThemeToggle: FC<ThemeToggleProps> = ({
                 key={theme}
                 onClick={() => onChange(theme)}
                 className={classNames(styles.dropDownItem, {
-                  [styles.activeItem]: theme === currentTheme,
+                  [styles.activeItem]: theme === normalizedTheme,
                 })}
               >
                 <Icon height="16" />