fix: use app theme for code editor

src/components/code-editor/constants/settings.ts

@@ -1,5 +1,4 @@
 export const CODE_EDITOR_STORAGE_KEYS = {
-  theme: 'codeEditorTheme',
   wordWrap: 'codeEditorWordWrap',
   showMinimap: 'codeEditorShowMinimap',
   lineNumbers: 'codeEditorLineNumbers',
@@ -7,7 +6,6 @@ export const CODE_EDITOR_STORAGE_KEYS = {
 } as const;
 
 export const CODE_EDITOR_DEFAULTS = {
-  isDarkMode: true,
   wordWrap: false,
   minimapEnabled: true,
   showLineNumbers: true,

src/components/code-editor/hooks/useCodeEditorSettings.ts

@@ -5,15 +5,6 @@ import {
   CODE_EDITOR_STORAGE_KEYS,
 } from '../constants/settings';
 
-const readTheme = () => {
-  const savedTheme = localStorage.getItem(CODE_EDITOR_STORAGE_KEYS.theme);
-  if (!savedTheme) {
-    return CODE_EDITOR_DEFAULTS.isDarkMode;
-  }
-
-  return savedTheme === 'dark';
-};
-
 const readBoolean = (storageKey: string, defaultValue: boolean, falseValue = 'false') => {
   const value = localStorage.getItem(storageKey);
   if (value === null) {
@@ -33,7 +24,6 @@ const readFontSize = () => {
 };
 
 export const useCodeEditorSettings = () => {
-  const [isDarkMode, setIsDarkMode] = useState(readTheme);
   const [wordWrap, setWordWrap] = useState(readWordWrap);
   const [minimapEnabled, setMinimapEnabled] = useState(() => (
     readBoolean(CODE_EDITOR_STORAGE_KEYS.showMinimap, CODE_EDITOR_DEFAULTS.minimapEnabled)
@@ -43,18 +33,13 @@ export const useCodeEditorSettings = () => {
   ));
   const [fontSize, setFontSize] = useState(readFontSize);
 
-  // Keep legacy behavior where the editor writes theme and wrap settings directly.
+  // Keep legacy behavior where the editor writes wrap settings directly.
-  useEffect(() => {
-    localStorage.setItem(CODE_EDITOR_STORAGE_KEYS.theme, isDarkMode ? 'dark' : 'light');
-  }, [isDarkMode]);
-
   useEffect(() => {
     localStorage.setItem(CODE_EDITOR_STORAGE_KEYS.wordWrap, String(wordWrap));
   }, [wordWrap]);
 
   useEffect(() => {
     const refreshFromStorage = () => {
-      setIsDarkMode(readTheme());
       setWordWrap(readWordWrap());
       setMinimapEnabled(readBoolean(CODE_EDITOR_STORAGE_KEYS.showMinimap, CODE_EDITOR_DEFAULTS.minimapEnabled));
       setShowLineNumbers(readBoolean(CODE_EDITOR_STORAGE_KEYS.lineNumbers, CODE_EDITOR_DEFAULTS.showLineNumbers));
@@ -71,8 +56,6 @@ export const useCodeEditorSettings = () => {
   }, []);
 
   return {
-    isDarkMode,
-    setIsDarkMode,
     wordWrap,
     setWordWrap,
     minimapEnabled,

src/components/code-editor/view/CodeEditor.tsx

@@ -4,6 +4,7 @@ import type { Extension } from '@codemirror/state';
 import { useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { usePaletteOps } from '../../../contexts/PaletteOpsContext';
+import { useTheme } from '../../../contexts/ThemeContext';
 import { useCodeEditorDocument } from '../hooks/useCodeEditorDocument';
 import { useCodeEditorSettings } from '../hooks/useCodeEditorSettings';
 import { useEditorKeyboardShortcuts } from '../hooks/useEditorKeyboardShortcuts';
@@ -42,8 +43,10 @@ export default function CodeEditor({
   const [showDiff, setShowDiff] = useState(Boolean(file.diffInfo));
   const [markdownPreview, setMarkdownPreview] = useState(false);
 
+  // The code editor follows the app-wide theme; it has no theme of its own.
+  const { isDarkMode } = useTheme();
+
   const {
-    isDarkMode,
     wordWrap,
     minimapEnabled,
     showLineNumbers,

src/components/settings/constants/constants.ts

@@ -45,7 +45,6 @@ export const AGENT_CATEGORIES: AgentCategory[] = ['account', 'permissions', 'mcp
 export const DEFAULT_PROJECT_SORT_ORDER: ProjectSortOrder = 'name';
 export const DEFAULT_SAVE_STATUS = null;
 export const DEFAULT_CODE_EDITOR_SETTINGS: CodeEditorSettingsState = {
-  theme: 'dark',
   wordWrap: false,
   showMinimap: true,
   lineNumbers: true,

src/components/settings/hooks/useSettingsController.ts

@@ -86,7 +86,6 @@ const toCodexPermissionMode = (value: unknown): CodexPermissionMode => {
 };
 
 const readCodeEditorSettings = (): CodeEditorSettingsState => ({
-  theme: localStorage.getItem('codeEditorTheme') === 'light' ? 'light' : 'dark',
   wordWrap: localStorage.getItem('codeEditorWordWrap') === 'true',
   showMinimap: localStorage.getItem('codeEditorShowMinimap') !== 'false',
   lineNumbers: localStorage.getItem('codeEditorLineNumbers') !== 'false',
@@ -330,7 +329,6 @@ export function useSettingsController({ isOpen, initialTab }: UseSettingsControl
   }, [notificationPreferences.channels.sound]);
 
   useEffect(() => {
-    localStorage.setItem('codeEditorTheme', codeEditorSettings.theme);
     localStorage.setItem('codeEditorWordWrap', String(codeEditorSettings.wordWrap));
     localStorage.setItem('codeEditorShowMinimap', String(codeEditorSettings.showMinimap));
     localStorage.setItem('codeEditorLineNumbers', String(codeEditorSettings.lineNumbers));

src/components/settings/types/types.ts

@@ -47,7 +47,6 @@ export type CursorPermissionsState = {
 };
 
 export type CodeEditorSettingsState = {
-  theme: 'dark' | 'light';
   wordWrap: boolean;
   showMinimap: boolean;
   lineNumbers: boolean;

src/components/settings/view/Settings.tsx

@@ -168,7 +168,6 @@ function Settings({ isOpen, onClose, projects = [], initialTab = 'agents' }: Set
                   projectSortOrder={projectSortOrder}
                   onProjectSortOrderChange={setProjectSortOrder}
                   codeEditorSettings={codeEditorSettings}
-                  onCodeEditorThemeChange={(value) => updateCodeEditorSetting('theme', value)}
                   onCodeEditorWordWrapChange={(value) => updateCodeEditorSetting('wordWrap', value)}
                   onCodeEditorShowMinimapChange={(value) => updateCodeEditorSetting('showMinimap', value)}
                   onCodeEditorLineNumbersChange={(value) => updateCodeEditorSetting('lineNumbers', value)}

src/components/settings/view/tabs/AppearanceSettingsTab.tsx

@@ -11,7 +11,6 @@ type AppearanceSettingsTabProps = {
   projectSortOrder: ProjectSortOrder;
   onProjectSortOrderChange: (value: ProjectSortOrder) => void;
   codeEditorSettings: CodeEditorSettingsState;
-  onCodeEditorThemeChange: (value: 'dark' | 'light') => void;
   onCodeEditorWordWrapChange: (value: boolean) => void;
   onCodeEditorShowMinimapChange: (value: boolean) => void;
   onCodeEditorLineNumbersChange: (value: boolean) => void;
@@ -22,7 +21,6 @@ export default function AppearanceSettingsTab({
   projectSortOrder,
   onProjectSortOrderChange,
   codeEditorSettings,
-  onCodeEditorThemeChange,
   onCodeEditorWordWrapChange,
   onCodeEditorShowMinimapChange,
   onCodeEditorLineNumbersChange,
@@ -69,17 +67,6 @@ export default function AppearanceSettingsTab({
 
       <SettingsSection title={t('appearanceSettings.codeEditor.title')}>
         <SettingsCard divided>
-          <SettingsRow
-            label={t('appearanceSettings.codeEditor.theme.label')}
-            description={t('appearanceSettings.codeEditor.theme.description')}
-          >
-            <DarkModeToggle
-              checked={codeEditorSettings.theme === 'dark'}
-              onToggle={(enabled) => onCodeEditorThemeChange(enabled ? 'dark' : 'light')}
-              ariaLabel={t('appearanceSettings.codeEditor.theme.label')}
-            />
-          </SettingsRow>
-
           <SettingsRow
             label={t('appearanceSettings.codeEditor.wordWrap.label')}
             description={t('appearanceSettings.codeEditor.wordWrap.description')}