Use SecretStorage

README.md

@@ -132,11 +132,11 @@ If you have any feedback or suggestions for improvement, please open an issue. T
 
 1. Install the extension.
 2. Create an OpenAI account and get an API key (if you're using ChatGPT for generation).
-3. Add your OpenAI API key to your settings under `wingman.openai.apiKey`: open Settings, search for "wingman", and paste your API key into the input field labeled "Api key".
-4. Open VScode's bottom panel by pressing <kbd>CTRL + J</kbd> or <kbd>CMD + J</kbd> and select the `Wingman` tab (pictured above).
-5. Highlight a block of code and click "Refactor" in the Wingman tab to refactor the selected code. The generated code will automatically replace the selected text.
-6. Explore all of the other commands.
-7. Write your other commands in your settings under `wingman.userCommands`. See the [Command](#command) section for more details.
+3. Open the command palette (<kbd>CTRL + SHIFT + P</kbd> or <kbd>CMD + SHIFT + P</kbd>) and run `Wingman: Set API key`. Select `openai` as the provider and paste in your API key.
+4. Open the bottom panel (<kbd>CTRL + J</kbd> or <kbd>CMD + J</kbd>) and select the `Wingman` tab (pictured above).
+5. In the Wingman panel, expand "Analysis", highlight a block of code and click "Analyze for bugs".
+6. Explore all of the other builtin commands.
+7. Create your own commands that compliment your workflow in settings under `wingman.userCommands`. See the [Command](#command) section for more details.
 
 ## Features
 
@@ -355,3 +355,8 @@ If you wanted to ask your project a question only about the CSS styling of your
 | `wingman.context.include.permittedFileExtensions` | `[ "js", "ts", "jsx", "tsx", "cpp", "py", "go", "java", "html", "css", "php", "rb", "cs", "swift", "kt", "scala", "h", "m", "mm", "c", "cc", "cxx", "hxx", "hpp", "hh", "s", "asm", "pl", "pm", "t", "r", "sh" ]`    | Only files with these extensions are included in context.                              |
 
 If a `.wmignore` file is discovered, it's treated the same as a `.gitignore` file.
+
+## FAQ
+
+Q: How do I remove or change my API key?
+A: Run the `Wingman: Set API key` command again, select the relevant provider. Paste in your new key, or leave it blank to remove it. Press enter.

package.json

@@ -74,25 +74,20 @@
         }
       ]
     },
