feat: Enhance BAML configuration and proxy settings in VSCode extension (#1489)

- Update event listeners to support configuration updates
- Add proxy URL and settings display in environment variables panel

<!-- ELLIPSIS_HIDDEN -->


----

> [!IMPORTANT]
> Enhance BAML configuration and proxy settings in VSCode extension by
updating event listeners, adding proxy display, and improving
configuration management.
> 
>   - **Behavior**:
> - Update event listeners in `EventListener.tsx` to handle
`baml_settings_updated` command and update BAML configuration.
> - Add proxy URL and settings display in `env-vars.tsx` with a checkbox
to toggle proxy settings.
> - Modify error messages in `request.rs` to include more descriptive
text and handle proxy suggestions for `wasm32`.
>   - **Configuration**:
> - Introduce `bamlConfig` and `BamlConfigAtom` in `bamlConfig.ts` to
manage BAML settings.
> - Update `vscode-rpc.ts` and `vscode.ts` to handle
`SET_PROXY_SETTINGS` command.
> - Implement `bamlConfigSchema` in `bamlConfig.ts` to validate
configuration structure.
>   - **Misc**:
> - Format code in `request.rs` and `stream_request.rs` for better
readability.
> - Add `baml_settings_updated` request handling in `server.ts` and
`index.ts` to sync configuration changes.
>     - Remove unused `getIsProxyEnabled` function from `vscode.ts`.
> 
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=BoundaryML%2Fbaml&utm_source=github&utm_medium=referral)<sup>
for da5ea33. It will automatically
update as commits are pushed.</sup>


<!-- ELLIPSIS_HIDDEN -->

Author: hellovai

engine/baml-runtime/src/internal/llm_client/primitive/request.rs

@@ -54,7 +54,7 @@ pub async fn make_request(
                 start_time: system_now,
                 request_options: client.request_options().clone(),
                 latency: instant_now.elapsed(),
-                message: format!("{:#?}", e),
+                message: format!("Failed to create request builder: {:#?}", e),
                 code: ErrorCode::Other(2),
             }));
         }
@@ -70,7 +70,7 @@ pub async fn make_request(
                 start_time: system_now,
                 request_options: client.request_options().clone(),
                 latency: instant_now.elapsed(),
-                message: format!("{:#?}", e),
+                message: format!("Failed to build request: {:#?}", e),
                 code: ErrorCode::Other(2),
             }));
         }
@@ -86,8 +86,22 @@ pub async fn make_request(
                 start_time: system_now,
                 request_options: client.request_options().clone(),
                 latency: instant_now.elapsed(),
-                message: format!("{:?}", e),
-                code: ErrorCode::Other(2),
+                message: {
+                    #[cfg(not(target_arch = "wasm32"))]
+                    {
+                        format!("{}", e.to_string())
+                    }
+                    #[cfg(target_arch = "wasm32")]
+                    {
+                        format!(
+                            "{}\n\nIf you haven't yet, try enabling the proxy (See API Keys button)",
+                            e.to_string()
+                        )
+                    }
+                },
+                code: e
+                    .status()
+                    .map_or(ErrorCode::Other(2), |s| ErrorCode::from_status(s)),
             }));
         }
     };
@@ -149,9 +163,37 @@ pub async fn make_parsed_request(
     };
 
     match response_type {
-        ResponseType::OpenAI => super::openai::response_handler::parse_openai_response(client, prompt, response_body, system_now, instant_now, model_name),
-        ResponseType::Anthropic => super::anthropic::response_handler::parse_anthropic_response(client, prompt, response_body, system_now, instant_now, model_name),
-        ResponseType::Google => super::google::response_handler::parse_google_response(client, prompt, response_body, system_now, instant_now, model_name),
-        ResponseType::Vertex => super::vertex::response_handler::parse_vertex_response(client, prompt, response_body, system_now, instant_now, model_name),
+        ResponseType::OpenAI => super::openai::response_handler::parse_openai_response(
+            client,
+            prompt,
+            response_body,
+            system_now,
+            instant_now,
+            model_name,
+        ),
+        ResponseType::Anthropic => super::anthropic::response_handler::parse_anthropic_response(
+            client,
+            prompt,
+            response_body,
+            system_now,
+            instant_now,
+            model_name,
+        ),
+        ResponseType::Google => super::google::response_handler::parse_google_response(
+            client,
+            prompt,
+            response_body,
+            system_now,
+            instant_now,
+            model_name,
+        ),
+        ResponseType::Vertex => super::vertex::response_handler::parse_vertex_response(
+            client,
+            prompt,
+            response_body,
+            system_now,
+            instant_now,
+            model_name,
+        ),
     }
 }

