Files
gott/wwwroot/js/commands-ui.js
T
Meleki e79a69a364 Custom Commands für Agents: gleiche Befehls-UI wie Sessions, im Chat werden Agent- und Session-Commands zusammengeführt
Backend:
- AgentRecord um CustomCommands-Feld erweitert
- DB-Migration: custom_commands Spalte für agents Tabelle
- Agent-CRUD (Create/Update) verarbeitet customCommands

Frontend:
- commands-ui.js: Shared Utility (createCommandRow, getCommandsFromUI, loadCommandsIntoUI) für Agent- und Session-Page
- Agent-Page: Benutzerdefinierte Befehle Sektion mit Typ-Dropdown
- Chat-Page: Lädt Agent-Commands + Session-Commands, zeigt beide mit Labels wenn beide vorhanden
- Session-Page: Refactored auf shared commands-ui.js Funktionen
- CSS: cmd-bar-label Styling für Agent:/Session: Trennung in der Command-Bar
2026-02-28 21:35:34 +01:00

59 lines
2.4 KiB
JavaScript

// ── Custom Commands UI (shared between session-page and agent-page) ──
function createCommandRow(container, name, command, type) {
name = name || '';
command = command || '';
type = type || 'background';
const item = document.createElement('div');
item.className = 'custom-command-item';
item.innerHTML = `
<div class="custom-command-fields">
<select class="cmd-type">
<option value="background">Hintergrund</option>
<option value="foreground">Vordergrund</option>
<option value="message">Nachricht</option>
</select>
<input type="text" class="cmd-name" placeholder="Name (z.B. Deploy)" value="${_escCmdAttr(name)}">
<input type="text" class="cmd-command" placeholder="${type === 'message' ? 'Nachricht...' : 'Befehl (z.B. ./deploy.sh)'}" value="${_escCmdAttr(command)}">
</div>
<button type="button" class="remove-cmd-btn icon-btn"><i class="fa fa-times"></i></button>
`;
var typeSelect = item.querySelector('.cmd-type');
typeSelect.value = type;
typeSelect.addEventListener('change', function() {
var cmdInput = item.querySelector('.cmd-command');
cmdInput.placeholder = typeSelect.value === 'message' ? 'Nachricht...' : 'Befehl (z.B. ./deploy.sh)';
});
item.querySelector('.remove-cmd-btn').addEventListener('click', function() { item.remove(); });
container.appendChild(item);
}
function getCommandsFromUI(container) {
var items = container.querySelectorAll('.custom-command-item');
var commands = [];
for (var i = 0; i < items.length; i++) {
var item = items[i];
var name = item.querySelector('.cmd-name').value.trim();
var command = item.querySelector('.cmd-command').value.trim();
var type = item.querySelector('.cmd-type').value;
if (name || command) commands.push({ name: name, command: command, type: type });
}
return commands.length > 0 ? commands : null;
}
function loadCommandsIntoUI(container, customCommands) {
if (!customCommands) return;
try {
var cmds = typeof customCommands === 'string' ? JSON.parse(customCommands) : customCommands;
for (var i = 0; i < cmds.length; i++) {
var cmd = cmds[i];
createCommandRow(container, cmd.name || '', cmd.command || '', cmd.type || 'background');
}
} catch (e) { /* ignore parse errors */ }
}
function _escCmdAttr(str) {
return str.replace(/&/g, '&amp;').replace(/"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
}