diff --git a/src/context/theme/ThemeController.tsx b/src/context/theme/ThemeController.tsx
index f1b4f17c5..e1ec05ed3 100644
--- a/src/context/theme/ThemeController.tsx
+++ b/src/context/theme/ThemeController.tsx
@@ -16,15 +16,15 @@ export const GlobalThemeController = ({children}: CommonThemeControllerProps) =>
     const theme = useTheme();
     const [prevTheme, setPrevTheme] = React.useState(theme);
 
-    const updateBodyClassName = (theme: Theme) => {
+    const updateBodyClassName = (newTheme: Theme) => {
         const bodyEl = document.body;
 
         if (!bodyEl.classList.contains('yc-root')) {
             bodyEl.classList.add('yc-root');
         }
 
-        bodyEl.classList.toggle('yc-root_theme_light', theme === Theme.Light);
-        bodyEl.classList.toggle('yc-root_theme_dark', theme === Theme.Dark);
+        bodyEl.classList.toggle('yc-root_theme_light', newTheme === Theme.Light);
+        bodyEl.classList.toggle('yc-root_theme_dark', newTheme === Theme.Dark);
     };
 
     React.useEffect(() => {
@@ -40,7 +40,9 @@ export const GlobalThemeController = ({children}: CommonThemeControllerProps) =>
     }, [theme, prevTheme]);
 
     React.useEffect(() => {
-        updateBodyClassName(prevTheme);
+        updateBodyClassName(theme);
+        // need to render only once
+        // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
 
     return <>{children}</>;
diff --git a/src/editor/components/ControlPanel/ControlPanel.tsx b/src/editor/components/ControlPanel/ControlPanel.tsx
index 82c91fcbf..b88265637 100644
--- a/src/editor/components/ControlPanel/ControlPanel.tsx
+++ b/src/editor/components/ControlPanel/ControlPanel.tsx
@@ -62,9 +62,9 @@ const ControlPanel = ({
             </div>
             <div className={b('theme-switch')}>
                 <Select value={[theme]} onUpdate={(value) => onThemeSwitch(value[0] as Theme)}>
-                    {Object.values(Theme).map((theme) => (
-                        <Select.Option key={theme} value={theme}>
-                            {themeNames[theme]}
+                    {Object.values(Theme).map((item) => (
+                        <Select.Option key={item} value={item}>
+                            {themeNames[item]}
                         </Select.Option>
                     ))}
                 </Select>
diff --git a/src/editor/store/index.ts b/src/editor/store/index.ts
index c5b4b17c4..0831e0173 100644
--- a/src/editor/store/index.ts
+++ b/src/editor/store/index.ts
@@ -60,7 +60,8 @@ export function useEditorState({content: intialContent, custom}: Omit<EditorProp
             dispatch({type: UPDATE_CONTENT, payload: newContent});
         const onViewModeUpdate = (newViewMode: ViewModeItem) =>
             dispatch({type: UPDATE_VIEW_MODE, payload: newViewMode});
-        const onThemeUpdate = (theme: Theme) => dispatch({type: UPDATE_THEME, payload: theme});
+        const onThemeUpdate = (newTheme: Theme) =>
+            dispatch({type: UPDATE_THEME, payload: newTheme});
 
         const injectEditBlockProps = ({
             type,