Add support for pinning API tool configurations in settings and the UI

Author: robertpiosik

packages/vscode/package.json

@@ -1497,6 +1497,10 @@
               "isDefault": {
                 "type": "boolean",
                 "description": "Whether this is the default configuration for this tool."
+              },
+              "isPinned": {
+                "type": "boolean",
+                "description": "Whether this configuration is shown above the list."
               }
             },
             "required": [
@@ -1542,6 +1546,10 @@
                   "below-only"
                 ],
                 "description": "Placement of instructions relative to the code context."
+              },
+              "isPinned": {
+                "type": "boolean",
+                "description": "Whether this configuration is shown above the list."
               }
             },
             "required": [
@@ -1587,6 +1595,10 @@
               "maxConcurrency": {
                 "type": "number",
                 "description": "Maximum number of concurrent requests."
+              },
+              "isPinned": {
+                "type": "boolean",
+                "description": "Whether this configuration is shown above the list."
               }
             },
             "required": [
@@ -1628,6 +1640,10 @@
               "isDefault": {
                 "type": "boolean",
                 "description": "Whether this is the default configuration for this tool."
+              },
+              "isPinned": {
+                "type": "boolean",
+                "description": "Whether this configuration is shown above the list."
               }
             },
             "required": [

packages/vscode/src/services/model-providers-manager.ts

@@ -29,6 +29,7 @@ export type ToolConfig = {
   reasoning_effort?: ReasoningEffort
   max_concurrency?: number
   instructions_placement?: InstructionsPlacement
+  is_pinned?: boolean
 }
 
 export const get_tool_config_id = (config: ToolConfig): string => {
@@ -167,6 +168,7 @@ export class ModelProvidersManager {
         reasoningEffort?: ReasoningEffort
         maxConcurrency?: number
         instructionsPlacement?: InstructionsPlacement
+        isPinned?: boolean
       }[]
     >(settings_key, [])
 
@@ -180,7 +182,8 @@ export class ModelProvidersManager {
           temperature: sc.temperature ?? 1.0,
           reasoning_effort: sc.reasoningEffort,
           max_concurrency: sc.maxConcurrency,
-          instructions_placement: sc.instructionsPlacement
+          instructions_placement: sc.instructionsPlacement,
+          is_pinned: sc.isPinned
         }
       })
       .filter((tc) => tc.provider_type)
@@ -213,6 +216,7 @@ export class ModelProvidersManager {
         new_config.maxConcurrency = c.max_concurrency
       if (c.instructions_placement !== undefined)
         new_config.instructionsPlacement = c.instructions_placement
+      if (c.is_pinned) new_config.isPinned = c.is_pinned
       return new_config
     })
 
