gateway/backend/webparts/part-agents.js

(function() {
    // DOM-Elemente
    let addAgentBtn, agentsListContainer;

    // Initialisierungsfunktion für das Agenten-Modul
    function initAgentsModule(globalState) {
        // DOM-Elemente referenzieren
        addAgentBtn = document.getElementById('add-agent-btn');
        agentsListContainer = document.getElementById('agents-list-container');

        // Event-Listener hinzufügen
        setupEventListeners(globalState);

        // Initialdaten rendern
        renderMyAgents(globalState);
    }

    // Event-Listener einrichten
    function setupEventListeners(globalState) {
        // Neuen Agenten hinzufügen
        addAgentBtn.addEventListener('click', () => {
            openAgentCreationModal(globalState);
        });
    }

    // Modal zum Erstellen eines neuen Agenten öffnen
    function openAgentCreationModal(globalState) {
        // Einfaches Prompt als Platzhalter - in einer realen Anwendung würde dies 
        // durch ein ansprechendes Modal oder Formular ersetzt
        const agentName = prompt('Name des neuen Agenten:');
        const agentType = prompt('Typ des Agenten (z.B. Analyse, Transformation):');
        const agentDescription = prompt('Beschreibung des Agenten:');

        if (agentName && agentType) {
            const newAgent = {
                id: `agent_${Date.now()}`,
                name: agentName,
                type: agentType,
                description: agentDescription || '',
                workspace_id: globalState.currentWorkspace?.id,
                capabilities: []
            };

            // Agent zur globalen Liste hinzufügen
            globalState.availableAgents.push(newAgent);

            // UI aktualisieren
            renderMyAgents(globalState);

            // Optional: Agent speichern
            saveAgent(newAgent, globalState);
        }
    }

    // Meine Agenten rendern
    function renderMyAgents(globalState) {
        console.info() 
        if (!agentsListContainer) {
            console.error("No agents container")
            return;
        }
        
        agentsListContainer.innerHTML = '';
        
        // Agenten für den aktuellen Workspace filtern
        const workspaceAgents = globalState.availableAgents.filter(
            agent => agent.workspace_id === globalState.currentWorkspace.id
        );
        // console.info("debug: agentid-wsid: "+ (globalState.availableAgents[0].workspace_id) + " - " + globalState.currentWorkspace.id + ", wsAgents: " + workspaceAgents.length)

        if (workspaceAgents.length === 0) {
            agentsListContainer.innerHTML = '<div class="empty-state">Keine Agenten vorhanden.</div>';
            return;
        }
        
        workspaceAgents.forEach(agent => {
            const agentItem = document.createElement('div');
            agentItem.className = 'agent-list-item';
            agentItem.innerHTML = `
                <div class="agent-header">
                    <h4>${agent.name}</h4>
                    <span class="agent-type">${agent.type}</span>
                </div>
                <div class="agent-description">${agent.description || ''}</div>
                <div class="agent-capabilities">
                    ${agent.capabilities ? agent.capabilities.map(cap => 
                        `<span class="capability-tag">${cap}</span>`
                    ).join('') : ''}
                </div>
                <div class="agent-actions">
                    <button class="edit-agent-btn" data-id="${agent.id}">
                        <i class="fas fa-edit"></i> Bearbeiten
                    </button>
                    <button class="delete-agent-btn" data-id="${agent.id}">
                        <i class="fas fa-trash"></i> Löschen
                    </button>
                </div>
            `;
            agentsListContainer.appendChild(agentItem);
        });
        
        // Event-Listener für Agenten-Aktionen einrichten
        setupAgentActionListeners(globalState);
    }

    // Event-Listener für Agenten-Aktionen
    function setupAgentActionListeners(globalState) {
        // Bearbeiten-Button
        document.querySelectorAll('.edit-agent-btn').forEach(btn => {
            btn.addEventListener('click', () => {
                const agentId = btn.getAttribute('data-id');
                const agent = globalState.availableAgents.find(a => a.id === agentId);
                
                if (agent) {
                    editAgent(agent, globalState);
                }
            });
        });
        
        // Löschen-Button
        document.querySelectorAll('.delete-agent-btn').forEach(btn => {
            btn.addEventListener('click', () => {
                const agentId = btn.getAttribute('data-id');
                
                if (confirm('Möchten Sie diesen Agenten wirklich löschen?')) {
                    deleteAgent(agentId, globalState);
                }
            });
        });
    }

    // Agent bearbeiten
    function editAgent(agent, globalState) {
        // Einfaches Prompt als Platzhalter - in einer realen Anwendung würde dies 
        // durch ein ansprechendes Modal oder Formular ersetzt
        const newName = prompt('Name des Agenten:', agent.name);
        const newType = prompt('Typ des Agenten:', agent.type);
        const newDescription = prompt('Beschreibung des Agenten:', agent.description);

        if (newName) {
            // Agent aktualisieren
            agent.name = newName;
            agent.type = newType || agent.type;
            agent.description = newDescription || agent.description;

            // UI aktualisieren
            renderMyAgents(globalState);

            // Optional: Aktualisierung auf dem Server
            updateAgent(agent);
        }
    }

    // Agent speichern
    async function saveAgent(agentData, globalState) {
        try {
            // Agent auf dem Server speichern
            const response = await window.globalUtils.postData('/api/agents/save', agentData);
            
            // Rückmeldung vom Server verarbeiten
            if (response && response.id) {
                // Wenn der Server eine ID zurückgibt, diese aktualisieren
                const index = globalState.availableAgents.findIndex(a => a.id === agentData.id);
                if (index !== -1) {
                    globalState.availableAgents[index].id = response.id;
                }
                
                // UI aktualisieren
                renderMyAgents(globalState);
            }
        } catch (error) {
            console.error("Fehler beim Speichern des Agenten:", error);
        }
    }

    // Agent aktualisieren
    async function updateAgent(agent) {
        try {
            // Agent auf dem Server aktualisieren
            await window.globalUtils.postData('/api/agents/update', agent);
        } catch (error) {
            console.error("Fehler beim Aktualisieren des Agenten:", error);
        }
    }

    // Agent löschen
    async function deleteAgent(agentId, globalState) {
        try {
            // Aus dem globalen State entfernen
            globalState.availableAgents = globalState.availableAgents.filter(a => a.id !== agentId);
            
            // UI aktualisieren
            renderMyAgents(globalState);
            
            // Agent vom Server löschen
            await window.globalUtils.postData('/api/agents/delete', { id: agentId });
        } catch (error) {
            console.error("Fehler beim Löschen des Agenten:", error);
        }
    }

    // Modul-Initialisierung exportieren
    window.initAgentsModule = initAgentsModule;
})();