Merge branch 'macae-v3-dev-marktayl' into macae-v3-dev-mt-fr-2

Author: Fr4nc3

data/agent_teams/hr.json

@@ -43,7 +43,7 @@
       "input_key": "",
       "type": "",
       "name": "ProxyAgent",
-      "deployment_name": "",
+      "deployment_name": "gpt-4.1",
       "icon": "",
       "system_message": "",
       "description": "",

src/frontend/src/api/config.tsx

@@ -130,6 +130,52 @@ export function headerBuilder(headers?: Record<string, string>): Record<string,
         ...(headers ? headers : {})
     };
 }
+
+/**
+ * Initialize team on the backend - takes about 20 seconds
+ * @returns Promise with team initialization response
+ */
+export async function initializeTeam(): Promise<{
+    status: string;
+    team_id: string;
+}> {
+    const apiUrl = getApiUrl();
+    if (!apiUrl) {
+        throw new Error('API URL not configured');
+    }
+
+    const headers = headerBuilder({
+        'Content-Type': 'application/json',
+    });
+
+    console.log('initializeTeam: Starting team initialization...');
+    
+    try {
+        const response = await fetch(`${apiUrl}/init_team`, {
+            method: 'GET',
+            headers,
+        });
+
+        if (!response.ok) {
+            const errorText = await response.text();
+            throw new Error(errorText || `HTTP error! status: ${response.status}`);
+        }
+
+        const data = await response.json();
+        console.log('initializeTeam: Team initialization completed:', data);
+        
+        // Validate the expected response format
+        if (data.status !== 'Request started successfully' || !data.team_id) {
+            throw new Error('Invalid response format from init_team endpoint');
+        }
+        
+        return data;
+    } catch (error) {
+        console.error('initializeTeam: Error initializing team:', error);
+        throw error;
+    }
+}
+
 export const toBoolean = (value: any): boolean => {
     if (typeof value !== 'string') {
         return false;
@@ -145,5 +191,6 @@ export default {
     setEnvData,
     config,
     USER_ID,
-    API_URL
+    API_URL,
+    initializeTeam 
 };

src/frontend/src/components/common/SettingsButton.tsx

@@ -41,6 +41,8 @@ import {
 import { TeamConfig } from '../../models/Team';
 import { TeamService } from '../../services/TeamService';
 
+import '../../index.css'
+
 // Icon mapping function to convert string icons to FluentUI icons
 const getIconFromString = (iconString: string): React.ReactNode => {
   const iconMap: Record<string, React.ReactNode> = {
@@ -514,7 +516,7 @@ const SettingsButton: React.FC<SettingsButtonProps> = ({
                 appearance="subtle"
                 size="small"
                 onClick={(e) => handleDeleteTeam(team, e)}
-                style={{ color: '#d13438' }}
+                className="delete-team-button"
               />
             </Tooltip>
           </div>
@@ -751,16 +753,8 @@ const SettingsButton: React.FC<SettingsButtonProps> = ({
     {/* Delete Confirmation Dialog */}
     <Dialog open={deleteConfirmOpen} onOpenChange={(event, data) => setDeleteConfirmOpen(data.open)}>
       <DialogSurface>
-        <DialogContent style={{ 
-          display: 'flex',
-          flexDirection: 'column',
-          width: '100%'
-        }}>
-          <DialogBody style={{ 
-            display: 'flex',
-            flexDirection: 'column',
-            width: '100%'
-          }}>
+        <DialogContent data-testid="delete-dialog">
+          <DialogBody>
             <DialogTitle>⚠️ Delete Team Configuration</DialogTitle>
             <div style={{ marginTop: '16px', marginBottom: '20px' }}>
               <Text style={{ display: 'block', marginBottom: '16px' }}>
@@ -802,6 +796,7 @@ const SettingsButton: React.FC<SettingsButtonProps> = ({
               disabled={deleteLoading}
               style={{ backgroundColor: '#d13438', color: 'white' }}
               onClick={confirmDeleteTeam}
+               data-testid="delete-team-confirm"
             >
               {deleteLoading ? 'Deleting...' : 'Delete for Everyone'}
             </Button>