Sync upstream Gemini-CLI v0.8.2 (#838)

packages/cli/src/ui/components/EditorSettingsDialog.tsx

@@ -7,7 +7,7 @@
 import type React from 'react';
 import { useState } from 'react';
 import { Box, Text } from 'ink';
-import { Colors } from '../colors.js';
+import { theme } from '../semantic-colors.js';
 import {
   EDITOR_DISPLAY_NAMES,
   editorSettingsManager,
@@ -65,8 +65,16 @@ export function EditorSettingsDialog({
   }
 
   const scopeItems = [
-    { label: 'User Settings', value: SettingScope.User },
-    { label: 'Workspace Settings', value: SettingScope.Workspace },
+    {
+      label: 'User Settings',
+      value: SettingScope.User,
+      key: SettingScope.User,
+    },
+    {
+      label: 'Workspace Settings',
+      value: SettingScope.Workspace,
+      key: SettingScope.Workspace,
+    },
   ];
 
   const handleEditorSelect = (editorType: EditorType | 'not_set') => {
@@ -112,7 +120,7 @@ export function EditorSettingsDialog({
   return (
     <Box
       borderStyle="round"
-      borderColor={Colors.Gray}
+      borderColor={theme.border.default}
       flexDirection="row"
       padding={1}
       width="100%"
@@ -120,13 +128,14 @@ export function EditorSettingsDialog({
       <Box flexDirection="column" width="45%" paddingRight={2}>
         <Text bold={focusedSection === 'editor'}>
           {focusedSection === 'editor' ? '> ' : '  '}Select Editor{' '}
-          <Text color={Colors.Gray}>{otherScopeModifiedMessage}</Text>
+          <Text color={theme.text.secondary}>{otherScopeModifiedMessage}</Text>
         </Text>
         <RadioButtonSelect
           items={editorItems.map((item) => ({
             label: item.name,
             value: item.type,
             disabled: item.disabled,
+            key: item.type,
           }))}
           initialIndex={editorIndex}
           onSelect={handleEditorSelect}
@@ -147,26 +156,28 @@ export function EditorSettingsDialog({
         </Box>
 
         <Box marginTop={1}>
-          <Text color={Colors.Gray}>
+          <Text color={theme.text.secondary}>
             (Use Enter to select, Tab to change focus)
           </Text>
         </Box>
       </Box>
 
       <Box flexDirection="column" width="55%" paddingLeft={2}>
-        <Text bold>Editor Preference</Text>
+        <Text bold color={theme.text.primary}>
+          Editor Preference
+        </Text>
         <Box flexDirection="column" gap={1} marginTop={1}>
-          <Text color={Colors.Gray}>
+          <Text color={theme.text.secondary}>
             These editors are currently supported. Please note that some editors
             cannot be used in sandbox mode.
           </Text>
-          <Text color={Colors.Gray}>
+          <Text color={theme.text.secondary}>
             Your preferred editor is:{' '}
             <Text
               color={
                 mergedEditorName === 'None'
-                  ? Colors.AccentRed
-                  : Colors.AccentCyan
+                  ? theme.status.error
+                  : theme.text.link
               }
               bold
             >