Reorder "Code Completions" section in settings and update README to reflect the new order, also fix alternating row background in configurations list

Author: robertpiosik

README.md

@@ -80,12 +80,12 @@ Like all of CWC, the extension is [open-source](https://github.com/robertpiosik/
 **🛠️ Edit Context** \
 Pair-programming using natural language instructions.
 
-**🛠️ Code Completions** \
-Get accurate code at cursor from state-of-the-art models.
-
 **🛠️ Intelligent Update** \
 Integrate changes from malformed markdown code blocks.
 
+**🛠️ Code Completions** \
+Get accurate code at cursor from state-of-the-art models.
+
 **🛠️ Prune Context** \
 Remove irrelevant files from the current context selection.
 

apps/editor/src/views/settings/frontend/Home/Home.tsx

@@ -43,11 +43,6 @@ const NAV_ITEMS_CONFIG: NavConfigItem[] = [
   },
   { type: 'divider', text: 'settings.sidebar.api-tools' },
   { type: 'item', id: 'edit-context', label: 'settings.sidebar.edit-context' },
-  {
-    type: 'item',
-    id: 'code-completions',
-    label: 'settings.sidebar.code-completions'
-  },
   {
     type: 'item',
     id: 'intelligent-update',
@@ -58,6 +53,11 @@ const NAV_ITEMS_CONFIG: NavConfigItem[] = [
     id: 'prune-context',
     label: 'settings.sidebar.prune-context'
   },
+  {
+    type: 'item',
+    id: 'code-completions',
+    label: 'settings.sidebar.code-completions'
+  },
   {
     type: 'item',
     id: 'commit-messages',
@@ -139,9 +139,9 @@ export const Home: React.FC<Props> = (props) => {
     general: null,
     'model-providers': null,
     'edit-context': null,
-    'code-completions': null,
     'intelligent-update': null,
     'prune-context': null,
+    'code-completions': null,
     'commit-messages': null
   })
   const [commit_instructions, set_commit_instructions] = useState('')
@@ -391,34 +391,6 @@ export const Home: React.FC<Props> = (props) => {
             />
           </Group>
         </Section>
-        <Section
-          ref={(el) => (section_refs.current['code-completions'] = el)}
-          group="API Tool"
-          title="Code Completions"
-          subtitle="Get accurate code at cursor from state-of-the-art models."
-          on_stuck_change={code_completions_on_stuck_change}
-        >
-          <Group>
-            <ApiToolConfigurationSection
-              configurations={props.code_completions_configs}
-              set_configurations={props.set_code_completions_configs}
-              tool_name="CODE_COMPLETIONS"
-              can_have_default={true}
-              on_add={() => props.on_add_config('CODE_COMPLETIONS')}
-              on_reorder={(reordered) =>
-                props.on_reorder_configs('CODE_COMPLETIONS', reordered)
-              }
-              on_edit={(id) => props.on_edit_config('CODE_COMPLETIONS', id)}
-              on_delete={(id) => props.on_delete_config('CODE_COMPLETIONS', id)}
-              on_set_default={(id) =>
-                props.on_set_default_config('CODE_COMPLETIONS', id)
-              }
-              on_unset_default={() =>
-                props.on_unset_default_config('CODE_COMPLETIONS')
-              }
-            />
-          </Group>
-        </Section>
         <Section
           ref={(el) => (section_refs.current['intelligent-update'] = el)}
           group="API Tool"
@@ -471,6 +443,34 @@ export const Home: React.FC<Props> = (props) => {
             />
           </Group>
         </Section>
+        <Section
+          ref={(el) => (section_refs.current['code-completions'] = el)}
+          group="API Tool"
+          title="Code Completions"
+          subtitle="Get accurate code at cursor from state-of-the-art models."
+          on_stuck_change={code_completions_on_stuck_change}
+        >
+          <Group>
+            <ApiToolConfigurationSection
+              configurations={props.code_completions_configs}
+              set_configurations={props.set_code_completions_configs}
+              tool_name="CODE_COMPLETIONS"
+              can_have_default={true}
+              on_add={() => props.on_add_config('CODE_COMPLETIONS')}
+              on_reorder={(reordered) =>
+                props.on_reorder_configs('CODE_COMPLETIONS', reordered)
+              }
+              on_edit={(id) => props.on_edit_config('CODE_COMPLETIONS', id)}
+              on_delete={(id) => props.on_delete_config('CODE_COMPLETIONS', id)}
+              on_set_default={(id) =>
+                props.on_set_default_config('CODE_COMPLETIONS', id)
+              }
+              on_unset_default={() =>
+                props.on_unset_default_config('CODE_COMPLETIONS')
+              }
+            />
+          </Group>
+        </Section>
         <Section
           ref={(el) => (section_refs.current['commit-messages'] = el)}
           group="API Tool"

packages/ui/src/components/editor/settings/ConfigurationsList/ConfigurationsList.module.scss

@@ -33,7 +33,7 @@
   gap: 12px;
   padding: 0 12px;
 
-  &:nth-child(even) {
+  &:nth-child(odd) {
     background-color: var(--cwc-bg-tertiary);
   }