Adding OpenAI as LLM Provider (Keeping Anthropic as default)

app/lib/.server/llm/api-key.ts

@@ -1,9 +1,14 @@
 import { env } from 'node:process';
 
-export function getAPIKey(cloudflareEnv: Env) {
-  /**
-   * The `cloudflareEnv` is only used when deployed or when previewing locally.
-   * In development the environment variables are available through `env`.
-   */
-  return env.ANTHROPIC_API_KEY || cloudflareEnv.ANTHROPIC_API_KEY;
+import type { Provider } from './constants';
+
+
+export function getAPIKey(cloudflareEnv: Env, provider: Provider) {
+  if (provider === 'openai') {
+    return env.OPENAI_API_KEY || cloudflareEnv.OPENAI_API_KEY;
+  } else if (provider === 'anthropic') {
+    return env.ANTHROPIC_API_KEY || cloudflareEnv.ANTHROPIC_API_KEY;
+  } else {
+    throw new Error(`Unknown provider: ${provider}`);
+  }
 }

app/lib/.server/llm/constants.ts

@@ -3,3 +3,5 @@ export const MAX_TOKENS = 8192;
 
 // limits the number of model responses that can be returned in a single request
 export const MAX_RESPONSE_SEGMENTS = 2;
+
+export type Provider = 'openai' | 'anthropic';

app/lib/.server/llm/model.ts

@@ -1,9 +1,13 @@
+import { createOpenAI } from '@ai-sdk/openai';
 import { createAnthropic } from '@ai-sdk/anthropic';
 
-export function getAnthropicModel(apiKey: string) {
-  const anthropic = createAnthropic({
-    apiKey,
-  });
-
-  return anthropic('claude-3-5-sonnet-20240620');
-}
+export function getModel(provider: 'openai' | 'anthropic', apiKey: string) {
+  if (provider === 'openai') {
+    const openai = createOpenAI({ apiKey });
+    return openai('gpt-4o'); // e.g., 'gpt-4o'
+  } else if (provider === 'anthropic') {
+    const anthropic = createAnthropic({ apiKey });
+    return anthropic('claude-3-5-sonnet-20240620'); // e.g., 'claude-3-opus-20240229'
+  }
+  throw new Error('Unsupported provider');
+}

app/lib/.server/llm/stream-text.ts

@@ -1,6 +1,6 @@
 import { streamText as _streamText, convertToCoreMessages } from 'ai';
 import { getAPIKey } from '~/lib/.server/llm/api-key';
-import { getAnthropicModel } from '~/lib/.server/llm/model';
+import { getModel } from '~/lib/.server/llm/model';
 import { MAX_TOKENS } from './constants';
 import { getSystemPrompt } from './prompts';
 
@@ -21,9 +21,14 @@ export type Messages = Message[];
 
 export type StreamingOptions = Omit<Parameters<typeof _streamText>[0], 'model'>;
 
-export function streamText(messages: Messages, env: Env, options?: StreamingOptions) {
+export function streamText(
+  messages: Messages,
+  env: Env,
+  options?: StreamingOptions,
+  provider: 'openai' | 'anthropic' = 'anthropic',
+) {
   return _streamText({
-    model: getAnthropicModel(getAPIKey(env)),
+    model: getModel(provider=provider, getAPIKey(env, provider)),
     system: getSystemPrompt(),
     maxTokens: MAX_TOKENS,
     headers: {

package.json

@@ -24,6 +24,7 @@
   },
   "dependencies": {
     "@ai-sdk/anthropic": "^0.0.39",
+    "@ai-sdk/openai": "^1.3.20",
     "@codemirror/autocomplete": "^6.17.0",
     "@codemirror/commands": "^6.6.0",
     "@codemirror/lang-cpp": "^6.0.2",
@@ -87,6 +88,7 @@
     "is-ci": "^3.0.1",
     "node-fetch": "^3.3.2",
     "prettier": "^3.3.2",
+    "sass-embedded": "^1.87.0",
     "typescript": "^5.5.2",
     "unified": "^11.0.5",
     "unocss": "^0.61.3",