2045: Moves setColorMode to lib

Ruben van Leeuwen · Ruben van Leeuwen · commit 4857c5931d4a · 2026-01-07T16:00:50.000+01:00
diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -9,9 +9,8 @@ import { useRouter } from 'next/router';
 import { QueryParamProvider } from 'use-query-params';
 
 import type { EuiSideNavItemType } from '@elastic/eui';
-import { EuiProvider, EuiThemeColorMode } from '@elastic/eui';
+import { EuiProvider } from '@elastic/eui';
 import {
-    ColorModes,
     ConfirmationDialogContextWrapper,
     OrchestratorConfig,
     OrchestratorConfigProvider,
@@ -25,7 +24,6 @@ import {
     WfoPageTemplate,
     WfoToastsList,
     emptyOrchestratorConfig,
-    wfoThemeModifications,
 } from '@orchestrator-ui/orchestrator-ui-components';
 
 import { getAppLogo } from '@/components/AppLogo/AppLogo';
@@ -42,27 +40,6 @@ function CustomApp({ Component, pageProps }: AppProps & AppOwnProps) {
     const [orchestratorLoadedConfig, setOrchestratorLoadedConfig] =
         useState<OrchestratorConfig | null>(null);
 
-    const [themeMode, setThemeMode] = useState<EuiThemeColorMode>(
-        ColorModes.LIGHT,
-    );
-
-    const handleThemeSwitch = (newThemeMode: EuiThemeColorMode) => {
-        setThemeMode(newThemeMode);
-        localStorage.setItem('themeMode', newThemeMode);
-    };
-
-    useEffect(() => {
-        // Initialize theme mode from localStorage or set it to 'light' if not present
-        const storedTheme = localStorage.getItem('themeMode');
-        if (
-            !storedTheme ||
-            (storedTheme !== ColorModes.LIGHT &&
-                storedTheme !== ColorModes.DARK)
-        ) {
-            handleThemeSwitch(ColorModes.LIGHT);
-        }
-    }, []);
-
     useEffect(() => {
         if (
             orchestratorConfig &&
@@ -137,10 +114,7 @@ function CustomApp({ Component, pageProps }: AppProps & AppOwnProps) {
                             errorMonitoringHandler={errorMonitoringHandler}
                         >
                             <WfoAuth>
-                                <EuiProvider
-                                    colorMode={themeMode}
-                                    modify={wfoThemeModifications}
-                                >
+                                <EuiProvider>
                                     <TranslationsProvider>
                                         <Head>
                                             <link
@@ -156,9 +130,6 @@ function CustomApp({ Component, pageProps }: AppProps & AppOwnProps) {
                                             <ConfirmationDialogContextWrapper>
                                                 <WfoPageTemplate
                                                     getAppLogo={getAppLogo}
-                                                    onThemeSwitch={
-                                                        handleThemeSwitch
-                                                    }
                                                     overrideMenuItems={
                                                         addMenuItems
                                                     }
