Add WebSocket job status endpoint and update team config

Introduces a WebSocket endpoint in the backend for job status updates, enabling real-time plan approval and rejection. Updates the default_team.json to include a new 'use_bing' property for agents. Refactors HomePage.tsx to use InlineToaster for team selection and upload notifications, improving user feedback.

Author: Fr4nc3

data/agent_teams/default_team.json

@@ -17,7 +17,8 @@
             "index_name": "",
             "use_rag": false,
             "use_mcp": false,
-            "coding_tools": false
+            "coding_tools": false,
+            "use_bing": false
         },
         {
             "input_key": "tech-support-001",
@@ -30,7 +31,8 @@
             "index_name": "",
             "use_rag": false,
             "use_mcp": false,
-            "coding_tools": false
+            "coding_tools": false,
+            "use_bing": false
         },
         {
             "input_key": "procurement-001",
@@ -43,7 +45,8 @@
             "index_name": "",
             "use_rag": false,
             "use_mcp": false,
-            "coding_tools": false
+            "coding_tools": false,
+            "use_bing": false
         },
         {
             "input_key": "marketing-001",
@@ -56,7 +59,8 @@
             "index_name": "",
             "use_rag": false,
             "use_mcp": false,
-            "coding_tools": false
+            "coding_tools": false,
+            "use_bing": false
         },
         {
             "input_key": "generic-001",
@@ -69,7 +73,8 @@
             "index_name": "",
             "use_rag": false,
             "use_mcp": false,
-            "coding_tools": false
+            "coding_tools": false,
+            "use_bing": false
         }
     ],
     "description": "Business Operations team handles employee onboarding, telecommunications support, procurement, and marketing tasks for comprehensive business operations management.",

src/backend/v3/api/router.py

@@ -5,12 +5,24 @@
 from auth.auth_utils import get_authenticated_user_details
 from common.config.app_config import config
 from common.database.database_factory import DatabaseFactory
-from common.models.messages_kernel import (GeneratePlanRequest, InputTask,
-                                           Plan, PlanStatus)
+from common.models.messages_kernel import (
+    GeneratePlanRequest,
+    InputTask,
+    Plan,
+    PlanStatus,
+)
 from common.utils.event_utils import track_event_if_configured
 from common.utils.utils_kernel import rai_success, rai_validate_team_config
-from fastapi import (APIRouter, Depends, File, HTTPException, Request,
-                     UploadFile)
+from fastapi import (
+    APIRouter,
+    Depends,
+    File,
+    HTTPException,
+    Request,
+    UploadFile,
+    WebSocket,
+    WebSocketDisconnect,
+)
 from kernel_agents.agent_factory import AgentFactory
 from semantic_kernel.agents.runtime import InProcessRuntime
 from v3.common.services.team_service import TeamService
@@ -23,6 +35,7 @@
     responses={404: {"description": "Not found"}},
 )
 
+
 # To do: change endpoint to process request
 @app_v3.post("/create_plan")
 async def process_request(input_task: InputTask, request: Request):
@@ -135,13 +148,17 @@ async def process_request(input_task: InputTask, request: Request):
         # )
 
         # setup and call the magentic orchestration
-        magentic_orchestration = await orchestration_config.get_current_orchestration(user_id)
+        magentic_orchestration = await orchestration_config.get_current_orchestration(
+            user_id
+        )
 
         runtime = InProcessRuntime()
         runtime.start()
 
         # invoke returns immediately, wait on result.get
-        orchestration_result = await magentic_orchestration.invoke(task=input_task.description,runtime=runtime)
+        orchestration_result = await magentic_orchestration.invoke(
+            task=input_task.description, runtime=runtime
+        )
         team_result = await orchestration_result.get()
 
         # Save the plan to the database
@@ -637,3 +654,28 @@ async def get_search_indexes_endpoint(request: Request):
     except Exception as e:
         logging.error(f"Error retrieving search indexes: {str(e)}")
         raise HTTPException(status_code=500, detail="Internal server error occurred")
