Fix Samples (#34)

Author: husseinmozannar

README.md

@@ -153,7 +153,6 @@ coder_client: *client
 web_surfer_client: *client
 file_surfer_client: *client
 action_guard_client: *client
-user_proxy_client: *client
 ```
 
 The corresponding configuration for Azure OpenAI is:
@@ -188,7 +187,6 @@ coder_client: *client
 web_surfer_client: *client
 file_surfer_client: *client
 action_guard_client: *client
-user_proxy_client: *client
 ```
 
 
@@ -246,11 +244,6 @@ cd ..
 magentic ui --port 8081
 ```
 
-For hosting the Magentic-UI, run the command:
-
-```bash
-magentic ui --port 8081 --host 0.0.0.0
-```
 
 #### Running the UI from source
 
@@ -282,44 +275,6 @@ magentic ui --port 8081
 
 The frontend from source will be available at <http://localhost:8000>, and the compiled frontend will be available at <http://localhost:8081>.
 
-### Running the web surfer container directly
-
-First, ensure it is built. Youc an do this by running Magentic UI once beforehand, or by running the following commands:
-
-```bash
-cd src/magentic_ui/docker/magentic-ui-browser-docker
-docker build -t magentic-ui-vnc-browser:latest .
-```
-
-Run it:
-
-```bash
-docker run --rm \
-    -p 9000:9000 \
-    -p 9001:9001 \
-    -v $(pwd):/workspace \
-    -e PLAYWRIGHT_WS_PATH=/ws \
-    -e PLAYWRIGHT_PORT=9000 \
-    -e NO_VNC_PORT=9001 \
-    magentic-ui-vnc-browser:latest
-```
-
-Open a browser and navigate to <http://localhost:9001/vnc.html> to access the VNC viewer.
-
-You'll see a black screen. The browser only launched when needed, so lets run a script to open a page.
-
-```python
-from playwright.sync_api import sync_playwright
-import time
-
-with sync_playwright() as p:
-    browser = p.chromium.connect("ws://localhost:9000/ws")
-    page = browser.new_page()
-    page.goto("https://www.microsoft.com/en-us/research/lab/ai-frontiers/")
-    time.sleep(60)
-```
-
-
 ## Contributing
 
 This project welcomes contributions and suggestions. Most contributions require you to agree to a

frontend/src/components/settings.tsx

@@ -43,6 +43,7 @@ const SettingsMenu: React.FC<SettingsMenuProps> = ({ isOpen, onClose }) => {
   const [allowedlistEnabled, setAllowedlistEnabled] = React.useState(false);
 
   const MODEL_OPTIONS = [
+    { value: "azure-ai-foundry", label: "Azure AI Foundry Template" },
     { value: "gpt-4o-2024-08-06", label: "GPT-4o" },
     { value: "gpt-4o-mini-2024-07-18", label: "GPT-4o Mini" },
     { value: "gpt-4.1-2025-04-14", label: "GPT-4.1" },
@@ -53,6 +54,28 @@ const SettingsMenu: React.FC<SettingsMenuProps> = ({ isOpen, onClose }) => {
     { value: "o1-2024-12-17", label: "O1" },
   ];
 
+  const AZURE_AI_FOUNDRY_YAML = `model_config: &client
+  provider: AzureOpenAIChatCompletionClient
+  config:
+    model: gpt-4o
+    azure_endpoint: "<YOUR ENDPOINT>"
+    azure_deployment: "<YOUR DEPLOYMENT>"
+    api_version: "2024-10-21"
+    azure_ad_token_provider:
+      provider: autogen_ext.auth.azure.AzureTokenProvider
+      config:
+        provider_kind: DefaultAzureCredential
+        scopes:
+          - https://cognitiveservices.azure.com/.default
+    max_retries: 10
+
+orchestrator_client: *client
+coder_client: *client
+web_surfer_client: *client
+file_surfer_client: *client
+action_guard_client: *client
+`;
+
   React.useEffect(() => {
     if (isOpen) {
       setHasChanges(false);
@@ -177,6 +200,11 @@ const SettingsMenu: React.FC<SettingsMenuProps> = ({ isOpen, onClose }) => {
 
   const updateModelInConfig = (modelName: string) => {
     try {
+      if (modelName === "azure-ai-foundry") {
+        handleUpdateConfig({ model_configs: AZURE_AI_FOUNDRY_YAML });
+        message.success("Azure AI Foundry configuration applied");
+        return;
+      }
       const yamlLines = config.model_configs?.split("\n") || [];
       const updatedLines = yamlLines.map((line: string) => {
         if (line.includes("model:")) {
@@ -378,12 +406,12 @@ const SettingsMenu: React.FC<SettingsMenuProps> = ({ isOpen, onClose }) => {
                     </div>
 
                     <div className="flex items-center justify-between">
-                      <span className="flex items-center gap-2">
+                      {/* <span className="flex items-center gap-2">
                         Use Bing Search for Planning
                         <Tooltip title="When enabled, Magentic-UI will use Bing Search when coming up with a plan. Note this adds 10 seconds to the planning time.">
                           <InfoCircleOutlined className="text-secondary hover:text-primary cursor-help" />
                         </Tooltip>
-                      </span>
+                      </span> */}
                       <Switch
                         checked={config.do_bing_search}
                         checkedChildren="ON"

pyproject.toml

@@ -16,9 +16,9 @@ classifiers = [
     "Operating System :: OS Independent",
 ]
 dependencies = [
-    "autogen-agentchat==0.5.3",
-    "autogen-core==0.5.3",
-    "autogen-ext[openai,docker,file-surfer,web-surfer,magentic-one,task-centric-memory]==0.5.3",
+    "autogen-agentchat==0.5.7",
+    "autogen-core==0.5.7",
+    "autogen-ext[openai,docker,file-surfer,web-surfer,magentic-one,task-centric-memory]==0.5.7",
     "aioconsole",
     "nest_asyncio",
     "docker",
@@ -50,11 +50,11 @@ eval = [
 ]
 
 azure = [
-    "autogen-ext[azure]==0.5.3"
+    "autogen-ext[azure]==0.5.7"
 ]
 
 ollama = [
-    "autogen-ext[ollama]==0.5.3"
+    "autogen-ext[ollama]==0.5.7"
 ]
 
 [project.scripts]

samples/README.md

@@ -0,0 +1,51 @@
+# Magentic-UI Sample Scripts
+
+This directory contains sample scripts to help explore Magentic-UI. Each script showcases a different agent or team configuration. See below for a brief explanation of each sample:
+
+We will be adding more samples to help you get the most out of magentic-ui.
+
+## 1. `sample_azure_agent.py`
+
+**Description:**
+
+- Demonstrates how to use an Azure AI Foundry agent within the Magentic-UI team.
+
+**Usage:**
+
+- Configure your Azure credentials and deployment names as needed.
+- Run the script to see the Azure agent respond to a simple message or in the Magentic-UI team.
+
+## 2. `sample_coder.py`
+
+**Description:**
+
+- Runs the coding agent (`CoderAgent`) in a round-robin manner with the user.
+
+**Usage:**
+
+- Run with `python sample_coder.py --work_dir <directory>` (default: `debug`).
+- Enter your coding task at the prompt.
+
+## 3. `sample_file_surfer.py`
+
+**Description:**
+
+- Runs the `FileSurfer` agent, which can browse and read files in a directory.
+
+**Usage:**
+
+- Run with `python sample_file_surfer.py --work-dir <directory>` (default: `debug`).
+- Enter your file-related task at the prompt.
+
+## 4. `sample_web_surfer.py`
+
+**Description:**
+
+- Runs the `WebSurfer` agent, which can interact with web pages using a Playwright browser (local or Dockerized).
+- Supports both headless and VNC (noVNC) browser modes for web automation and browsing tasks.
+
+**Usage:**
+
+- Run with `python sample_web_surfer.py` for local browser.
+- Use `--port` and `--novnc-port` for Docker/VNC modes (see script help for details).
+- Enter your web task at the prompt.