@@ -253,6 +257,7 @@ export class ModelProvidersManager {
         isDefault?: boolean
         maxConcurrency?: number
         instructionsPlacement?: InstructionsPlacement
+        isPinned?: boolean
       }[]
     >(settings_key, [])
     const default_config_from_settings = settings_configs.find(
@@ -271,7 +276,8 @@ export class ModelProvidersManager {
         reasoning_effort: default_config_from_settings.reasoningEffort,
         max_concurrency: default_config_from_settings.maxConcurrency,
         instructions_placement:
-          default_config_from_settings.instructionsPlacement
+          default_config_from_settings.instructionsPlacement,
+        is_pinned: default_config_from_settings.isPinned
       }
       const validated_config = this._validate_tool_config(tool_config)
       if (validated_config) return validated_config

packages/vscode/src/views/panel/backend/panel-provider.ts

@@ -3,6 +3,10 @@ import * as path from 'path'
 import { WebSocketManager } from '@/services/websocket-manager'
 import { FrontendMessage, BackendMessage } from '../types/messages'
 import { WebsitesProvider } from '@/context/providers/websites-provider'
+import {
+  ModelProvidersManager,
+  get_tool_config_id
+} from '@/services/model-providers-manager'
 import { OpenEditorsProvider } from '@/context/providers/open-editors-provider'
 import { WorkspaceProvider } from '@/context/providers/workspace-provider'
 import { token_count_emitter } from '@/context/context-initialization'
@@ -479,6 +483,35 @@ export class PanelProvider implements vscode.WebviewViewProvider {
             await handle_get_api_tool_configurations(this)
           } else if (message.command == 'REORDER_API_TOOL_CONFIGURATIONS') {
             await handle_reorder_api_tool_configurations(this, message)
+          } else if (
+            message.command == 'TOGGLE_PINNED_API_TOOL_CONFIGURATION'
+          ) {
+            const { mode, configuration_id } = message
+            const providers_manager = new ModelProvidersManager(this.context)
+            let configs
+            if (mode === 'edit-context') {
+              configs = await providers_manager.get_edit_context_tool_configs()
+            } else if (mode === 'code-completions') {
+              configs =
+                await providers_manager.get_code_completions_tool_configs()
+            } else {
+              return
+            }
+
+            const config = configs.find(
+              (c) => get_tool_config_id(c) === configuration_id
+            )
+            if (!config) return
+
+            config.is_pinned = !config.is_pinned
+
+            if (mode === 'edit-context') {
+              await providers_manager.save_edit_context_tool_configs(configs)
+            } else if (mode === 'code-completions') {
+              await providers_manager.save_code_completions_tool_configs(
+                configs
+              )
+            }
           } else if (message.command == 'SAVE_WEB_MODE') {
             await handle_save_mode_web(this, message.mode)
           } else if (message.command == 'GET_API_MODE') {

packages/vscode/src/views/panel/frontend/Main/Main.tsx

@@ -418,6 +418,16 @@ export const Main: React.FC<Props> = (props) => {
     }
   }
 
+  const handle_toggle_pinned_configuration = (id: string) => {
+    if (props.api_mode) {
+      post_message(props.vscode, {
+        command: 'TOGGLE_PINNED_API_TOOL_CONFIGURATION',
+        mode: props.api_mode,
+        configuration_id: id
+      })
+    }
+  }
+
   const handle_create_preset = () => {
     post_message(props.vscode, {
       command: 'CREATE_PRESET'
@@ -677,6 +687,7 @@ export const Main: React.FC<Props> = (props) => {
       configurations={configurations_for_current_mode || []}
       on_configuration_click={handle_configuration_click}
       on_configurations_reorder={handle_configurations_reorder}
+      on_toggle_pinned_configuration={handle_toggle_pinned_configuration}
       on_manage_configurations={handle_manage_configurations}
       on_search_click={handle_search_click}
       on_at_sign_click={handle_at_sign_click}

packages/vscode/src/views/panel/frontend/Main/MainView/MainView.tsx

@@ -49,6 +49,7 @@ type Props = {
   on_configurations_reorder: (
     reordered_configurations: UiConfigurations.Configuration[]
   ) => void
+  on_toggle_pinned_configuration: (id: string) => void
   on_manage_configurations: () => void
   has_active_editor: boolean
   has_active_selection: boolean
@@ -290,6 +291,7 @@ export const MainView: React.FC<Props> = (props) => {
               }))}
               on_configuration_click={props.on_configuration_click}
               on_reorder={props.on_configurations_reorder}
+              on_toggle_pinned={props.on_toggle_pinned_configuration}
               selected_configuration_id={props.selected_configuration_id}
               on_manage_configurations={props.on_manage_configurations}
               is_collapsed={props.configurations_collapsed}

packages/vscode/src/views/panel/types/messages.ts

@@ -18,6 +18,7 @@ export type ApiToolConfiguration = {
   reasoning_effort?: string
   instructions_placement?: InstructionsPlacement
   is_default?: boolean
+  is_pinned?: boolean
 }
 
 export type FileProgressStatus =
@@ -237,6 +238,12 @@ export interface ReorderApiToolConfigurationsMessage extends BaseMessage {
   configurations: ApiToolConfiguration[]
 }
 
+export interface TogglePinnedApiToolConfigurationMessage extends BaseMessage {
+  command: 'TOGGLE_PINNED_API_TOOL_CONFIGURATION'
+  mode: ApiMode
+  configuration_id: string
+}
+
 export interface GetVersionMessage extends BaseMessage {
   command: 'GET_VERSION'
 }
@@ -385,6 +392,7 @@ export type FrontendMessage =
   | SaveApiModeMessage
   | GetApiToolConfigurationsMessage
   | ReorderApiToolConfigurationsMessage
+  | TogglePinnedApiToolConfigurationMessage
   | SaveDonationsVisibilityMessage
   | GetVersionMessage
   | EditsReviewMessage