+
+
+# WebSocket endpoint for job status updates
+plans = {}  # job_id -> current plan
+approvals = {}  # job_id -> True/False/None
+sockets = {}  # job_id -> WebSocket
+
+
+@app_v3.websocket("/ws/{job_id}")
+async def ws(job_id: str, websocket: WebSocket):
+    await websocket.accept()
+    sockets[job_id] = websocket
+    try:
+        if job_id in plans:
+            await websocket.send_json({"type": "plan_ready", "plan": plans[job_id]})
+        while True:
+            msg = await websocket.receive_json()
+            if msg.get("type") == "approve":
+                approvals[job_id] = True
+                await websocket.send_json({"type": "ack", "message": "approved"})
+            elif msg.get("type") == "reject":
+                approvals[job_id] = False
+                await websocket.send_json({"type": "ack", "message": "rejected"})
+    except WebSocketDisconnect:
+        sockets.pop(job_id, None)

src/frontend/src/pages/HomePage.tsx

@@ -25,7 +25,7 @@ import ContentToolbar from '@/coral/components/Content/ContentToolbar';
 import { TaskService } from '../services/TaskService';
 import { TeamConfig } from '../models/Team';
 import { TeamService } from '../services/TeamService';
-
+import InlineToaster, { useInlineToaster } from "../components/toast/InlineToaster";
 /**
  * HomePage component - displays task lists and provides navigation
  * Accessible via the route "/"
@@ -35,7 +35,7 @@ const HomePage: React.FC = () => {
     const { dispatchToast } = useToastController("toast");
     const [selectedTeam, setSelectedTeam] = useState<TeamConfig | null>(null);
     const [isLoadingTeam, setIsLoadingTeam] = useState(true);
-
+    const { showToast, dismissToast } = useInlineToaster();
     /**
      * Load teams and set default team on component mount
      */
@@ -91,31 +91,11 @@ const HomePage: React.FC = () => {
     const handleTeamSelect = useCallback((team: TeamConfig | null) => {
         setSelectedTeam(team);
         if (team) {
-
-            showToast(`{team.name} team has been selected with {team.agents.length} agents`, "success");
-            // dispatchToast(
-            //     <Toast>
-            //         <ToastTitle>Team Selected</ToastTitle>
-            //         <ToastBody>
-            //             {team.name} team has been selected with {team.agents.length} agents
-            //         </ToastBody>
-            //     </Toast>,
-            //     { intent: "success" }
-            // );
+            showToast(`${team.name} team has been selected with ${team.agents.length} agents`, "success");
         } else {
-
             showToast(`No team is currently selected`, "info");
-            // dispatchToast(
-            //     <Toast>
-            //         <ToastTitle>Team Deselected</ToastTitle>
-            //         <ToastBody>
-            //             No team is currently selected
-            //         </ToastBody>
-            //     </Toast>,
-            //     { intent: "info" }
-            // );
         }
-    }, [dispatchToast]);
+    }, [showToast]);
 
     /**
      * Handle team upload completion - refresh team list and keep Business Operations Team as default
@@ -132,22 +112,13 @@ const HomePage: React.FC = () => {
                 setSelectedTeam(defaultTeam);
                 console.log('Default team after upload:', defaultTeam.name);
                 console.log('Business Operations Team remains default');
-                showToast(`Team uploaded. {defaultTeam.name} remains your default team.`, "success");
-                // Show a toast notification about the upload success
-                // dispatchToast(
-                //     <Toast>
-                //         <ToastTitle>Team Uploaded Successfully!</ToastTitle>
-                //         <ToastBody>
-                //             Team uploaded. {defaultTeam.name} remains your default team.
-                //         </ToastBody>
-                //     </Toast>,
-                //     { intent: "success" }
-                // );
+                showToast(`Team uploaded. ${defaultTeam.name} remains your default team.`, "success");
+
             }
         } catch (error) {
             console.error('Error refreshing teams after upload:', error);
         }
-    }, [dispatchToast]);
+    }, [showToast]);
 
 
     return (