From adf438abfa32f8bf4bab9298cb3a416b34d14ef2 Mon Sep 17 00:00:00 2001 From: Olaoluwa Ademola Salami Date: Sun, 21 Jul 2024 19:42:26 +0100 Subject: [PATCH] add Use AutoGen.Net agent as model in AG Studio (#3182) * add Use AutoGen.Net agent as model in AG Studio * add git lfs * test * dotnet/nuget/icon.png,dotnet/resource/images/background.png,dotnet/resource/images/square.png,dotnet/test/AutoGen.Anthropic.Tests/images/square.png,dotnet/test/AutoGen.Ollama.Tests/images/image.png,dotnet/test/AutoGen.Ollama.Tests/images/square.png,dotnet/test/AutoGen.Tests/ApprovalTests/square.png,dotnet/website/images/articles/CreateAgentWithTools/single-turn-tool-call-with-auto-invoke.png,dotnet/website/images/articles/CreateAgentWithTools/single-turn-tool-call-without-auto-invoke.png,dotnet/website/images/articles/CreateUserProxyAgent/image-1.png,dotnet/website/images/articles/PrintMessageMiddleware/printMessage.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsA.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsB.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsC.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.2OpenAIModel.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.3ModelNameAndURL.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6b.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Terminal.png,dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/TheModelTab.png,notebook/friendly_and_suspicous.jpg,notebook/nested-chats-chess.png,notebook/nested_chat_1.png,notebook/nested_chat_2.png,notebook/optiGuide_new_design.png,notebook/viz_gc.png,samples/apps/auto-anny/images/icon.png,samples/apps/autogen-studio/docs/ara_stockprices.png,samples/apps/autogen-studio/frontend/src/images/icon.png,test/test_files/test_image.png,website/blog/2023-04-21-LLM-tuning-math/img/level2algebra.png,website/blog/2023-04-21-LLM-tuning-math/img/level3algebra.png,website/blog/2023-04-21-LLM-tuning-math/img/level4algebra.png,website/blog/2023-04-21-LLM-tuning-math/img/level5algebra.png,website/blog/2023-05-18-GPT-adaptive-humaneval/img/design.png,website/blog/2023-05-18-GPT-adaptive-humaneval/img/humaneval.png,website/blog/2023-06-28-MathChat/img/mathchatflow.png,website/blog/2023-06-28-MathChat/img/result.png,website/blog/2023-10-18-RetrieveChat/img/retrievechat-arch.png,website/blog/2023-10-26-TeachableAgent/img/teachable-arch.png,website/blog/2023-11-06-LMM-Agent/img/teaser.png,website/blog/2023-11-09-EcoAssistant/img/chat.png,website/blog/2023-11-09-EcoAssistant/img/results.png,website/blog/2023-11-09-EcoAssistant/img/system.png,website/blog/2023-11-09-EcoAssistant/img/template-demo.png,website/blog/2023-11-09-EcoAssistant/img/template.png,website/blog/2023-11-13-OAI-assistants/img/teaser.jpg,website/blog/2023-11-20-AgentEval/img/agenteval-CQ.png,website/blog/2023-11-20-AgentEval/img/math-problems-plot.png,website/blog/2023-11-20-AgentEval/img/tasks-taxonomy.png,website/blog/2023-11-26-Agent-AutoBuild/img/agent_autobuild.png,website/blog/2023-12-01-AutoGenStudio/img/autogenstudio_config.png,website/blog/2023-12-01-AutoGenStudio/img/autogenstudio_home.png,website/blog/2023-12-01-AutoGenStudio/img/autogenstudio_skills.png,website/blog/2023-12-23-AgentOptimizer/img/agentoptimizer.png,website/blog/2024-01-25-AutoGenBench/img/teaser.jpg,website/blog/2024-02-02-AutoAnny/img/AutoAnnyLogo.jpg,website/blog/2024-02-11-FSM-GroupChat/img/FSM_logic.png,website/blog/2024-02-11-FSM-GroupChat/img/FSM_of_multi-agents.png,website/blog/2024-02-11-FSM-GroupChat/img/teaser.jpg,website/blog/2024-02-29-StateFlow/img/alfworld.png,website/blog/2024-02-29-StateFlow/img/bash_result.png,website/blog/2024-02-29-StateFlow/img/intercode.png,website/blog/2024-02-29-StateFlow/img/sf_example_1.png,website/blog/2024-03-03-AutoGen-Update/img/contributors.png,website/blog/2024-03-03-AutoGen-Update/img/dalle_gpt4v.png,website/blog/2024-03-03-AutoGen-Update/img/gaia.png,website/blog/2024-03-03-AutoGen-Update/img/love.png,website/blog/2024-03-03-AutoGen-Update/img/teach.png,website/blog/2024-03-11-AutoDefense/imgs/architecture.png,website/blog/2024-03-11-AutoDefense/imgs/defense-agency-design.png,website/blog/2024-03-11-AutoDefense/imgs/table-4agents.png,website/blog/2024-03-11-AutoDefense/imgs/table-agents.png,website/blog/2024-03-11-AutoDefense/imgs/table-compared-methods.png,website/blog/2024-05-24-Agent/img/agents.png,website/blog/2024-05-24-Agent/img/leadership.png,website/blog/2024-06-21-AgentEval/img/agenteval_ov_v3.png,website/blog/2024-06-24-AltModels-Classes/img/agentstogether.jpeg,website/docs/Use-Cases/images/agent_example.png,website/docs/Use-Cases/images/app.png,website/docs/Use-Cases/images/autogen_agents.png,website/docs/autogen-studio/img/agent_assistant.png,website/docs/autogen-studio/img/agent_groupchat.png,website/docs/autogen-studio/img/agent_new.png,website/docs/autogen-studio/img/agent_skillsmodel.png,website/docs/autogen-studio/img/ara_stockprices.png,website/docs/autogen-studio/img/model_new.png,website/docs/autogen-studio/img/model_openai.png,website/docs/autogen-studio/img/skill.png,website/docs/autogen-studio/img/workflow_chat.png,website/docs/autogen-studio/img/workflow_export.png,website/docs/autogen-studio/img/workflow_new.png,website/docs/autogen-studio/img/workflow_profile.png,website/docs/autogen-studio/img/workflow_sequential.png,website/docs/autogen-studio/img/workflow_test.png,website/docs/ecosystem/img/ecosystem-composio.png,website/docs/ecosystem/img/ecosystem-databricks.png,website/docs/ecosystem/img/ecosystem-fabric.png,website/docs/ecosystem/img/ecosystem-llamaindex.png,website/docs/ecosystem/img/ecosystem-memgpt.png,website/docs/ecosystem/img/ecosystem-ollama.png,website/docs/ecosystem/img/ecosystem-promptflow.png,website/docs/topics/non-openai-models/images/cloudlocalproxy.png,website/docs/tutorial/assets/code-execution-in-conversation.png,website/docs/tutorial/assets/code-executor-docker.png,website/docs/tutorial/assets/code-executor-no-docker.png,website/docs/tutorial/assets/conversable-agent.jpg,website/docs/tutorial/assets/group-chat.png,website/docs/tutorial/assets/human-in-the-loop.png,website/docs/tutorial/assets/nested-chats.png,website/docs/tutorial/assets/sequential-two-agent-chat.png,website/docs/tutorial/assets/two-agent-chat.png,website/static/img/autogen_agentchat.png,website/static/img/autogen_app.png,website/static/img/chat_example.png,website/static/img/create_gcp_svc.png,website/static/img/gallery/TensionCode.png,website/static/img/gallery/autotx.png,website/static/img/gallery/composio-autogen.png,website/static/img/gallery/default.png,website/static/img/gallery/robot.jpg,website/static/img/gallery/webagent.jpg,website/static/img/gallery/x-force-ide-ui.png: convert to Git LFS --- .../FinalStepsA.png | 3 + .../FinalStepsB.png | 3 + .../FinalStepsC.png | 3 + .../Step5.2OpenAIModel.png | 3 + .../Step5.3ModelNameAndURL.png | 3 + .../UseAutoGenAsModelinAGStudio/Step6.png | 3 + .../UseAutoGenAsModelinAGStudio/Step6b.png | 3 + .../UseAutoGenAsModelinAGStudio/Terminal.png | 3 + .../TheModelTab.png | 3 + ...AutoGen.Net-agent-as-model-in-AG-Studio.md | 84 +++++++++++++++++++ dotnet/website/tutorial/toc.yml | 5 +- 11 files changed, 115 insertions(+), 1 deletion(-) create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsA.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsB.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsC.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.2OpenAIModel.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.3ModelNameAndURL.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6b.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Terminal.png create mode 100644 dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/TheModelTab.png create mode 100644 dotnet/website/tutorial/Use-AutoGen.Net-agent-as-model-in-AG-Studio.md diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsA.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsA.png new file mode 100644 index 000000000..0403a8cf9 --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsA.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:491f8f538c55ce8768179cabfd3789c71c4a07b7d809f85deba9b8f4b759c00e +size 42329 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsB.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsB.png new file mode 100644 index 000000000..03a68735c --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsB.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:e319fad11682c46c3dc511e2fc63e033f3f99efb06d4530e7f72d1f4af23848f +size 31528 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsC.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsC.png new file mode 100644 index 000000000..7326ad14d --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/FinalStepsC.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:a8024b5336615e8c2c3497df7a5890a331bd5bdc7b15dd06abd7ec528ffe0932 +size 70169 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.2OpenAIModel.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.2OpenAIModel.png new file mode 100644 index 000000000..b2b7481bb --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.2OpenAIModel.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:911f2f7c1ab4f9403386298d9769243c0aa8cc22c6f119342cc107a654d1463a +size 44041 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.3ModelNameAndURL.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.3ModelNameAndURL.png new file mode 100644 index 000000000..d1c19f300 --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step5.3ModelNameAndURL.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:ec10a48ed3f0a6d8448e0ce425658f3857c2cf89e2badef8a8d3a8c3744fc3bf +size 51944 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6.png new file mode 100644 index 000000000..67c734454 --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:f016faea51f64af3970fde41ac95249c4e0423b02573f058c36dc1e6ba15562d +size 50669 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6b.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6b.png new file mode 100644 index 000000000..ebd19bff0 --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Step6b.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:4a23cbbf5d3d24eaf1da9370e0914f186815f2ecbf46131d2fd6eb5ff3264d96 +size 22569 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Terminal.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Terminal.png new file mode 100644 index 000000000..9edefc3ae --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/Terminal.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:97328776c25fd0a61c76065db379406d8d3c96bd8773490c34c168cd7c69a855 +size 58527 diff --git a/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/TheModelTab.png b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/TheModelTab.png new file mode 100644 index 000000000..55e7bd862 --- /dev/null +++ b/dotnet/website/images/articles/UseAutoGenAsModelinAGStudio/TheModelTab.png @@ -0,0 +1,3 @@ +version https://git-lfs.github.com/spec/v1 +oid sha256:1d7f4f3a772278e6de320a3601a76f8a9862cab4a9c0da03fad3058b86fcfaf7 +size 45260 diff --git a/dotnet/website/tutorial/Use-AutoGen.Net-agent-as-model-in-AG-Studio.md b/dotnet/website/tutorial/Use-AutoGen.Net-agent-as-model-in-AG-Studio.md new file mode 100644 index 000000000..a47cb01f6 --- /dev/null +++ b/dotnet/website/tutorial/Use-AutoGen.Net-agent-as-model-in-AG-Studio.md @@ -0,0 +1,84 @@ +This tutorial shows how to use AutoGen.Net agent as model in AG Studio + +## Step 1. Create Dotnet empty web app and install AutoGen and AutoGen.WebAPI package + +```bash +dotnet new web +dotnet add package AutoGen +dotnet add package AutoGen.WebAPI +``` + +## Step 2. Replace the Program.cs with following code + +```bash +using AutoGen.Core; +using AutoGen.Service; + +var builder = WebApplication.CreateBuilder(args); +var app = builder.Build(); + +var helloWorldAgent = new HelloWorldAgent(); +app.UseAgentAsOpenAIChatCompletionEndpoint(helloWorldAgent); + +app.Run(); + +class HelloWorldAgent : IAgent +{ + public string Name => "HelloWorld"; + + public Task GenerateReplyAsync(IEnumerable messages, GenerateReplyOptions? options = null, CancellationToken cancellationToken = default) + { + return Task.FromResult(new TextMessage(Role.Assistant, "Hello World!", from: this.Name)); + } +} +``` + +## Step 3: Start the web app + +Run the following command to start web api + +```bash +dotnet RUN +``` + +The web api will listen at `http://localhost:5264/v1/chat/completion + +![terminal](../images/articles/UseAutoGenAsModelinAGStudio/Terminal.png) + +## Step 4: In another terminal, start autogen-studio + +```bash +autogenstudio ui +``` + +## Step 5: Navigate to AutoGen Studio UI and add hello world agent as openai Model + +### Step 5.1: Go to model tab + +![The Model Tab](../images/articles/UseAutoGenAsModelinAGStudio/TheModelTab.png) + +### Step 5.2: Select "OpenAI model" card + +![Open AI model Card](../images/articles/UseAutoGenAsModelinAGStudio/Step5.2OpenAIModel.png) + +### Step 5.3: Fill the model name and url + +The model name needs to be same with agent name + +![Fill the model name and url](../images/articles/UseAutoGenAsModelinAGStudio/Step5.3ModelNameAndURL.png) + +## Step 6: Create a hello world agent that uses the hello world model + +![Create a hello world agent that uses the hello world model](../images/articles/UseAutoGenAsModelinAGStudio/Step6.png) + +![Agent Configuration](../images/articles/UseAutoGenAsModelinAGStudio/Step6b.png) + +## Final Step: Use the hello world agent in workflow + +![Use the hello world agent in workflow](../images/articles/UseAutoGenAsModelinAGStudio/FinalStepsA.png) + +![Use the hello world agent in workflow](../images/articles/UseAutoGenAsModelinAGStudio/FinalStepsA.png) + +![Use the hello world agent in workflow](../images/articles/UseAutoGenAsModelinAGStudio/FinalStepsB.png) + +![Use the hello world agent in workflow](../images/articles/UseAutoGenAsModelinAGStudio/FinalStepsC.png) diff --git a/dotnet/website/tutorial/toc.yml b/dotnet/website/tutorial/toc.yml index f624ec4af..167baa70e 100644 --- a/dotnet/website/tutorial/toc.yml +++ b/dotnet/website/tutorial/toc.yml @@ -5,4 +5,7 @@ href: Image-chat-with-agent.md - name: Create agent with tools - href: Create-agent-with-tools.md \ No newline at end of file + href: Create-agent-with-tools.md + +- name: Use AutoGen.Net agent as model in AG Studio + href: Use-AutoGen.Net-agent-as-model-in-AG-Studio.md \ No newline at end of file