engine/baml-runtime/src/internal/llm_client/primitive/stream_request.rs

@@ -7,13 +7,17 @@ use crate::internal::llm_client::{
 use anyhow::{Context, Result};
 use baml_types::BamlMap;
 use eventsource_stream::Eventsource;
-use futures::StreamExt;
+use futures::{StreamExt, TryStreamExt};
 use internal_baml_jinja::RenderedChatMessage;
 use reqwest::Response;
 use serde::de::DeserializeOwned;
 
 use super::{
-    anthropic::response_handler::scan_anthropic_response_stream, google::response_handler::scan_google_response_stream, openai::response_handler::scan_openai_response_stream, request::{make_request, to_prompt, RequestBuilder, ResponseType}, vertex::response_handler::scan_vertex_response_stream
+    anthropic::response_handler::scan_anthropic_response_stream,
+    google::response_handler::scan_google_response_stream,
+    openai::response_handler::scan_openai_response_stream,
+    request::{make_request, to_prompt, RequestBuilder, ResponseType},
+    vertex::response_handler::scan_vertex_response_stream,
 };
 
 pub async fn make_stream_request(

typescript/playground-common/src/baml_wasm_web/EventListener.tsx

@@ -20,6 +20,7 @@ import { CodeMirrorDiagnosticsAtom } from '@/shared/baml-project-panel/codemirro
 import { AlertTriangle, XCircle } from 'lucide-react'
 import { CheckCircle } from 'lucide-react'
 import { useDebounce, useDebounceCallback } from '@react-hook/debounce'
+import { bamlConfig, BamlConfigAtom } from './bamlConfig'
 
 export const hasClosedEnvVarsDialogAtom = atomWithStorage<boolean>(
   'has-closed-env-vars-dialog',
@@ -84,6 +85,7 @@ export const EventListener: React.FC<{ children: React.ReactNode }> = ({ childre
 
   const [selectedFunc, setSelectedFunction] = useAtom(selectedFunctionAtom)
   const setSelectedTestcase = useSetAtom(selectedTestcaseAtom)
+  const setBamlConfig = useSetAtom(bamlConfig)
   const [bamlCliVersion, setBamlCliVersion] = useAtom(bamlCliVersionAtom)
   const { setRunningTests } = useRunTests()
   const wasm = useAtomValue(wasmAtom)
@@ -156,6 +158,10 @@ export const EventListener: React.FC<{ children: React.ReactNode }> = ({ childre
             command: 'baml_cli_version'
             content: string
           }
+        | {
+            command: 'baml_settings_updated'
+            content: BamlConfigAtom
+          }
         | {
             command: 'run_test'
             content: { test_name: string }
@@ -184,6 +190,10 @@ export const EventListener: React.FC<{ children: React.ReactNode }> = ({ childre
             updateCursor(content.cursor)
           }
           break
+        case 'baml_settings_updated':
+          console.log('baml_settings_updated', content)
+          setBamlConfig(content)
+          break
         case 'baml_cli_version':
           console.log('baml_cli_version', content)
           setBamlCliVersion(content)

typescript/playground-common/src/baml_wasm_web/bamlConfig.ts

@@ -0,0 +1,26 @@
+// COPIED FROM ./vscode-ext/packages/vscode/src/plugins/language-server/bamlConfig.ts
+
+import { atom } from 'jotai'
+import { z } from 'zod'
+export const bamlConfigSchema = z
+  .object({
+    cliPath: z.optional(z.string().nullable()).default(null),
+    generateCodeOnSave: z.enum(['never', 'always']).default('always'),
+    restartTSServerOnSave: z.boolean().default(false),
+    enablePlaygroundProxy: z.boolean().default(true),
+    envCommand: z.string().default('env'),
+    fileWatcher: z.boolean().default(false),
+    trace: z.object({
+      server: z.enum(['off', 'messages', 'verbose']).default('off'),
+    }),
+    bamlPanelOpen: z.boolean().default(false),
+  })
+  .partial()
+type BamlConfig = z.infer<typeof bamlConfigSchema>
+
+export type BamlConfigAtom = { config: BamlConfig | null; cliVersion: string | null }
+
+export const bamlConfig = atom<BamlConfigAtom>({
+  config: null,
+  cliVersion: null,
+})

typescript/playground-common/src/shared/baml-project-panel/atoms.ts

@@ -6,6 +6,7 @@ import { type ICodeBlock } from './types'
 import { vscodeLocalStorageStore } from './Jotai'
 import { orchIndexAtom } from './playground-panel/atoms-orch-graph'
 import { vscode } from './vscode'
+import { bamlConfig } from '../../baml_wasm_web/bamlConfig'
 
 const wasmAtomAsync = atom(async () => {
   const wasm = await import('@gloo-ai/baml-schema-wasm-web/baml_schema_build')
@@ -157,21 +158,12 @@ export const generatedFilesByLangAtom = atomFamily((lang: ICodeBlock['language']
 
 export const isPanelVisibleAtom = atom(false)
 
-const vscodeSettingsAtom = unwrap(
-  atom(async () => {
-    try {
-      const res = await vscode.getIsProxyEnabled()
-      return {
-        enablePlaygroundProxy: res,
-      }
-    } catch (e) {
-      console.error(`Error occurred while getting vscode settings:\n${JSON.stringify(e)}`)
-      return {
-        enablePlaygroundProxy: true,
-      }
-    }
-  }),
-)
+const vscodeSettingsAtom = atom<{ enablePlaygroundProxy: boolean }>((get) => {
+  const config = get(bamlConfig)
+  return {
+    enablePlaygroundProxy: config.config?.enablePlaygroundProxy ?? true,
+  }
+})
 
 const playgroundPortAtom = unwrap(
   atom(async () => {
@@ -185,6 +177,17 @@ const playgroundPortAtom = unwrap(
   }),
 )
 
+export const proxyUrlAtom = atom((get) => {
+  const vscodeSettings = get(vscodeSettingsAtom)
+  const port = get(playgroundPortAtom)
+  const proxyUrl = port && port !== 0 ? `http://localhost:${port}` : undefined
+  const proxyEnabled = !!vscodeSettings?.enablePlaygroundProxy
+  return {
+    proxyEnabled,
+    proxyUrl,
+  }
+})
+
 export const resetEnvKeyValuesAtom = atom(null, (get, set) => {
   set(envKeyValueStorage, [])
 })
@@ -233,23 +236,24 @@ export const envVarsAtom = atom(
       // NextJS environment doesnt have vscode settings, and proxy is always enabled
       return Object.fromEntries(defaultEnvKeyValues.map(([k, v]) => [k, v]))
     } else {
-      const vscodeSettings = get(vscodeSettingsAtom)
-      console.log('vscodeSettings', vscodeSettings)
-      if (vscodeSettings?.enablePlaygroundProxy !== undefined && !vscodeSettings?.enablePlaygroundProxy) {
+      const { proxyEnabled, proxyUrl } = get(proxyUrlAtom)
+      if (!proxyEnabled) {
         // filter it out
         const envKeyValues = get(envKeyValuesAtom)
         return Object.fromEntries(envKeyValues.map(([k, v]) => [k, v]).filter(([k]) => k !== 'BOUNDARY_PROXY_URL'))
       }
 
       const envKeyValues = get(envKeyValuesAtom)
-      const port = get(playgroundPortAtom)
+      if (proxyUrl === undefined) {
+        return Object.fromEntries(envKeyValues.map(([k, v]) => [k, v]).filter(([k]) => k !== 'BOUNDARY_PROXY_URL'))
+      }
       const entries = envKeyValues.map(([k, v]) => {
-        if (k === 'BOUNDARY_PROXY_URL' && port !== 0) {
-          return [k, `http://localhost:${port}`]
+        if (k === 'BOUNDARY_PROXY_URL') {
+          return [k, proxyUrl]
         }
         return [k, v]
       })
-      return Object.fromEntries(entries)
+      return Object.fromEntries(entries.filter((e) => e !== undefined))
     }
   },
   (get, set, newEnvVars: Record<string, string>) => {