+    "commands": [
+      {
+        "command": "wingman.setApiKey",
+        "title": "Wingman: Set API key"
+      }
+    ],
     "configuration": {
       "title": "Wingman",
       "properties": {
-        "wingman.anthropic.apiKey": {
-          "type": "string",
-          "default": "",
-          "description": "Anthropic API Key"
-        },
         "wingman.anthropic.model": {
           "type": "string",
           "default": "claude-instant-v1",
           "description": "Model (a fallback if the command does not specify, e.g. 'claude-instant-v1', 'claude-v1-100k')"
         },
-        "wingman.openai.apiKey": {
-          "order": 2,
-          "type": "string",
-          "default": "",
-          "description": "ChatGPT API Key"
-        },
         "wingman.openai.model": {
           "order": 4,
           "type": "string",

src/extension.ts

@@ -1,9 +1,9 @@
 import * as vscode from "vscode";
 
-import { type Provider } from "./providers";
+import { providers, type Provider } from "./providers";
 import { defaultCommands, buildCommandTemplate, type Command } from "./templates/render";
 import { commandHandler } from "./templates/runner";
-import { display, displayWarning, getConfig } from "./utils";
+import { display, getConfig } from "./utils";
 import { MainViewProvider, SecondaryViewProvider } from "./views";
 
 let providerInstance: Provider | undefined;
@@ -30,11 +30,18 @@ export class ExtensionState {
   public static set(key: string, value: any) {
     ExtensionState.context.globalState.update(key, value);
   }
+
+  public static async getSecret<T>(key: string): Promise<T> {
+    return ExtensionState.context.secrets.get(key) as Promise<T>;
+  }
+
+  public static createSecret(key: string, value: string) {
+    ExtensionState.context.secrets.store(key, value);
+  }
 }
 
 export function activate(context: vscode.ExtensionContext) {
   ExtensionState.create(context);
-  warnDeprecations();
 
   try {
     const mainViewProvider = new MainViewProvider(context.extensionPath, context.extensionUri);
@@ -53,6 +60,25 @@ export function activate(context: vscode.ExtensionContext) {
       }),
     );
 
+    const setApiKeyCommand = vscode.commands.registerCommand("wingman.setApiKey", async () => {
+      const selectedProvider = await vscode.window.showQuickPick(
+        Object.keys(providers).map((key) => ({ label: key })),
+        { placeHolder: "Select the provider you want to set the API key for" },
+      );
+
+      if (!selectedProvider) return;
+
+      const apiKey = await vscode.window.showInputBox({
+        placeHolder: `Enter your ${selectedProvider.label} API key`,
+      });
+
+      if (!apiKey) return;
+
+      ExtensionState.createSecret(`${selectedProvider.label}.apiKey`, apiKey);
+    });
+
+    context.subscriptions.push(setApiKeyCommand);
+
     const registerCommand = (template: Command & { command: string }) => {
       if (!template.command) return;
 
@@ -82,21 +108,3 @@ export function activate(context: vscode.ExtensionContext) {
 }
 
 export function deactivate() {}
-
-// Introduced in 1.0.21. Should be removed after a short while.
-function warnDeprecations() {
-  const deprecatedConfigSettings = ["apiKey", "apiBaseUrl", "model", "temperature"];
-
-  const warnings = deprecatedConfigSettings
-    .map((setting) => ({ key: `wingman.${setting}`, value: getConfig(setting) }))
-    .filter(({ value }) => value !== undefined)
-    .map(({ key }) => `${key} (now wingman.openai.${key})`);
-
-  if (warnings.length > 0) {
-    displayWarning(`
-      The following deprecated config settings were found in your settings.json: ${warnings.join(", ")}.
-      The values for these keys will still be used, but in the future they will be completely deprecated.
-      Please remove these old settings to avoid this warning on startup.
-    `);
-  }
-}

src/providers/anthropic.ts

@@ -5,7 +5,7 @@ import { type PostableViewProvider, type ProviderResponse, type Provider } from
 import { Client, type CompletionResponse, type SamplingParameters, AI_PROMPT, HUMAN_PROMPT } from "./sdks/anthropic";
 import { type Command } from "../templates/render";
 import { handleResponseCallbackType } from "../templates/runner";
-import { displayWarning, getConfig, getSelectionInfo } from "../utils";
+import { displayWarning, getConfig, getSecret, getSelectionInfo } from "../utils";
 
 let lastMessage: string | undefined;
 let lastTemplate: Command | undefined;
@@ -17,9 +17,10 @@ export class AnthropicProvider implements Provider {
   conversationTextHistory: string | undefined;
   _abort: AbortController = new AbortController();
 
-  create(provider: PostableViewProvider, template?: Command) {
-    const { apiKey = "", apiBaseUrl } = {
-      apiKey: getConfig("anthropic.apiKey") as string,
+  async create(provider: PostableViewProvider, template?: Command) {
+    const apiKey = await getSecret<string>("openai.apiKey", "");
+
+    const { apiBaseUrl } = {
       apiBaseUrl: getConfig("anthropic.apiBaseUrl") as string | undefined,
     };
 

src/providers/index.ts

@@ -31,7 +31,7 @@ export interface Provider {
    * @param options
    * @param provider
    */
-  create(provider: vscode.WebviewViewProvider, template?: Command): void;
+  create(provider: vscode.WebviewViewProvider, template?: Command): Promise<void>;
   destroy(): void;
   send: (message: string, systemMessage?: string, template?: Command) => Promise<any>;
   repeatLast: () => Promise<void>;

src/providers/openai.ts

@@ -5,7 +5,7 @@ import * as vscode from "vscode";
 import { type PostableViewProvider, type ProviderResponse, type Provider } from ".";
 import { type Command } from "../templates/render";
 import { handleResponseCallbackType } from "../templates/runner";
-import { displayWarning, getConfig, getSelectionInfo } from "../utils";
+import { displayWarning, getConfig, getSecret, getSelectionInfo } from "../utils";
 
 interface ConversationState {
   conversationId: string;
@@ -22,14 +22,14 @@ export class OpenAIProvider implements Provider {
   conversationState: ConversationState = { conversationId: "", parentMessageId: "" };
   _abort: AbortController = new AbortController();
 
-  create(provider: PostableViewProvider, template?: Command) {
+  async create(provider: PostableViewProvider, template?: Command) {
+    const apiKey = await getSecret<string>("openai.apiKey", "llama");
+
     const {
-      apiKey = "",
       apiBaseUrl = "https://api.openai.com/v1",
       model = "gpt-3.5-turbo",
       temperature = 0.8,
     } = {
-      apiKey: getConfig<string>("openai.apiKey") ?? getConfig<string>("apiKey"),
       apiBaseUrl: getConfig<string>("openai.apiBaseUrl") ?? getConfig<string>("apiBaseUrl"),
       model: template?.model ?? getConfig<string>("openai.model") ?? getConfig<string>("model"),
       temperature: template?.temperature ?? getConfig<number>("openai.temperature") ?? getConfig<number>("temperature"),

src/utils.ts

@@ -4,6 +4,8 @@ import path from "node:path";
 import Glob from "fast-glob";
 import * as vscode from "vscode";
 
+import { ExtensionState } from "./extension";
+
 export function getSelectionInfo(editor: vscode.TextEditor): { selectedText: string; startLine: number; endLine: number } {
   const { selection } = editor;
   const startLine = selection.start.line;
@@ -69,14 +71,18 @@ function indentText(text: string, line: vscode.TextLine): string {
     .join("\n");
 }
 
-export const getConfig = <T>(key: string, fallback?: unknown | undefined): T => {
+export const getConfig = <T>(key: string, fallback?: T | undefined): T => {
   const config = vscode.workspace.getConfiguration("wingman");
   if (fallback) {
     return config.get(key, fallback) as T;
   }
   return config.get(key) as T;
 };
 
+export const getSecret = async <T>(key: string, fallback?: T | undefined): Promise<T> => {
+  return (await ExtensionState.getSecret<T>(key)) ?? (fallback as T);
+};
+
 export const updateGlobalConfig = <T>(key: string, value: T): void => {
   vscode.workspace.getConfiguration("wingman").update(key, value, true);
 };

src/views.ts

@@ -193,7 +193,7 @@ export class SecondaryViewProvider implements vscode.WebviewViewProvider {
 
   constructor(private readonly _extensionPath: string, private readonly _extensionUri: vscode.Uri) {}
 
-  public static runCommand(command: Command) {
+  public static async runCommand(command: Command) {
     const { provider, command: cmd } = command;
 
     if (!provider) {
@@ -212,7 +212,7 @@ export class SecondaryViewProvider implements vscode.WebviewViewProvider {
 
     // Every command run should instantiate a new provider, which is why we call destroy here.
     getProviderInstance()?.destroy();
-    getProviderInstance()?.create(this as any, command);
+    await getProviderInstance()?.create(this as any, command);
 
     vscode.commands.executeCommand(`wingman.${cmd}`);
   }