frontend/src/composables/useApi.ts

/**
 * SAAP API Composable - Backend Integration
 * Centralized API service for SAAP FastAPI Backend
 */

import { ref, reactive } from 'vue'
import axios, { type AxiosResponse, type AxiosError } from 'axios'

// Types
interface SaapAgent {
  id: string
  name: string
  type: 'coordinator' | 'developer' | 'specialist' | 'analyst'
  color?: string
  avatar?: string
  description: string
  status: 'active' | 'inactive' | 'starting' | 'error'
  capabilities?: string[]
  personality?: {
    system_prompt?: string
    communication_style?: string
  }
  llm_config?: {
    model?: string
    temperature?: number
    max_tokens?: number
  }
  metrics?: {
    messages_processed?: number
    average_response_time?: number
    last_active?: string
    uptime?: string
    error_rate?: number
  }
  created_at?: string
  updated_at?: string
  tags?: string[]
}

interface ChatMessage {
  agent_id: string
  agent_name?: string
  user_message: string
  agent_response: string
  response_time?: number
  timestamp: string
  model?: string
}

interface SystemStatus {
  system: string
  status: string
  agents: {
    total: number
    active: number
    inactive: number
  }
  active_agents: Array<{
    id: string
    name: string
    type: string
  }>
  timestamp: string
}

// API Configuration
const API_BASE_URL = 'http://localhost:8000'

const api = axios.create({
  baseURL: API_BASE_URL,
  timeout: 30000,
  headers: {
    'Content-Type': 'application/json',
  },
})

// Request/Response interceptors
api.interceptors.request.use(
  (config) => {
    console.log(`🌐 API Request: ${config.method?.toUpperCase()} ${config.url}`)
    return config
  },
  (error) => {
    console.error('🔥 API Request Error:', error)
    return Promise.reject(error)
  }
)

api.interceptors.response.use(
  (response) => {
    console.log(`✅ API Response: ${response.config.url} (${response.status})`)
    return response
  },
  (error: AxiosError) => {
    console.error(`❌ API Error: ${error.config?.url}`, error.response?.data)
    return Promise.reject(error)
  }
)

export const useApi = () => {
  const loading = ref(false)
  const error = ref<string | null>(null)
  
  // Helper function to handle API calls
  const handleApiCall = async <T>(
    apiCall: () => Promise<AxiosResponse<T>>,
    loadingState: boolean = true
  ): Promise<T | null> => {
    try {
      if (loadingState) loading.value = true
      error.value = null
      
      const response = await apiCall()
      return response.data
    } catch (err: any) {
      const errorMessage = err.response?.data?.detail || err.message || 'API Error'
      error.value = errorMessage
      console.error('API Error:', errorMessage)
      return null
    } finally {
      if (loadingState) loading.value = false
    }
  }

  // =====================================================
  // SYSTEM STATUS API
  // =====================================================
  
  const getSystemStatus = async (): Promise<SystemStatus | null> => {
    return handleApiCall(async () => {
      return await api.get<SystemStatus>('/api/v1/health')
    })
  }

  const getRootStatus = async () => {
    return handleApiCall(async () => {
      return await api.get('/')
    })
  }

  // =====================================================
  // AGENT MANAGEMENT API
  // =====================================================
  
  const getAgents = async (): Promise<SaapAgent[] | null> => {
    return handleApiCall(async () => {
      return await api.get<SaapAgent[]>('/api/v1/agents')
    })
  }

  const getAgent = async (agentId: string): Promise<SaapAgent | null> => {
    return handleApiCall(async () => {
      return await api.get<SaapAgent>(`/api/v1/agents/${agentId}`)
    })
  }

  const createAgent = async (agentData: Partial<SaapAgent>): Promise<any> => {
    return handleApiCall(async () => {
      return await api.post('/api/v1/agents', agentData)
    })
  }

  const updateAgent = async (agentId: string, agentData: Partial<SaapAgent>): Promise<any> => {
    return handleApiCall(async () => {
      return await api.put(`/api/v1/agents/${agentId}`, agentData)
    })
  }

  const deleteAgent = async (agentId: string): Promise<any> => {
    return handleApiCall(async () => {
      return await api.delete(`/api/v1/agents/${agentId}`)
    })
  }

  // =====================================================
  // AGENT LIFECYCLE API
  // =====================================================
  
  const startAgent = async (agentId: string): Promise<any> => {
    return handleApiCall(async () => {
      return await api.post(`/api/v1/agents/${agentId}/start`)
    })
  }

  const stopAgent = async (agentId: string): Promise<any> => {
    return handleApiCall(async () => {
      return await api.post(`/api/v1/agents/${agentId}/stop`)
    })
  }

  // =====================================================
  // AGENT COMMUNICATION API
  // =====================================================
  
  const chatWithAgent = async (agentId: string, message: string): Promise<ChatMessage | null> => {
    return handleApiCall(async () => {
      return await api.post<ChatMessage>(`/api/v1/agents/${agentId}/chat`, {
        message: message
      })
    })
  }

  // =====================================================
  // AGENT TEMPLATES API
  // =====================================================
  
  const getAgentTemplates = async (): Promise<any> => {
    return handleApiCall(async () => {
      return await api.get('/api/v1/templates/agents')
    })
  }

  const createAgentFromTemplate = async (templateName: string): Promise<any> => {
    return handleApiCall(async () => {
      return await api.post(`/api/v1/templates/agents/${templateName}`)
    })
  }

  // =====================================================
  // HEALTH & TESTING
  // =====================================================
  
  const testConnection = async (): Promise<boolean> => {
    try {
      loading.value = true
      const response = await api.get('/api/v1/health', { timeout: 5000 })
      return response.status === 200
    } catch (err) {
      console.error('❌ Backend connection failed:', err)
      return false
    } finally {
      loading.value = false
    }
  }

  return {
    // State
    loading,
    error,
    
    // System
    getSystemStatus,
    getRootStatus,
    testConnection,
    
    // Agent Management
    getAgents,
    getAgent,
    createAgent,
    updateAgent,
    deleteAgent,
    
    // Agent Lifecycle
    startAgent,
    stopAgent,
    
    // Communication
    chatWithAgent,
    
    // Templates
    getAgentTemplates,
    createAgentFromTemplate,
    
    // Configuration
    API_BASE_URL,
  }
}

// Export types for use in components
export type { SaapAgent, ChatMessage, SystemStatus }