feat: modify example

FellouAI · Dec 29, 2024 · 72e287b · 72e287b
1 parent 4ce602f
commit 72e287b
Show file tree

Hide file tree

Showing 6 changed files with 101 additions and 45 deletions.
diff --git a/src/background/index.ts b/src/background/index.ts
@@ -11,7 +11,7 @@ chrome.runtime.onMessage.addListener(async function (
   if (request.type == "run") {
     // await testTools();
     // await testWebSearchWithLLM();
-    await testWebSearchWithComputer();
-    // await testWebSearchWithWorkflow();
+    // await testWebSearchWithComputer();
+    await testWebSearchWithWorkflow();
   }
 });
diff --git a/src/background/test_llm_computer.ts b/src/background/test_llm_computer.ts
@@ -1,4 +1,4 @@
-import { ClaudeProvider } from "ekoai";
+import { ClaudeProvider, OpenaiProvider } from "ekoai";
 import {
   ExecutionContext,
   Message,
@@ -9,15 +9,22 @@ import {
 import { tools, getLLMConfig } from "ekoai/extension";
 
 export async function testWebSearchWithComputer() {
-  let apiKey = (await getLLMConfig()).apiKey;
-  if (!apiKey) {
+  let config = await getLLMConfig();
+  if (!config && !config.apiKey) {
     throw Error("Please configure apiKey");
   }
-  let llmProvider = new ClaudeProvider(apiKey);
+  let llmProvider = config.llm == "openai"
+      ? new OpenaiProvider(config.apiKey, config.modelName, {
+          baseURL: config.baseURL,
+        })
+      : new ClaudeProvider(config.apiKey, config.modelName, {
+          baseURL: config.baseURL,
+        });
   let context = {
+    llmProvider,
     variables: new Map<string, unknown>(),
-    tools: [],
-  } as any as ExecutionContext;
+    tools: new Map<string, Tool<any, any>>(),
+  } as ExecutionContext;
 
   let messages: Message[] = [
     {

diff --git a/src/background/test_llm_search.ts b/src/background/test_llm_search.ts
@@ -1,4 +1,4 @@
-import { ClaudeProvider } from "ekoai";
+import { ClaudeProvider, OpenaiProvider } from "ekoai";
 import {
   ExecutionContext,
   Message,
@@ -9,15 +9,22 @@ import {
 import { tools, getLLMConfig } from "ekoai/extension";
 
 export async function testWebSearchWithLLM() {
-  let apiKey = (await getLLMConfig()).apiKey;
-  if (!apiKey) {
+  let config = await getLLMConfig();
+  if (!config && !config.apiKey) {
     throw Error("Please configure apiKey");
   }
-  let llmProvider = new ClaudeProvider(apiKey);
+  let llmProvider = config.llm == "openai"
+      ? new OpenaiProvider(config.apiKey, config.modelName, {
+          baseURL: config.baseURL,
+        })
+      : new ClaudeProvider(config.apiKey, config.modelName, {
+          baseURL: config.baseURL,
+        });
   let context = {
+    llmProvider,
     variables: new Map<string, unknown>(),
-    tools: [],
-  } as any as ExecutionContext;
+    tools: new Map<string, Tool<any, any>>(),
+  } as ExecutionContext;
 
   let messages: Message[] = [
     {

diff --git a/src/background/test_llm_workflow.ts b/src/background/test_llm_workflow.ts
@@ -1,28 +1,23 @@
-import {
-  ClaudeProvider,
-  ToolRegistry,
-  WorkflowGenerator,
-  WorkflowParser,
-} from "ekoai";
+import { Eko, WorkflowParser } from "ekoai";
 import { tools, getLLMConfig } from "ekoai/extension";
 
 export async function testWebSearchWithWorkflow() {
-  let apiKey = (await getLLMConfig()).apiKey;
-  if (!apiKey) {
+  let config = await getLLMConfig();
+  if (!config && !config.apiKey) {
     throw Error("Please configure apiKey");
   }
 
-  let llmProvider = new ClaudeProvider(apiKey);
+  let eko = new Eko({
+    llm: config.llm as any,
+    apiKey: config.apiKey,
+    modelName: config.modelName,
+    options: { baseURL: config.baseURL },
+  });
 
-  let toolRegistry = new ToolRegistry();
-  toolRegistry.registerTool(new tools.WebSearch());
-  toolRegistry.registerTool(new tools.ExportFile());
+  eko.registerTool(new tools.WebSearch());
+  eko.registerTool(new tools.ExportFile());
 
-  const generator = new WorkflowGenerator(llmProvider, toolRegistry);
-  const workflow = await generator.generateWorkflow(
-    "搜索谢扬信息，汇总成表格导出"
-  );
-  const dsl = WorkflowParser.serialize(workflow);
-  console.log("dsl", dsl);
-  await workflow.execute();
+  const workflow = await eko.generateWorkflow("搜索谢扬信息，汇总成表格导出");
+  console.log("dsl", WorkflowParser.serialize(workflow));
+  await eko.execute(workflow);
 }
diff --git a/src/background/test_tools.ts b/src/background/test_tools.ts
@@ -1,5 +1,5 @@
 import { ElementRect, ExecutionContext, Tool } from "ekoai/types";
-import { getLLMConfig, tools, utils } from "ekoai/extension";
+import { getLLMConfig, tools, browser, utils } from "ekoai/extension";
 import { ClaudeProvider } from "ekoai";
 
 var context: ExecutionContext;
@@ -64,7 +64,7 @@ async function elementClick(task_prompt: string) {
 
 async function type(rect: ElementRect, text: string) {
   let tabId = await utils.getCurrentTabId();
-  let result = await tools.browser.type(tabId, text, [rect.left, rect.top]);
+  let result = await browser.type(tabId, text, [rect.left, rect.top]);
   console.log("type", result);
   return result;
 }

diff --git a/src/options/index.tsx b/src/options/index.tsx
@@ -8,14 +8,18 @@ const OptionsPage = () => {
   const [form] = Form.useForm();
 
   const [config, setConfig] = useState({
-    apiUrl: "https://api.anthropic.com/v1/messages",
+    llm: "claude",
+    baseURL: "https://api.anthropic.com",
     modelName: "claude-3-5-sonnet-20241022",
     apiKey: "",
   });
 
   useEffect(() => {
     chrome.storage.sync.get(["llmConfig"], (result) => {
       if (result.llmConfig) {
+        if (result.llmConfig.llm === "") {
+          result.llmConfig.llm = "claude";
+        }
         setConfig(result.llmConfig);
         form.setFieldsValue(result.llmConfig);
       }
@@ -41,27 +45,70 @@ const OptionsPage = () => {
       });
   };
 
-  const modelOptions = [
-    { value: "claude-3-5-haiku-20241022", label: "Claude 3.5 Haiku" },
-    { value: "claude-3-5-sonnet-20241022", label: "Claude 3.5 Sonnet (default)" },
-    { value: "claude-3-opus-20240229", label: "Claude 3 Opus" },
+  const modelLLMs = [
+    { value: "claude", label: "Claude (default)" },
+    { value: "openai", label: "OpenAI" },
   ];
 
+  const modelOptions = {
+    claude: [
+      { value: "claude-3-5-sonnet-20241022", label: "Claude 3.5 Sonnet (default)" },
+      { value: "claude-3-opus-20240229", label: "Claude 3 Opus" },
+    ],
+    openai: [
+      { value: "gpt-4o", label: "gpt-4o (default)" },
+      { value: "gpt-4o-mini", label: "gpt-4o-mini" },
+      { value: "gpt-4", label: "gpt-4" },
+    ],
+  };
+
+  const handleLLMChange = (value: string) => {
+    const newConfig = {
+      llm: value,
+      baseURL:
+        value === "openai"
+          ? "https://api.openai.com/v1"
+          : "https://api.anthropic.com",
+      modelName: modelOptions[value][0].value,
+      apiKey: "",
+    };
+    setConfig(newConfig);
+    form.setFieldsValue(newConfig);
+  };
+
   return (
     <div className="p-6 max-w-xl mx-auto">
       <Card title="Model Config" className="shadow-md">
         <Form form={form} layout="vertical" initialValues={config}>
           <Form.Item
-            name="apiUrl"
-            label="API URL"
+            name="llm"
+            label="LLM"
+            rules={[
+              {
+                required: true,
+                message: "Please select a LLM",
+              },
+            ]}
+          >
+            <Select placeholder="Choose a LLM" onChange={handleLLMChange}>
+              {modelLLMs.map((llm) => (
+                <Option key={llm.value} value={llm.value}>
+                  {llm.label}
+                </Option>
+              ))}
+            </Select>
+          </Form.Item>
+          <Form.Item
+            name="baseURL"
+            label="Base URL"
             rules={[
               {
                 required: true,
-                message: "Please enter the API address",
+                message: "Please enter the base URL",
               },
             ]}
           >
-            <Input placeholder="Please enter the API address" allowClear />
+            <Input placeholder="Please enter the base URL" allowClear />
           </Form.Item>
 
           <Form.Item
@@ -75,7 +122,7 @@ const OptionsPage = () => {
             ]}
           >
             <Select placeholder="Choose a model">
-              {modelOptions.map((model) => (
+              {modelOptions[config.llm]?.map((model) => (
                 <Option key={model.value} value={model.value}>
                   {model.label}
                 </Option>