+ ${count || memories.length} memor${count === 1 ? 'y' : 'ies'}
+
+
+
+
+ ${memories.length === 0 && html`
No memories stored.
`}
+ ${memories.map(m => html`
+
+ ${editingId === m.id ? html`
+ ';
-
- mount.innerHTML = html;
-
- // Wire buttons
- document.getElementById('taskNewBtn').addEventListener('click', function() { showCreateForm(); });
- mount.querySelectorAll('.task-run-btn').forEach(function(btn) {
- btn.addEventListener('click', function() { runTask(btn.dataset.id); });
- });
- mount.querySelectorAll('.task-toggle-btn').forEach(function(btn) {
- btn.addEventListener('click', function() { toggleTask(btn.dataset.id, btn.dataset.active === 'true'); });
- });
- mount.querySelectorAll('.task-del-btn').forEach(function(btn) {
- btn.addEventListener('click', function() { deleteTask(btn.dataset.id); });
- });
- mount.querySelectorAll('.task-trigger-btn').forEach(function(btn) {
- btn.addEventListener('click', function() {
- var url = location.origin + (window.__BASE__ || '') + '/api/v1/hooks/t/' + btn.dataset.token;
- navigator.clipboard.writeText(url).then(function() {
- UI.toast('Trigger URL copied', 'success');
- }).catch(function() {
- prompt('Trigger URL:', url);
- });
- });
- });
- } catch (err) {
- mount.innerHTML = '
- ${u.role}
- ${statusLabel}
- ${teams}
- ${lastSeen}
-
- ${isPending
- ? ``
- : ``
- }
-
-
-
-
- `;
- }).join('');
-
- el.innerHTML = `
-
-
- `;
-
- // Approve form placeholder (injected per-user when needed)
- } catch (e) { el.innerHTML = `
-
-
-
-
- `;
- }
-
- // Provider health cards
- let html = '';
- if (providers.length > 0) {
- html += '
-
-
- `;
-
- // Bar chart — aggregate by day label
- if (chartEl && buckets.length > 0) {
- const dayMap = {};
- buckets.forEach(b => {
- const d = new Date(b.window_start || b.date || b.bucket);
- const label = d.toLocaleDateString('en', { weekday: 'short' });
- dayMap[label] = (dayMap[label] || 0) + (b.request_count || 0);
- });
- const days = Object.entries(dayMap);
- const maxVal = Math.max(...days.map(d => d[1]), 1);
- chartEl.innerHTML = `
-
-
`;
- }
- } catch (e) { pricingEl.innerHTML = `
-
- `;
- } catch (e) {
- el.innerHTML = '
-
`;
- }
-
- // Pagination
- const pgEl = document.getElementById('auditPagination');
- if (totalPages > 1) {
- pgEl.style.display = 'flex';
- document.getElementById('auditPageInfo').textContent = `Page ${UI._auditPage} of ${totalPages} (${total} entries)`;
- document.getElementById('auditPrevBtn').disabled = UI._auditPage <= 1;
- document.getElementById('auditNextBtn').disabled = UI._auditPage >= totalPages;
- } else {
- pgEl.style.display = 'none';
- }
- } catch (e) { el.innerHTML = `
-
- `;
- } catch (e) { el.innerHTML = `
-
- `;
- } catch (e) { el.innerHTML = `
-
- `;
- } catch (e) { el.innerHTML = `
-
- `;
- } catch (e) { el.innerHTML = `
-
- `;
- } catch (e) { el.innerHTML = `
-
- `;
- } catch (e) { el.innerHTML = `
-
-
- `;
- }
-
- // Table
- const rows = providers.map(p => {
- const name = esc(p.provider_name || p.provider_config_id?.slice(0, 8) || '—');
- const statusCls = p.status === 'healthy' ? 'badge-healthy' : p.status === 'degraded' ? 'badge-degraded' : p.status === 'down' || p.status === 'unhealthy' ? 'badge-unhealthy' : 'badge-unknown';
- const latency = p.avg_latency_ms != null ? p.avg_latency_ms + 'ms' : '—';
- const errorRate = p.error_rate != null ? (100 - p.error_rate * 100).toFixed(1) + '%' : '—';
- const reqs = p.request_count ?? 0;
- const errCount = (p.error_count || 0) + (p.timeout_count || 0);
- const lastErr = p.last_error ? `` : '—';
-
- return `
- ${name}
- ${esc(p.status || 'unknown')}
- ${latency}
- ${errorRate}
- ${reqs}
- ${errCount}
- ${lastErr}
- `;
- }).join('');
-
- el.innerHTML = `
-
-
`;
- } catch (e) {
- el.innerHTML = `
-
- `;
- } catch (e) {
- listEl.innerHTML = `
-
`;
- } catch (e) {
- el.innerHTML = `
';
- list.innerHTML = html;
- } catch (e) {
- list.innerHTML = `
-
- `;
- } catch (e) { el.innerHTML = `
-
`;
- } catch (e) { el.innerHTML = `
` : '';
- return `
';
- list.innerHTML = html;
- } catch (e) {
- list.innerHTML = '
';
- list.innerHTML = html;
- } catch (e) {
- list.innerHTML = '
+
+
+
+
+
+
+
+ `;
+ }
+
+ return html`
+
+
+ `;
+}
diff --git a/src/js/sw/surfaces/team-admin/providers.js b/src/js/sw/surfaces/team-admin/providers.js
new file mode 100644
index 0000000..cc1279d
--- /dev/null
+++ b/src/js/sw/surfaces/team-admin/providers.js
@@ -0,0 +1,123 @@
+/**
+ * Team Admin > Providers
+ */
+const { html } = window;
+const { useState, useEffect, useCallback } = hooks;
+
+export default function ProvidersSection({ teamId }) {
+ const [configs, setConfigs] = useState([]);
+ const [providerTypes, setProviderTypes] = useState([]);
+ const [loading, setLoading] = useState(true);
+ const [editing, setEditing] = useState(null); // null | 'new' | config object
+
+ const load = useCallback(async () => {
+ try {
+ const [c, t] = await Promise.all([
+ sw.api.teams.providers(teamId),
+ sw.api.admin.providers.types().catch(() => ({ types: [] })),
+ ]);
+ setConfigs(Array.isArray(c) ? c : c.data || []);
+ setProviderTypes(t.types || t.data || []);
+ } catch (e) { sw.toast(e.message, 'error'); }
+ finally { setLoading(false); }
+ }, [teamId]);
+
+ useEffect(() => { load(); }, [load]);
+
+ async function saveProvider(e) {
+ e.preventDefault();
+ const form = e.target;
+ const data = {
+ name: form.pname.value.trim(),
+ provider: form.provider.value,
+ endpoint: form.endpoint.value.trim(),
+ api_key: form.api_key.value || undefined,
+ };
+ try {
+ if (editing === 'new') {
+ await sw.api.teams.createProvider(teamId, data);
+ sw.toast('Provider created', 'success');
+ } else {
+ await sw.api.teams.updateProvider(teamId, editing.id, data);
+ sw.toast('Provider updated', 'success');
+ }
+ setEditing(null);
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function syncModels(pid) {
+ try {
+ const result = await sw.api.teams.providerModels(teamId, pid);
+ sw.toast(`Models synced: ${result.added || result.count || 0}`, 'success');
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function deleteProvider(pid) {
+ const ok = await sw.confirm('Delete this provider config?', true);
+ if (!ok) return;
+ try {
+ await sw.api.teams.deleteProvider(teamId, pid);
+ sw.toast('Provider deleted', 'success');
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ if (loading) return html`
+
+
+
+
+
+ ${personas.length === 0 && html`
+ No personas
`}
+ ${personas.map(p => html`
+
+
+ `)}
+
+ ${p.name}
+ ${p.description && html`${p.description.substring(0, 60)}${p.description.length > 60 ? '\u2026' : ''}`}
+
+ ${p.kb_count || 0} KBs
+
+
+
+
+ Loading\u2026
`;
+
+ return html`
+
+
+ `;
+}
diff --git a/src/js/sw/surfaces/team-admin/settings.js b/src/js/sw/surfaces/team-admin/settings.js
new file mode 100644
index 0000000..be9a1a5
--- /dev/null
+++ b/src/js/sw/surfaces/team-admin/settings.js
@@ -0,0 +1,72 @@
+/**
+ * Team Admin > Settings
+ */
+const { html } = window;
+const { useState, useEffect, useCallback } = hooks;
+
+export default function SettingsSection({ teamId }) {
+ const [team, setTeam] = useState(null);
+ const [name, setName] = useState('');
+ const [description, setDescription] = useState('');
+ const [loading, setLoading] = useState(true);
+ const [saving, setSaving] = useState(false);
+
+ const load = useCallback(async () => {
+ try {
+ const data = await sw.api.teams.get(teamId);
+ setTeam(data);
+ setName(data.name || '');
+ setDescription(data.description || '');
+ } catch (e) { sw.toast(e.message, 'error'); }
+ finally { setLoading(false); }
+ }, [teamId]);
+
+ useEffect(() => { load(); }, [load]);
+
+ async function save() {
+ setSaving(true);
+ try {
+ await sw.api.teams.update(teamId, {
+ name: name.trim(),
+ description: description.trim(),
+ });
+ sw.toast('Settings saved', 'success');
+ } catch (e) { sw.toast(e.message, 'error'); }
+ finally { setSaving(false); }
+ }
+
+ if (loading) return html`
+
+
+
+
+ ${editing && html`
+
+ `}
+
+
+ ${configs.length === 0 && html`
+ No provider configs
`}
+ ${configs.map(c => html`
+
+
+ `)}
+
+ ${c.name}
+ ${c.provider}
+ ${c.has_key ? html`key set` : html`no key`}
+
+ ${c.endpoint || '(default)'}
+
+
+
+
+
+ Loading\u2026
`;
+
+ return html`
+
+
+ `;
+}
diff --git a/src/js/sw/surfaces/team-admin/tasks.js b/src/js/sw/surfaces/team-admin/tasks.js
new file mode 100644
index 0000000..eb9d794
--- /dev/null
+++ b/src/js/sw/surfaces/team-admin/tasks.js
@@ -0,0 +1,111 @@
+/**
+ * Team Admin > Tasks
+ */
+const { html } = window;
+const { useState, useEffect, useCallback } = hooks;
+
+export default function TasksSection({ teamId }) {
+ const [tasks, setTasks] = useState([]);
+ const [loading, setLoading] = useState(true);
+ const [showCreate, setShowCreate] = useState(false);
+
+ const load = useCallback(async () => {
+ try {
+ const data = await sw.api.teams.tasks(teamId);
+ setTasks(Array.isArray(data) ? data : data.data || []);
+ } catch (e) { sw.toast(e.message, 'error'); }
+ finally { setLoading(false); }
+ }, [teamId]);
+
+ useEffect(() => { load(); }, [load]);
+
+ async function createTask(e) {
+ e.preventDefault();
+ const form = e.target;
+ try {
+ await sw.api.teams.createTask(teamId, {
+ name: form.name.value.trim(),
+ schedule: form.schedule.value.trim(),
+ description: form.description.value.trim(),
+ });
+ sw.toast('Task created', 'success');
+ setShowCreate(false);
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function runTask(id) {
+ try {
+ await sw.api.teams.runTask(teamId, id);
+ sw.toast('Task triggered', 'success');
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function killTask(id) {
+ try {
+ await sw.api.teams.killTask(teamId, id);
+ sw.toast('Task cancelled', 'success');
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function deleteTask(id) {
+ const ok = await sw.confirm('Delete this task?', true);
+ if (!ok) return;
+ try {
+ await sw.api.teams.deleteTask(teamId, id);
+ sw.toast('Task deleted', 'success');
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ function fmtDate(d) {
+ if (!d) return '\u2014';
+ return new Date(d).toLocaleString(undefined, { dateStyle: 'short', timeStyle: 'short' });
+ }
+
+ if (loading) return html`
+
+
+ ${team && html`
+ Team Details
+
+
+ setName(e.target.value)} placeholder="My Team" />
+
+
+
+
+
+
+
+ `}
+
+ Info
+
+
+ ID: ${team.id}
+ ${team.created_at && html`Created: ${new Date(team.created_at).toLocaleString()}
`}
+ ${team.member_count != null && html`Members: ${team.member_count}
`}
+
+
+
+ Loading\u2026
`;
+
+ return html`
+
+
+ `;
+}
diff --git a/src/js/sw/surfaces/team-admin/usage.js b/src/js/sw/surfaces/team-admin/usage.js
new file mode 100644
index 0000000..522cd1c
--- /dev/null
+++ b/src/js/sw/surfaces/team-admin/usage.js
@@ -0,0 +1,57 @@
+/**
+ * Team Admin > Usage
+ */
+const { html } = window;
+const { useState, useEffect, useCallback } = hooks;
+
+export default function UsageSection({ teamId }) {
+ const [usage, setUsage] = useState(null);
+ const [loading, setLoading] = useState(true);
+
+ const load = useCallback(async () => {
+ try {
+ const data = await sw.api.teams.usage(teamId);
+ setUsage(data);
+ } catch (e) { sw.toast(e.message, 'error'); }
+ finally { setLoading(false); }
+ }, [teamId]);
+
+ useEffect(() => { load(); }, [load]);
+
+ function fmtNum(n) {
+ if (n == null) return '\u2014';
+ return n.toLocaleString();
+ }
+
+ if (loading) return html`
+
+
+
+
+ ${showCreate && html`
+
+ `}
+
+
+ ${tasks.length === 0 && html`
+ No tasks
`}
+ ${tasks.map(t => html`
+
+
+ `)}
+
+ ${t.name}
+ ${t.schedule && html`${t.schedule}`}
+
+
+ last: ${fmtDate(t.last_run_at)} \u2022 next: ${fmtDate(t.next_run_at)}
+
+ ${t.is_active ? 'active' : 'paused'}
+
+
+
+
+
+ Loading\u2026
`;
+
+ return html`
+
+ ${usage?.totals && html`
+
+ `;
+}
diff --git a/src/js/sw/surfaces/team-admin/workflows.js b/src/js/sw/surfaces/team-admin/workflows.js
new file mode 100644
index 0000000..cfd7945
--- /dev/null
+++ b/src/js/sw/surfaces/team-admin/workflows.js
@@ -0,0 +1,171 @@
+/**
+ * Team Admin > Workflows
+ */
+const { html } = window;
+const { useState, useEffect, useCallback } = hooks;
+
+const ENTRY_MODES = ['public_link', 'team_only'];
+
+export default function WorkflowsSection({ teamId }) {
+ const [workflows, setWorkflows] = useState([]);
+ const [loading, setLoading] = useState(true);
+ const [editing, setEditing] = useState(null); // null | 'new' | workflow
+ const [stages, setStages] = useState([]);
+ const [showCreate, setShowCreate] = useState(false);
+
+ const load = useCallback(async () => {
+ try {
+ const data = await sw.api.teams.workflows(teamId);
+ setWorkflows(Array.isArray(data) ? data : data.data || []);
+ } catch (e) { sw.toast(e.message, 'error'); }
+ finally { setLoading(false); }
+ }, [teamId]);
+
+ useEffect(() => { load(); }, [load]);
+
+ async function openEdit(wf) {
+ setEditing(wf);
+ try {
+ const detail = await sw.api.teams.workflows(teamId);
+ const match = (Array.isArray(detail) ? detail : detail.data || []).find(w => w.id === wf.id);
+ setStages(match?.stages || wf.stages || []);
+ } catch (e) { sw.toast(e.message, 'error'); setStages([]); }
+ }
+
+ async function createWorkflow(e) {
+ e.preventDefault();
+ const form = e.target;
+ try {
+ await sw.api.teams.createWorkflow(teamId, {
+ name: form.name.value.trim(),
+ slug: form.slug.value.trim(),
+ entry_mode: form.entry_mode.value,
+ description: form.description.value.trim(),
+ });
+ sw.toast('Workflow created', 'success');
+ setShowCreate(false);
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function updateWorkflow(e) {
+ e.preventDefault();
+ const form = e.target;
+ try {
+ await sw.api.teams.updateWorkflow(teamId, editing.id, {
+ name: form.name.value.trim(),
+ description: form.description.value.trim(),
+ entry_mode: form.entry_mode.value,
+ is_active: form.is_active.checked,
+ });
+ sw.toast('Workflow updated', 'success');
+ setEditing(null);
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function publishWorkflow(wfId) {
+ try {
+ await sw.api.teams.publishWorkflow(teamId, wfId);
+ sw.toast('Workflow published', 'success');
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ async function deleteWorkflow(id) {
+ const ok = await sw.confirm('Delete this workflow? All stages, versions, and instances will be deleted.', true);
+ if (!ok) return;
+ try {
+ await sw.api.teams.deleteWorkflow(teamId, id);
+ sw.toast('Workflow deleted', 'success');
+ setEditing(null);
+ load();
+ } catch (e) { sw.toast(e.message, 'error'); }
+ }
+
+ if (loading) return html`
+
+
+
+
+ `}
+
+ ${usage?.results && usage.results.length > 0 && html`
+ ${fmtNum(usage.totals.total_tokens)}
Total Tokens
${fmtNum(usage.totals.total_requests)}
Total Requests
$${(usage.totals.total_cost || 0).toFixed(2)}
Total Cost
Usage by Day
+
+ ${usage.results.map((r, i) => html`
+
+ `}
+
+ ${(!usage?.totals && !usage?.results) && html`
+
+ ${r.date || r.day || '\u2014'}
+ ${fmtNum(r.tokens)} tokens
+ ${r.requests || 0} requests
+ $${(r.cost || 0).toFixed(2)}
+
+ `)}
+ No usage data available
+ `}
+ Loading\u2026
`;
+
+ if (editing) return html`
+
+ `;
+
+ return html`
+
+
+ `;
+}
diff --git a/src/js/task-admin.js b/src/js/task-admin.js
deleted file mode 100644
index d79dbfa..0000000
--- a/src/js/task-admin.js
+++ /dev/null
@@ -1,352 +0,0 @@
-// ==========================================
-// Chat Switchboard — Task Admin Panel
-// ==========================================
-// Admin section for managing scheduled tasks, run history, and global
-// task configuration. Registered as ADMIN_LOADERS.tasks in ui-admin.js.
-
-
- var SCAFFOLD_HTML =
- '
+
+
+
+
+ ${showCreate && html`
+
+ `}
+
+
+ ${workflows.length === 0 && html`
+ No workflows
`}
+ ${workflows.map(w => html`
+ openEdit(w)}>
+
+ `)}
+
+ ${w.name}
+ /${w.slug}
+
+ ${w.entry_mode}
+ ${w.is_active ? 'active' : 'inactive'}
+ v${w.version || 0}
+ ' +
- '' +
- '' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '' +
- '';
-
- function showTab(tab) {
- var el = function(id) { return document.getElementById(id); };
- el('taskListPane').style.display = tab === 'list' ? '' : 'none';
- el('taskConfigPane').style.display = tab === 'config' ? '' : 'none';
- el('taskRunPane').style.display = tab === 'runs' ? '' : 'none';
- el('taskSystemPane').style.display = tab === 'system' ? '' : 'none';
- el('taskTabList').className = 'btn-small' + (tab === 'list' ? ' btn-primary' : '');
- el('taskTabConfig').className = 'btn-small' + (tab === 'config' ? ' btn-primary' : '');
- el('taskTabSystem').className = 'btn-small' + (tab === 'system' ? ' btn-primary' : '');
- }
-
- function statusBadge(status) {
- var colors = {
- running: 'badge-info', completed: 'badge-success', failed: 'badge-danger',
- budget_exceeded: 'badge-warning', cancelled: 'badge-muted'
- };
- return '' + status + '';
- }
-
- function escapeHtml(s) {
- if (!s) return '';
- return s.replace(/&/g,'&').replace(//g,'>').replace(/"/g,'"');
- }
-
- async function loadTasks() {
- try {
- var resp = await API._get('/api/v1/admin/tasks');
- var tasks = resp.data || [];
- var list = document.getElementById('taskAdminList');
- document.getElementById('taskCount').textContent = tasks.length;
-
- if (!tasks.length) {
- list.innerHTML = '' +
- '
' +
- '' +
- 'Scheduled Tasks
' + - '0' + - 'No scheduled tasks
';
- return;
- }
-
- list.innerHTML = tasks.map(function(t) {
- var active = t.is_active
- ? 'active'
- : 'paused';
- var scope = '' + t.scope + '';
- var type = '' + t.task_type + '';
- var funcBadge = t.task_type === 'system' && t.system_function
- ? '' + escapeHtml(t.system_function) + '' : '';
- var schedule = t.schedule === 'once' ? 'One-shot' : t.schedule === 'webhook' ? 'Webhook trigger' : t.schedule;
- var nextRun = t.schedule === 'webhook' ? 'on trigger' : t.next_run_at ? new Date(t.next_run_at).toLocaleString() : '\u2014';
- var lastRun = t.last_run_at ? new Date(t.last_run_at).toLocaleString() : 'never';
- var triggerBtn = '';
- if (t.schedule === 'webhook' && t.trigger_token) {
- triggerBtn = '';
- }
-
- return '' +
- '
';
- }).join('');
-
- list.querySelectorAll('.task-run-btn').forEach(function(btn) {
- btn.addEventListener('click', function(e) { e.stopPropagation(); triggerRun(btn.dataset.id); });
- });
- list.querySelectorAll('.task-history-btn').forEach(function(btn) {
- btn.addEventListener('click', function(e) { e.stopPropagation(); showRuns(btn.dataset.id, btn.dataset.name); });
- });
- list.querySelectorAll('.task-delete-btn').forEach(function(btn) {
- btn.addEventListener('click', function(e) { e.stopPropagation(); deleteTask(btn.dataset.id); });
- });
- list.querySelectorAll('.task-trigger-btn').forEach(function(btn) {
- btn.addEventListener('click', function(e) {
- e.stopPropagation();
- var url = location.origin + (window.__BASE__ || '') + '/api/v1/hooks/t/' + btn.dataset.token;
- navigator.clipboard.writeText(url).then(function() {
- UI.toast('Trigger URL copied', 'success');
- }).catch(function() {
- prompt('Trigger URL:', url);
- });
- });
- });
- } catch (err) {
- console.error('[task-admin] Failed to load tasks:', err);
- }
- }
-
- async function triggerRun(taskId) {
- try {
- await API._post('/api/v1/admin/tasks/' + taskId + '/run', {});
- UI.toast('Task scheduled for immediate execution', 'success');
- } catch (err) {
- UI.toast(err.message || 'Failed to trigger run', 'error');
- }
- }
-
- async function deleteTask(taskId) {
- if (!confirm('Delete this task and all run history?')) return;
- try {
- await API._delete('/api/v1/admin/tasks/' + taskId);
- UI.toast('Task deleted', 'success');
- loadTasks();
- } catch (err) {
- UI.toast(err.message || 'Failed to delete task', 'error');
- }
- }
-
- var _currentTaskId = null;
-
- async function showRuns(taskId, taskName) {
- _currentTaskId = taskId;
- document.getElementById('taskRunTitle').textContent = 'Run History: ' + taskName;
- showTab('runs');
- try {
- var resp = await API._get('/api/v1/tasks/' + taskId + '/runs');
- var runs = resp.data || [];
- var list = document.getElementById('taskRunList');
-
- if (!runs.length) {
- list.innerHTML = '' +
- '
' +
- '' + escapeHtml(t.name) + '
' +
- '' +
- escapeHtml(schedule) + ' \u00b7 ' + t.run_count + ' runs \u00b7 last: ' + lastRun +
- '
' +
- '' + type + funcBadge + scope + active + '
' +
- 'next: ' + nextRun + '
' +
- '' +
- triggerBtn +
- '' +
- '' +
- '' +
- '
' +
- 'No runs yet
';
- return;
- }
-
- list.innerHTML = runs.map(function(r) {
- var started = new Date(r.started_at).toLocaleString();
- var completed = r.completed_at ? new Date(r.completed_at).toLocaleString() : '\u2014';
- var duration = r.wall_clock ? r.wall_clock + 's' : '\u2014';
- var errLine = r.error
- ? '' + escapeHtml(r.error) + '
'
- : '';
-
- return '' +
- '
';
- }).join('');
- } catch (err) {
- console.error('[task-admin] Failed to load runs:', err);
- }
- }
-
- async function killRun() {
- if (!_currentTaskId) return;
- try {
- await API._post('/api/v1/admin/tasks/' + _currentTaskId + '/kill', {});
- UI.toast('Active run cancelled', 'success');
- showRuns(_currentTaskId, document.getElementById('taskRunTitle').textContent.replace('Run History: ', ''));
- } catch (err) {
- UI.toast(err.message || 'Failed to kill run', 'error');
- }
- }
-
- async function loadConfig() {
- try {
- var resp = await API._get('/api/v1/admin/settings/tasks');
- var cfg = resp || {};
- document.getElementById('taskCfgEnabled').checked = cfg.enabled !== false;
- document.getElementById('taskCfgPersonal').checked = cfg.allow_personal !== false;
- document.getElementById('taskCfgRequireBYOK').checked = cfg.personal_require_byok === true;
- document.getElementById('taskCfgMaxConcurrent').value = cfg.max_concurrent || 5;
- document.getElementById('taskCfgMaxTokens').value = cfg.default_max_tokens || 4096;
- document.getElementById('taskCfgMaxToolCalls').value = cfg.default_max_tool_calls || 10;
- document.getElementById('taskCfgMaxWallClock').value = cfg.default_max_wall_clock || 300;
- } catch (_) {
- document.getElementById('taskCfgEnabled').checked = true;
- document.getElementById('taskCfgPersonal').checked = true;
- document.getElementById('taskCfgRequireBYOK').checked = false;
- document.getElementById('taskCfgMaxConcurrent').value = 5;
- document.getElementById('taskCfgMaxTokens').value = 4096;
- document.getElementById('taskCfgMaxToolCalls').value = 10;
- document.getElementById('taskCfgMaxWallClock').value = 300;
- }
- }
-
- async function saveConfig() {
- try {
- var payload = {
- enabled: document.getElementById('taskCfgEnabled').checked,
- allow_personal: document.getElementById('taskCfgPersonal').checked,
- personal_require_byok: document.getElementById('taskCfgRequireBYOK').checked,
- max_concurrent: parseInt(document.getElementById('taskCfgMaxConcurrent').value) || 5,
- default_max_tokens: parseInt(document.getElementById('taskCfgMaxTokens').value) || 4096,
- default_max_tool_calls: parseInt(document.getElementById('taskCfgMaxToolCalls').value) || 10,
- default_max_wall_clock: parseInt(document.getElementById('taskCfgMaxWallClock').value) || 300
- };
- await API._put('/api/v1/admin/settings/tasks', payload);
- UI.toast('Task configuration saved', 'success');
- } catch (err) {
- UI.toast(err.message || 'Failed to save config', 'error');
- }
- }
-
- // ── System functions ──────────────────────
- var _sysFuncs = [];
-
- async function loadSystemFuncs() {
- try {
- var resp = await API._get('/api/v1/admin/system-functions');
- _sysFuncs = resp.data || [];
- var sel = document.getElementById('sysTaskFunc');
- sel.innerHTML = '';
- _sysFuncs.forEach(function(f) {
- var opt = document.createElement('option');
- opt.value = f.name;
- opt.textContent = f.name;
- sel.appendChild(opt);
- });
- sel.addEventListener('change', function() {
- var desc = document.getElementById('sysTaskFuncDesc');
- var found = _sysFuncs.find(function(f) { return f.name === sel.value; });
- desc.textContent = found ? found.description : '';
- });
- } catch (err) {
- console.error('[task-admin] Failed to load system functions:', err);
- }
-
- // Wire create button
- document.getElementById('sysTaskCreateBtn').addEventListener('click', createSystemTask);
- }
-
- async function createSystemTask() {
- var name = document.getElementById('sysTaskName').value.trim();
- var func_ = document.getElementById('sysTaskFunc').value;
- var cron = document.getElementById('sysTaskCron').value.trim();
- var tz = document.getElementById('sysTaskTZ').value.trim() || 'UTC';
-
- if (!name) { UI.toast('Name is required', 'warning'); return; }
- if (!func_) { UI.toast('Select a system function', 'warning'); return; }
- if (!cron) { UI.toast('Schedule (cron) is required', 'warning'); return; }
-
- try {
- await API._post('/api/v1/tasks', {
- name: name,
- task_type: 'system',
- system_function: func_,
- schedule: cron,
- timezone: tz,
- scope: 'global',
- output_mode: 'channel',
- });
- UI.toast('System task created', 'success');
- showTab('list');
- loadTasks();
- } catch (err) {
- UI.toast(err.message || 'Failed to create system task', 'error');
- }
- }
-
- sb.register('_loadAdminTasks', async function() {
- var container = document.getElementById('adminDynamic');
- if (!container) return;
- container.innerHTML = SCAFFOLD_HTML;
-
- document.getElementById('taskTabList').addEventListener('click', function() { showTab('list'); loadTasks(); });
- document.getElementById('taskTabConfig').addEventListener('click', function() { showTab('config'); loadConfig(); });
- document.getElementById('taskTabSystem').addEventListener('click', function() { showTab('system'); loadSystemFuncs(); });
- document.getElementById('taskRunBackBtn').addEventListener('click', function() { showTab('list'); });
- document.getElementById('taskKillBtn').addEventListener('click', killRun);
- document.getElementById('taskCfgSaveBtn').addEventListener('click', saveConfig);
-
- await loadTasks();
- });
diff --git a/src/js/task-settings.js b/src/js/task-settings.js
deleted file mode 100644
index 8359c41..0000000
--- a/src/js/task-settings.js
+++ /dev/null
@@ -1,341 +0,0 @@
-// ==========================================
-// Chat Switchboard — Task Settings (User)
-// ==========================================
-// Settings → Tasks section. CRUD for personal tasks with schedule builder,
-// persona/model picker, budget config, and starter templates.
-// Loaded on the settings surface.
-
-
- const PRESETS = [
- { label: 'Every morning (6am)', cron: '0 6 * * *' },
- { label: 'Weekday mornings (8am)', cron: '0 8 * * 1-5' },
- { label: 'Every hour', cron: '0 * * * *' },
- { label: 'Weekly (Monday 9am)', cron: '0 9 * * 1' },
- { label: 'Monthly (1st midnight)', cron: '0 0 1 * *' },
- { label: 'Webhook trigger', cron: 'webhook' },
- { label: 'Custom...', cron: '' },
- ];
-
- const TEMPLATES = [
- { name: 'Morning News Digest', prompt: 'Summarize the top 5 tech news headlines from today. Be concise — one paragraph per story.', schedule: '0 6 * * *' },
- { name: 'Daily Standup Prep', prompt: 'Review my recent notes and conversations. Generate 3 concise standup talking points covering what I worked on yesterday, what I plan today, and any blockers.', schedule: '0 8 * * 1-5' },
- { name: 'Weekly Project Summary', prompt: 'Summarize this week\'s activity across my projects. Highlight completed items, open threads, and priorities for next week.', schedule: '0 17 * * 5' },
- { name: 'Stock Watchlist Check', prompt: 'Check for unusual pre-market activity on major tech stocks (AAPL, GOOGL, MSFT, NVDA, AMZN). Flag any moves > 2%.', schedule: '0 9 * * 1-5' },
- { name: 'Research Digest', prompt: 'Search for the latest papers and blog posts on AI agents and autonomous systems. Summarize the 3 most interesting findings.', schedule: '0 12 * * 1' },
- ];
-
- function esc(s) { return s ? s.replace(/&/g,'&').replace(//g,'>').replace(/"/g,'"') : ''; }
-
- // Detect browser timezone
- function browserTZ() {
- try { return Intl.DateTimeFormat().resolvedOptions().timeZone; } catch (_) { return 'UTC'; }
- }
-
- // ── Task list ────────────────────────────
- async function loadTaskList() {
- var mount = document.getElementById('settingsTasksMount');
- if (!mount) return;
-
- try {
- // Load personal tasks
- var resp = await API._get('/api/v1/tasks');
- var personalTasks = (resp.data || []).map(function(t) { t._source = 'personal'; return t; });
-
- // Load team tasks from all user's teams
- var teamTasks = [];
- try {
- var teamsResp = await API._get('/api/v1/teams/mine');
- var teams = teamsResp.data || teamsResp || [];
- for (var i = 0; i < teams.length; i++) {
- try {
- var tr = await API._get('/api/v1/teams/' + teams[i].id + '/tasks');
- (tr.data || []).forEach(function(t) {
- t._source = 'team';
- t._teamName = teams[i].name;
- teamTasks.push(t);
- });
- } catch (_) { /* team may not have tasks */ }
- }
- } catch (_) { /* no teams */ }
-
- // Deduplicate (user might own a team task)
- var seen = {};
- personalTasks.forEach(function(t) { seen[t.id] = true; });
- teamTasks = teamTasks.filter(function(t) { return !seen[t.id]; });
-
- var tasks = personalTasks.concat(teamTasks);
-
- var html = '' +
- '
' +
- '' +
- '
' +
- statusBadge(r.status) +
- '' + started + ' \u2192 ' + completed + '
' +
- '' +
- 'tokens: ' + r.tokens_used + ' \u00b7 tools: ' + r.tool_calls + ' \u00b7 wall: ' + duration +
- '
' +
- errLine +
- '' +
- '
';
-
- if (tasks.length > 0) {
- html += tasks.map(function(t) {
- var status = t.is_active ? 'active' : 'paused';
- var teamBadge = t._source === 'team' ? '' + esc(t._teamName || 'team') + '' : '';
- var sched = t.schedule === 'once' ? 'One-shot' : t.schedule === 'webhook' ? 'Webhook trigger' : t.schedule;
- var lastStatus = '';
- if (t.last_run_at) {
- lastStatus = ' \u00b7 last: ' + new Date(t.last_run_at).toLocaleString();
- }
- var nextRun = t.schedule === 'webhook' ? 'on trigger' : t.next_run_at ? new Date(t.next_run_at).toLocaleString() : '\u2014';
- var triggerBtn = '';
- if (t.schedule === 'webhook' && t.trigger_token) {
- triggerBtn = '';
- }
-
- return 'Your scheduled tasks. Tasks run automatically on their schedule.
' + - '' + - '' +
- '
';
- }).join('');
- }
-
- // Templates section
- html += '' +
- '
' +
- '' +
- '
' +
- '' + esc(t.name) + '
' +
- '' + esc(sched) + ' (' + esc(t.timezone) + ')' + lastStatus + '
' +
- 'next: ' + nextRun + '
' +
- '' +
- teamBadge + status +
- triggerBtn +
- '' +
- '' +
- '' +
- '
' +
- 'Starter Templates
' + - 'Quick-start with a pre-configured task. You can customize after creation.
' + - '';
- TEMPLATES.forEach(function(tmpl) {
- html += '
' +
- '
';
- });
- html += '' + esc(tmpl.name) + '
' +
- '' + esc(tmpl.schedule) + '
' +
- 'Failed to load tasks: ' + esc(err.message) + '
'; - } - } - - // ── Create form ────────────────────────── - function showCreateForm(defaults) { - var d = defaults || {}; - var mount = document.getElementById('settingsTasksMount'); - if (!mount) return; - - var schedOpts = PRESETS.map(function(p) { - var sel = (d.schedule && d.schedule === p.cron) ? ' selected' : ''; - return ''; - }).join(''); - - mount.innerHTML = - '' + - '' +
- '
';
-
- document.getElementById('taskBackBtn').addEventListener('click', loadTaskList);
- document.getElementById('taskCreateBtn').addEventListener('click', createTask);
-
- // Toggle custom cron visibility
- var preset = document.getElementById('taskPreset');
- var customGroup = document.getElementById('taskCustomCronGroup');
- var triggerInfo = document.getElementById('taskWebhookTriggerInfo');
- preset.addEventListener('change', function() {
- var isWebhook = preset.value === 'webhook';
- var isCustom = preset.value === '';
- customGroup.style.display = isCustom ? '' : 'none';
- triggerInfo.style.display = isWebhook ? '' : 'none';
- if (!isWebhook && !isCustom) document.getElementById('taskCron').value = preset.value;
- if (isWebhook) document.getElementById('taskCron').value = 'webhook';
- });
- // Initial state
- customGroup.style.display = preset.value === '' ? '' : 'none';
- triggerInfo.style.display = preset.value === 'webhook' ? '' : 'none';
- if (preset.value !== '' && preset.value !== 'webhook') document.getElementById('taskCron').value = preset.value;
-
- // Toggle webhook URL and secret visibility
- var output = document.getElementById('taskOutput');
- var webhookGroup = document.getElementById('taskWebhookGroup');
- var webhookSecretGroup = document.getElementById('taskWebhookSecretGroup');
- output.addEventListener('change', function() {
- var isWH = output.value === 'webhook';
- webhookGroup.style.display = isWH ? '' : 'none';
- webhookSecretGroup.style.display = isWH ? '' : 'none';
- });
- }
-
- async function createTask() {
- var schedule = document.getElementById('taskCron').value || document.getElementById('taskPreset').value;
- if (!schedule) { UI.toast('Schedule is required', 'error'); return; }
-
- var payload = {
- name: document.getElementById('taskName').value,
- task_type: 'prompt',
- user_prompt: document.getElementById('taskPrompt').value,
- schedule: schedule,
- timezone: document.getElementById('taskTZ').value || 'UTC',
- output_mode: document.getElementById('taskOutput').value,
- notify_on_complete: document.getElementById('taskNotifyComplete').checked,
- notify_on_failure: document.getElementById('taskNotifyFail').checked,
- };
-
- var model = document.getElementById('taskModel').value;
- if (model) payload.model_id = model;
-
- var maxTokens = parseInt(document.getElementById('taskMaxTokens').value);
- if (maxTokens > 0) payload.max_tokens = maxTokens;
-
- var maxTools = parseInt(document.getElementById('taskMaxToolCalls').value);
- if (maxTools > 0) payload.max_tool_calls = maxTools;
-
- var webhookURL = document.getElementById('taskWebhookURL')?.value;
- if (payload.output_mode === 'webhook' && webhookURL) {
- payload.webhook_url = webhookURL;
- }
- var webhookSecret = document.getElementById('taskWebhookSecret')?.value;
- if (payload.output_mode === 'webhook' && webhookSecret) {
- payload.webhook_secret = webhookSecret;
- }
-
- try {
- var created = await API._post('/api/v1/tasks', payload);
- UI.toast('Task created', 'success');
-
- // Show trigger URL for webhook-scheduled tasks
- if (created.schedule === 'webhook' && created.trigger_token) {
- var triggerURL = location.origin + (window.__BASE__ || '') + '/api/v1/hooks/t/' + created.trigger_token;
- UI.modal('Webhook Trigger URL',
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '' +
- '
' +
- '' +
- 'Used to sign outbound webhook payloads. Leave blank for auto-generated secret.
' + - '' +
- '
' +
- '' +
- '
' +
- '' +
- '
' +
- '' +
- '' +
- '' +
- '
' +
- '' +
- 'POST to this URL to trigger the task. ' + - 'You can use this in CI pipelines, cron jobs, or as another task\\u2019s webhook URL for chaining.
' + - '' +
- '' +
- '' +
- '
' +
- 'The request body is passed to the task as trigger_payload. ' + - 'For task-to-task chaining: set Task A\\u2019s webhook_url to Task B\\u2019s trigger URL.
', - [{ label: 'Done', variant: 'primary' }] - ); - setTimeout(function() { - var copyBtn = document.getElementById('_copyTriggerBtn'); - if (copyBtn) copyBtn.addEventListener('click', function() { - var input = document.getElementById('_triggerURLInput'); - if (input) { navigator.clipboard.writeText(input.value); UI.toast('Copied', 'success'); } - }); - }, 100); - } - - loadTaskList(); - if (typeof TaskSidebar !== 'undefined') TaskSidebar.refresh(); - } catch (err) { - UI.toast(err.message || 'Failed to create task', 'error'); - } - } - - // ── Actions ────────────────────────────── - async function runTask(id) { - try { - await API._post('/api/v1/tasks/' + id + '/run', {}); - UI.toast('Task scheduled for immediate run', 'success'); - } catch (err) { UI.toast(err.message || 'Failed', 'error'); } - } - - async function toggleTask(id, isActive) { - try { - await API._put('/api/v1/tasks/' + id, { is_active: !isActive }); - UI.toast(isActive ? 'Task paused' : 'Task resumed', 'success'); - loadTaskList(); - if (typeof TaskSidebar !== 'undefined') TaskSidebar.refresh(); - } catch (err) { UI.toast(err.message || 'Failed', 'error'); } - } - - async function deleteTask(id) { - if (!confirm('Delete this task?')) return; - try { - await API._delete('/api/v1/tasks/' + id); - UI.toast('Task deleted', 'success'); - loadTaskList(); - if (typeof TaskSidebar !== 'undefined') TaskSidebar.refresh(); - } catch (err) { UI.toast(err.message || 'Failed', 'error'); } - } - - // Template launcher - sb.register('_createFromTemplate', function(name) { - var tmpl = TEMPLATES.find(function(t) { return t.name === name; }); - if (tmpl) showCreateForm({ name: tmpl.name, prompt: tmpl.prompt, schedule: tmpl.schedule }); - }); - - // ── Entry point (called from settings loader) ── - sb.register('_loadSettingsTasks', function() { - loadTaskList(); - }); diff --git a/src/js/ui-admin.js b/src/js/ui-admin.js deleted file mode 100644 index 9c85965..0000000 --- a/src/js/ui-admin.js +++ /dev/null @@ -1,1690 +0,0 @@ -// ========================================== -// Chat Switchboard – UI Admin -// ========================================== -// Fullscreen admin panel with category + section navigation. -// All loadAdmin*() functions unchanged — same endpoints, same DOM IDs. - - -// ── Category → Section mapping ──────────── -const ADMIN_SECTIONS = { - people: ['users', 'teams', 'groups'], - ai: ['providers', 'models', 'personas', 'roles', 'knowledgeBases', 'memory'], - workflows: ['workflows', 'tasks'], - routing: ['health', 'routing', 'capabilities'], - system: ['settings', 'storage', 'packages', 'channels', 'broadcast'], - monitoring: ['dashboard', 'usage', 'audit', 'stats'], -}; - -const ADMIN_LABELS = { - users: 'Users', teams: 'Teams', groups: 'Groups', - providers: 'Providers', models: 'Models', personas: 'Personas', roles: 'Roles', knowledgeBases: 'Knowledge', memory: 'Memory', - health: 'Health', routing: 'Routing', capabilities: 'Capabilities', - workflows: 'Workflows', tasks: 'Tasks', - settings: 'Settings', storage: 'Storage', packages: 'Packages', channels: 'Channels', broadcast: 'Broadcast', - dashboard: 'Dashboard', usage: 'Usage', audit: 'Audit', stats: 'Stats', -}; - -// Section → loader mapping (reuses all existing loadAdmin* functions) -const ADMIN_LOADERS = { - users: () => UI.loadAdminUsers(), - teams: () => UI.loadAdminTeams(), - groups: () => UI.loadAdminGroups(), - roles: () => UI.loadAdminRoles(), - providers: () => UI.loadAdminProviders(), - models: () => UI.loadAdminModels(), - personas: () => UI.loadAdminPersonas(), - knowledgeBases: () => { - if (typeof KnowledgeUI === 'undefined') { console.error('[Admin] KnowledgeUI not loaded — check js/knowledge-ui.js'); return; } - KnowledgeUI.openAdminPanel(); - }, - memory: () => { - if (typeof MemoryUI !== 'undefined') { MemoryUI.openAdminPanel(); } - else { console.error('[Admin] MemoryUI not loaded — check js/memory-ui.js'); } - }, - settings: () => UI.loadAdminSettings(), - storage: () => typeof loadAdminStorage === 'function' ? loadAdminStorage() : null, - packages: () => typeof _loadAdminPackages === 'function' ? _loadAdminPackages() : null, - health: () => UI.loadAdminHealth(), - routing: () => UI.loadAdminRouting(), - capabilities: () => UI.loadAdminCapabilities(), - dashboard: () => UI.loadAdminDashboard(), - usage: () => UI.loadAdminUsage(), - audit: () => UI.loadAuditLog(), - stats: () => UI.loadAdminStats(), - channels: () => UI.loadAdminChannels(), - workflows: () => typeof _loadAdminWorkflows === 'function' ? _loadAdminWorkflows() : null, - tasks: () => typeof _loadAdminTasks === 'function' ? _loadAdminTasks() : null, - broadcast: () => typeof _loadAdminBroadcast === 'function' ? _loadAdminBroadcast() : null, -}; - -// Find which category a section belongs to -function _adminCatForSection(section) { - for (const [cat, sections] of Object.entries(ADMIN_SECTIONS)) { - if (sections.includes(section)) return cat; - } - return 'people'; -} - -Object.assign(UI, { - // ── Admin Panel State ───────────────────── - _adminCat: 'people', - _adminSection: 'users', - - // ── Open / Close ────────────────────────── - openAdmin(cat, section) { - const base = window.__BASE__ || ''; - window.location.href = base + '/admin/' + (section || 'users'); - }, - - closeAdmin() { - const base = window.__BASE__ || ''; - const returnURL = sessionStorage.getItem('sb_admin_return'); - sessionStorage.removeItem('sb_admin_return'); - window.location.href = returnURL || (base + '/'); - }, - - // ── Navigate to specific section ────────── - openAdminSection(section) { - const base = window.__BASE__ || ''; - location.replace(base + '/admin/' + (section || 'users')); - }, - - // ── Category switch ─────────────────────── - switchAdminCategory(cat) { - UI._adminCat = cat; - UI._adminSection = ADMIN_SECTIONS[cat][0]; - UI._renderAdminNav(); - UI._switchAdminSection(UI._adminSection); - }, - - // ── Render navigation state ─────────────── - _renderAdminNav() { - // Highlight active category - document.querySelectorAll('.admin-cat').forEach(btn => { - btn.classList.toggle('active', btn.dataset.cat === UI._adminCat); - }); - // Populate sidebar - const sidebar = document.getElementById('adminSidebar'); - sidebar.innerHTML = ADMIN_SECTIONS[UI._adminCat].map(sec => - `` - ).join(''); - // Wire sidebar clicks - sidebar.querySelectorAll('button').forEach(btn => { - btn.addEventListener('click', () => UI._switchAdminSection(btn.dataset.section)); - }); - }, - - // ── Section switch (shows content + lazy-loads) ── - async _switchAdminSection(section) { - UI._adminSection = section; - // Update sidebar highlight - document.querySelectorAll('.admin-sidebar button').forEach(btn => { - btn.classList.toggle('active', btn.dataset.section === section); - }); - // Hide all, show target - document.querySelectorAll('.admin-section-content').forEach(c => c.style.display = 'none'); - const panel = document.getElementById(`admin${section.charAt(0).toUpperCase() + section.slice(1)}Tab`); - if (panel) panel.style.display = ''; - // Lazy-load data - await ADMIN_LOADERS[section]?.(); - }, - - openTeamAdmin() { - const adminTeams = (UI._myTeams || []).filter(t => t.my_role === 'admin'); - if (adminTeams.length === 0) { - UI.toast('You are not an admin of any teams', 'error'); - return; - } - openModal('teamAdminModal'); - if (adminTeams.length === 1) { - // Skip picker, go directly to the team - UI.openTeamManage(adminTeams[0].id, adminTeams[0].name); - } else { - // Show team picker - document.getElementById('teamAdminTitle').textContent = 'Team Management'; - document.getElementById('teamAdminPicker').style.display = ''; - document.getElementById('teamAdminContent').style.display = 'none'; - document.getElementById('teamAdminPickerList').innerHTML = adminTeams.map(t => ` -
-
- `).join('');
- }
- },
- closeTeamAdmin() { closeModal('teamAdminModal'); },
-
- switchTeamTab(tab) {
- const tabs = document.querySelectorAll('#teamAdminTabs .admin-tab');
- tabs.forEach(t => {
- t.classList.remove('active');
- if (t.dataset.ttab === tab) t.classList.add('active');
- });
- document.querySelectorAll('.team-tab-content').forEach(c => c.style.display = 'none');
- const panel = document.getElementById(`teamTab${tab.charAt(0).toUpperCase() + tab.slice(1)}`);
- if (panel) panel.style.display = '';
-
- // Lazy-load tab data
- const teamId = UI._managingTeamId;
- if (tab === 'members') UI.loadTeamManageMembers(teamId);
- if (tab === 'providers') UI.loadTeamManageProviders(teamId);
- if (tab === 'personas') UI.loadTeamManagePersonas(teamId);
- if (tab === 'workflows') UI.loadTeamWorkflows(teamId);
- if (tab === 'usage') UI.loadTeamUsage();
- if (tab === 'activity') UI.loadTeamAuditLog(1);
- if (tab === 'settings') UI.loadTeamManageSettings(teamId);
- if (tab === 'knowledge') {
- if (typeof KnowledgeUI === 'undefined') {
- console.error('[TeamAdmin] KnowledgeUI not loaded — check js/knowledge-ui.js');
- const c = document.getElementById('teamKBContent');
- if (c) c.innerHTML = '
- ${esc(t.name)}
- admin
- Manage →
-
- ${t.description ? `${esc(t.description)}
` : ''}
- ${t.member_count} member${t.member_count !== 1 ? 's' : ''}
- Knowledge UI failed to load. Check browser console.
';
- } else {
- KnowledgeUI.openTeamPanel(teamId);
- }
- }
- if (tab === 'groups') UI.loadTeamManageGroups(teamId);
- },
-
- async loadAdminUsers(quiet) {
- const el = document.getElementById('adminUserList');
- if (!quiet) el.innerHTML = 'Loading...
';
- try {
- const resp = await API.adminListUsers();
- const users = resp.users || resp.data || [];
- if (!users.length) { el.innerHTML = 'No users
'; return; }
-
- const rows = users.map(u => {
- const initial = (u.display_name || u.username || '?')[0].toUpperCase();
- const name = esc(u.display_name || u.username);
- const handle = '@' + esc(u.username);
- const roleCls = u.role === 'admin' ? 'badge-admin' : u.role === 'service' ? 'badge-service' : 'badge-user';
- const isPending = !u.is_active;
- const statusCls = isPending ? 'badge-warning' : 'badge-active';
- const statusLabel = isPending ? 'pending' : 'active';
- const teams = (u.teams || []).map(t => esc(t.team_name)).join(', ') || '\u2014';
- const lastSeen = u.last_login_at ? _relativeTime(u.last_login_at) : '\u2014';
-
- return `
-
-
${initial}
- ${name}
${handle}
| User | Role | Status | Teams | Last Seen |
|---|
${esc(e.message)}
`; }
- },
-
- // ── Admin: Dashboard (v0.33.0) ────────
- async loadAdminDashboard() {
- const el = document.getElementById('adminDashboardContent');
- if (!el) return;
- el.innerHTML = 'Loading dashboard...
';
-
- try {
- const d = await API.adminGetDashboard();
-
- // Stat cards row
- const providers = d.provider_health || [];
- const healthy = providers.filter(p => p.status === 'healthy').length;
- const degraded = providers.filter(p => p.status === 'degraded' || p.status === 'down' || p.status === 'unhealthy').length;
- const usage = d.usage_24h;
- const tokenStr = usage && usage.total_tokens ? Number(usage.total_tokens).toLocaleString() : '0';
- const reqStr = usage && usage.total_requests ? Number(usage.total_requests).toLocaleString() : '0';
-
- const rt = d.runtime || {};
-
- const cardsEl = document.getElementById('adminDashboardCards');
- if (cardsEl) {
- cardsEl.innerHTML = `
- Uptime
${esc(d.uptime || '—')}
WS Connections
${d.ws_connections || 0}
Providers
${healthy}
${degraded ? degraded + ' degraded' : 'all healthy'}
Tokens (24h)
${tokenStr}
${reqStr} requests
Goroutines
${rt.goroutines || '—'}
Heap
${rt.heap_mb != null ? rt.heap_mb + ' MB' : '—'}
Sys: ${rt.sys_mb || '—'} MB
Provider Health
'; - html += '';
- providers.forEach(p => {
- const name = esc(p.provider_name || p.provider_config_id?.slice(0, 12) || '—');
- const statusCls = p.status === 'healthy' ? 'badge-healthy' : p.status === 'degraded' ? 'badge-degraded' : 'badge-unhealthy';
- const latency = p.avg_latency_ms != null ? Math.round(p.avg_latency_ms) + 'ms' : '—';
- html += `
';
- }
-
- // DB pool stats
- if (d.db_pool) {
- const pool = d.db_pool;
- const pct = pool.OpenConnections > 0 ? Math.round(pool.InUse / pool.OpenConnections * 100) : 0;
- html += '
-
`;
- });
- html += '
- ${name}
- ${esc(p.status || 'unknown')}
-
-
- Latency: ${latency}
- Reqs: ${p.request_count || 0}
- Errors: ${p.error_count || 0}
-
- DB Connection Pool
'; - html += `
-
-
`;
- }
-
- // Storage status (fetched in parallel)
- try {
- const storage = await API._get('/api/v1/admin/storage/status');
- if (storage && storage.configured) {
- html += '
- Open: ${pool.OpenConnections}
- In Use: ${pool.InUse}
- Idle: ${pool.Idle}
- Wait Count: ${pool.WaitCount}
-
- Storage
'; - html += '';
- html += `
`;
- }
- } catch (_) { /* storage status optional */ }
-
- // Recent errors
- const errors = d.recent_errors || [];
- if (errors.length > 0) {
- html += '`;
- html += `Backend: ${esc(storage.backend || '—')}`;
- if (storage.total_bytes != null) html += `Total: ${(storage.total_bytes / 1024 / 1024).toFixed(1)} MB`;
- if (storage.file_count != null) html += `Files: ${storage.file_count}`;
- html += `${storage.healthy ? 'Healthy' : 'Unhealthy'}`;
- html += `
Recent Errors
'; - html += '';
- errors.forEach(e => {
- const time = e.created_at ? new Date(e.created_at).toLocaleString() : '—';
- html += `
';
- }
-
- el.innerHTML = html || '
- ${time}
- ${esc(e.action || '')} ${esc(e.resource_type || '')} ${esc(e.resource_id || '')}
-
`;
- });
- html += 'No data yet.
';
-
- // Auto-refresh every 30s
- if (UI._dashboardRefreshTimer) clearInterval(UI._dashboardRefreshTimer);
- UI._dashboardRefreshTimer = setInterval(() => {
- if (document.getElementById('adminDashboardContent')) {
- UI.loadAdminDashboard();
- } else {
- clearInterval(UI._dashboardRefreshTimer);
- }
- }, 30000);
- } catch (e) { el.innerHTML = `${esc(e.message)}
`; }
- },
-
- async loadAdminStats() {
- const el = document.getElementById('adminStats');
- el.innerHTML = 'Loading...
';
- try {
- const s = await API.adminGetStats();
- const labels = { users: 'Users', channels: 'Channels', messages: 'Messages', models: 'Models', providers: 'Providers', personas: 'Personas' };
- el.innerHTML = Object.entries(s).map(([k, v]) => `
-
-
`).join('');
- } catch (e) { el.innerHTML = `${labels[k] || k.replace(/_/g, ' ')}
- ${typeof v === 'number' ? v.toLocaleString() : esc(String(v))}
- ${esc(e.message)}
`; }
- },
-
- // ── Admin: Roles ────────────────────────
-
- async loadAdminRoles() {
- const el = document.getElementById('adminRolesContent');
- if (!el) return;
-
- if (!UI._adminRoleConfig) {
- UI._adminRoleConfig = renderRoleConfig(el, {
- scope: 'admin',
- showFallback: true,
- modelIdField: 'model_id',
- modelNameField: 'display_name',
- providerIdField: 'provider_config_id',
- fetchProviders: async () => {
- const configs = await API.adminListGlobalConfigs();
- return configs.configs || configs || [];
- },
- fetchModels: async () => {
- const models = await API.adminListModels();
- return models.models || models.data || models || [];
- },
- fetchRoles: () => API.adminListRoles(),
- onSave: async (roleId, config) => {
- await API.adminUpdateRole(roleId, config);
- },
- onTest: (roleId) => API.adminTestRole(roleId),
- });
- }
-
- await UI._adminRoleConfig.refresh();
- },
-
- // ── Admin: Usage ────────────────────────
-
- async loadAdminUsage() {
- // Stat cards + bar chart
- const cardsEl = document.getElementById('adminUsageCards');
- const chartEl = document.getElementById('adminUsageChart');
-
- // Fetch 7-day usage for cards and chart
- if (cardsEl) {
- try {
- const weekData = await API.adminGetUsage({ period: '7d', group_by: 'day' });
- const buckets = weekData.data || weekData.buckets || [];
- const totalReqs = buckets.reduce((s, b) => s + (b.request_count || 0), 0);
- const totalIn = buckets.reduce((s, b) => s + (b.input_tokens || 0), 0);
- const totalOut = buckets.reduce((s, b) => s + (b.output_tokens || 0), 0);
- const totalTokens = totalIn + totalOut;
- const tokenStr = totalTokens > 1e6 ? (totalTokens / 1e6).toFixed(1) + 'M' : totalTokens > 1e3 ? (totalTokens / 1e3).toFixed(0) + 'K' : totalTokens;
- const userSet = new Set(buckets.filter(b => b.user_id).map(b => b.user_id));
- const avgMs = buckets.reduce((s, b) => s + (b.avg_latency_ms || 0), 0);
- const avgLatency = buckets.length ? (avgMs / buckets.length / 1000).toFixed(1) + 's' : '—';
-
- cardsEl.innerHTML = `
- Total Requests
${totalReqs.toLocaleString()}
Last 7 days
Tokens Used
${tokenStr}
Input + output
Active Users
${userSet.size || '—'}
Last 7 days
Avg Response
${avgLatency}
p50 latency
-
`;
- }
- } catch (e) {
- cardsEl.innerHTML = '';
- if (chartEl) chartEl.innerHTML = '';
- }
- }
-
- // Usage breakdown via primitive (preserves existing period/group-by controls)
- const totalsEl = document.getElementById('adminUsageTotals');
- if (!totalsEl) return;
- let usageContainer = document.getElementById('_adminUsageContainer');
- if (!usageContainer) {
- usageContainer = document.createElement('div');
- usageContainer.id = '_adminUsageContainer';
- const resultsEl = document.getElementById('adminUsageResults');
- totalsEl.parentElement.insertBefore(usageContainer, totalsEl);
- usageContainer.appendChild(totalsEl);
- if (resultsEl) usageContainer.appendChild(resultsEl);
- }
-
- if (!UI._adminUsageDash) {
- UI._adminUsageDash = renderUsageDashboard(usageContainer, {
- apiFetch: (p) => API.adminGetUsage(p),
- periodElId: 'usagePeriod',
- groupByElId: 'usageGroupBy',
- compact: false,
- showUserColumn: true,
- });
- }
- await UI._adminUsageDash.refresh();
-
- // Pricing table
- const pricingEl = document.getElementById('adminPricingTable');
- if (pricingEl) {
- try {
- const pricing = await API.adminListPricing();
- const entries = pricing || [];
- if (entries.length === 0) {
- pricingEl.innerHTML = 'Requests per Day
-
- No pricing configured. Sync providers to populate from catalog.
';
- } else {
- pricingEl.innerHTML = `
- | Model | -Input $/M | -Output $/M | -Source | -
|---|---|---|---|
| ${esc(p.model_id)} | -${p.input_per_m != null ? '$' + Number(p.input_per_m).toFixed(4) : '—'} | -${p.output_per_m != null ? '$' + Number(p.output_per_m).toFixed(4) : '—'} | -${p.source} | -
${esc(e.message)}
`; }
- }
- },
-
- async loadAdminExtensions() {
- const el = document.getElementById('adminExtensionsList');
- el.innerHTML = 'Loading...
';
- try {
- const resp = await API._get('/api/v1/admin/extensions');
- const exts = resp.data || [];
- this._adminExtensions = exts;
- if (exts.length === 0) {
- el.innerHTML = 'No extensions installed
';
- return;
- }
- el.innerHTML = `
- | Extension | Status | Tier | Version | |
|---|---|---|---|---|
|
- ${esc(ext.name)}${systemBadge}
- ${esc(ext.description || 'No description')}${ext.author ? ' · by ' + esc(ext.author) : ''}
- |
- ${statusBadge} | -${esc(ext.tier)} | -v${esc(ext.version)} | -- - - - | -
Failed to load extensions
';
- }
- },
-
- _auditPage: 1,
- _auditPerPage: 30,
-
- async loadAuditLog(page) {
- if (page) UI._auditPage = page;
- const el = document.getElementById('adminAuditList');
- el.innerHTML = 'Loading...
';
-
- // Populate action filter on first load
- const actionSel = document.getElementById('auditFilterAction');
- if (actionSel && actionSel.options.length <= 1) {
- try {
- const resp = await API.adminListAuditActions();
- (resp.actions || []).forEach(a => {
- const opt = document.createElement('option');
- opt.value = a;
- opt.textContent = a;
- actionSel.appendChild(opt);
- });
- } catch (e) { /* optional */ }
- }
-
- const params = {
- page: UI._auditPage,
- per_page: UI._auditPerPage,
- action: document.getElementById('auditFilterAction')?.value || '',
- resource_type: document.getElementById('auditFilterResource')?.value || '',
- };
-
- try {
- const resp = await API.adminListAudit(params);
- const entries = resp.data || [];
- const total = resp.total || 0;
- const totalPages = Math.ceil(total / UI._auditPerPage);
-
- if (entries.length === 0) {
- el.innerHTML = 'No audit entries found
';
- } else {
- el.innerHTML = `
- | Action | Actor | Resource | Details | Time | IP |
|---|---|---|---|---|---|
| ${esc(e.action)} | -${esc(actor)} | -${esc(e.resource_type)}${e.resource_id ? ':' + esc(e.resource_id).slice(0,8) : ''} | - -${timeStr} | -${e.ip_address ? esc(e.ip_address) : '—'} | -
${esc(e.message)}
`; }
- },
-
- _formatAuditMeta(metaStr) {
- try {
- const m = typeof metaStr === 'string' ? JSON.parse(metaStr) : metaStr;
- if (!m || Object.keys(m).length === 0) return '';
- return Object.entries(m).map(([k,v]) => `${esc(k)}=${esc(String(v))}`).join(' · ');
- } catch { return ''; }
- },
-
- async loadAdminProviders(quiet) {
- const el = document.getElementById('adminProviderList');
- const formEl = document.getElementById('adminAddProviderForm');
-
- // Initialize admin provider form primitive (once) — now renders inside modal body
- if (!UI._adminProvForm && formEl) {
- UI._adminProvForm = renderProviderForm(formEl, {
- prefix: 'adminProv',
- showPrivate: true,
- showDefaultModel: true,
- onSubmit: async (vals, isEdit) => {
- try {
- if (isEdit) {
- const updates = {};
- if (vals.name) updates.name = vals.name;
- if (vals.endpoint) updates.endpoint = vals.endpoint;
- if (vals.api_key) updates.api_key = vals.api_key;
- updates.model_default = vals.model_default;
- updates.is_private = vals.is_private || false;
- await API.adminUpdateGlobalConfig(vals._editId, updates);
- UI.toast('Provider updated', 'success');
- } else {
- if (!vals.name || !vals.endpoint || !vals.api_key) { UI.toast('Name, endpoint, and API key required', 'warning'); return; }
- await API.adminCreateGlobalConfig(vals.name, vals.provider, vals.endpoint, vals.api_key, vals.model_default, vals.is_private || false);
- UI.toast('Provider added', 'success');
- }
- closeModal('providerFormModal');
- UI._adminProvForm.setCreateMode();
- UI.loadAdminProviders(true);
- } catch (e) { UI.toast(e.message, 'error'); }
- },
- onCancel: () => {
- closeModal('providerFormModal');
- UI._adminProvForm.setCreateMode();
- },
- });
- }
-
- if (!quiet) el.innerHTML = 'Loading...
';
-
- try {
- // Fetch providers, health, and models in parallel
- const [configsRaw, healthRaw, modelsRaw] = await Promise.all([
- API.adminListGlobalConfigs(),
- API.adminGetAllProviderHealth().catch(() => ({ providers: [] })),
- API.adminListModels().catch(() => ({ models: [] })),
- ]);
-
- const configs = Array.isArray(configsRaw) ? configsRaw : (configsRaw.configs || configsRaw.providers || configsRaw.data || []);
- const healthList = healthRaw.providers || healthRaw.data || healthRaw || [];
- const models = modelsRaw.models || modelsRaw.data || modelsRaw || [];
-
- // Build health lookup by provider_config_id
- const healthMap = {};
- (Array.isArray(healthList) ? healthList : []).forEach(h => { healthMap[h.provider_config_id] = h; });
-
- // Count models per provider
- const modelCounts = {};
- (Array.isArray(models) ? models : []).forEach(m => {
- const pid = m.provider_config_id;
- if (pid) modelCounts[pid] = (modelCounts[pid] || 0) + 1;
- });
-
- // Cache for edit
- UI._providerCache = {};
- configs.forEach(c => { UI._providerCache[c.id] = c; });
-
- if (!configs.length) {
- el.innerHTML = 'No providers configured \u2014 click + Add above
';
- return;
- }
-
- el.innerHTML = configs.map(c => {
- const health = healthMap[c.id];
- const status = health ? health.status : 'unknown';
- const statusCls = status === 'healthy' ? 'badge-healthy'
- : status === 'degraded' ? 'badge-degraded'
- : status === 'unhealthy' ? 'badge-unhealthy'
- : 'badge-unknown';
- const count = modelCounts[c.id] || 0;
- const scope = c.is_private ? 'Private' : (c.team_id ? 'Team' : '');
-
- return `
-
`;
- }).join('');
-
- } catch (e) { el.innerHTML = `
-
-
- ${esc(c.name)}${scope ? ' (' + scope + ')' : ''}
- ${status}
- ${esc(e.message)}
`; }
-
- // Delegate card clicks → open edit modal
- if (!el._delegated) {
- el._delegated = true;
- el.addEventListener('click', (e) => {
- const card = e.target.closest('.provider-card');
- if (!card) return;
- const id = card.dataset.id;
- const prov = UI._providerCache?.[id];
- if (!prov || !UI._adminProvForm) return;
- UI._adminProvForm.setEditMode(prov.id, prov);
- document.getElementById('providerFormTitle').textContent = 'Edit Provider';
- openModal('providerFormModal');
- });
- }
- },
-
- async loadAdminModels(quiet) {
- const el = document.getElementById('adminModelList');
- if (!quiet) el.innerHTML = 'Loading...
';
- try {
- const data = await API.adminListModels();
- const list = data.models || data.data || data || [];
- const arr = Array.isArray(list) ? list : [];
- if (!arr.length) { el.innerHTML = 'No models — add a provider first, then click Fetch Models
'; return; }
-
- el.innerHTML = `
- | Model | Provider | Capabilities | Visibility |
|---|---|---|---|
| ${esc(m.model_id || m.id)} | -${esc(m.provider_name || '')} | -${badges} | -- |
${esc(e.message)}
`; }
- },
-
- async loadAdminPersonas(quiet) {
- const el = document.getElementById('adminPersonaList');
- if (!quiet) el.innerHTML = 'Loading...
';
- try {
- const data = await API.adminListPersonas();
- const list = data.data || [];
-
- // Ensure form is initialized for dropdown population
- ensureAdminPersonaForm();
-
- // Populate model dropdown from admin model list (all synced models)
- const modelSel = _adminPersonaForm?.getModelSelect();
- if (modelSel) {
- modelSel.innerHTML = '';
- try {
- const modelData = await API.adminListModels();
- const allModels = modelData.models || modelData.data || [];
- const arr = Array.isArray(allModels) ? allModels : [];
- arr.forEach(m => {
- const opt = document.createElement('option');
- const mid = m.model_id || m.id;
- opt.value = mid;
- opt.textContent = mid + (m.provider_name ? ` (${m.provider_name})` : '');
- modelSel.appendChild(opt);
- });
- } catch (e) { console.warn('Failed to load models for persona form:', e.message); }
- }
-
- // Populate config dropdown
- const cfgSel = _adminPersonaForm?.getConfigSelect();
- if (cfgSel && cfgSel.options.length <= 1) {
- try {
- const cfgData = await API.adminListGlobalConfigs();
- const cfgs = cfgData.configs || cfgData.data || [];
- (Array.isArray(cfgs) ? cfgs : []).forEach(c => {
- const opt = document.createElement('option');
- opt.value = c.id;
- opt.textContent = c.name + ' (' + c.provider + ')';
- cfgSel.appendChild(opt);
- });
- } catch (e) { /* optional */ }
- }
-
- UI._personaCache = {};
- if (!list.length) { el.innerHTML = 'No personas — create one to give users preconfigured model experiences
'; return; }
-
- el.innerHTML = `
- | Persona | Scope | Model | Status | |
|---|---|---|---|---|
|
-
- ${avatarEl}
-
-
-
- ${esc(p.name)}
- ${p.description ? `` : creator}
- |
- ${scopeBadge} | -${esc(p.base_model_id)} | -${p.is_active ? 'active' : 'inactive'} | -- - - - - | -
${esc(e.message)}
`; }
- },
-
- // ── Teams Admin ─────────────────────────
- _teamEditId: null,
-
- async loadAdminTeams(quiet) {
- const el = document.getElementById('adminTeamList');
- const detail = document.getElementById('adminTeamDetail');
- if (!quiet) {
- el.innerHTML = 'Loading...
';
- detail.style.display = 'none';
- el.style.display = '';
- closeModal('createTeamModal');
- }
- try {
- const resp = await API.adminListTeams();
- const teams = resp.data || [];
- if (!teams.length) { el.innerHTML = 'No teams yet — create one to organize users and set policies
'; return; }
-
- el.innerHTML = `
- | Team | Status | Members | |
|---|---|---|---|
|
- ${esc(t.name)}
- ${esc(t.description || 'No description')}
- |
- - ${t.is_active ? 'active' : 'inactive'} - | -${t.member_count} member${t.member_count !== 1 ? 's' : ''} | -- - - - - | -
${esc(e.message)}
`; }
- },
-
- async openTeamDetail(teamId, teamName) {
- this._teamEditId = teamId;
- document.getElementById('adminTeamList').style.display = 'none';
- closeModal('createTeamModal');
- const detail = document.getElementById('adminTeamDetail');
- detail.style.display = '';
- document.getElementById('adminTeamDetailName').textContent = teamName;
- document.getElementById('adminAddMemberForm').style.display = 'none';
-
- // Load team settings for policy checkboxes
- try {
- const team = await API.adminGetTeam(teamId);
- const settings = typeof team.settings === 'string' ? JSON.parse(team.settings || '{}') : (team.settings || {});
- document.getElementById('adminTeamPrivatePolicy').checked = !!settings.require_private_providers;
- // allow_team_providers defaults to true if not explicitly set
- document.getElementById('adminTeamAllowProviders').checked = settings.allow_team_providers !== false;
- } catch (e) { /* proceed with defaults */ }
-
- await this.loadTeamMembers(teamId);
- },
-
- async loadTeamMembers(teamId) {
- const el = document.getElementById('adminMemberList');
- el.innerHTML = 'Loading...
';
- try {
- const resp = await API.adminListMembers(teamId);
- const members = resp.data || [];
- if (!members.length) { el.innerHTML = 'No members — add users to this team
'; return; }
-
- el.innerHTML = `
- | Member | Role | |
|---|---|---|
|
- ${esc(m.display_name || m.email)}
- ${esc(m.email)}
- |
- - - ${m.user_role === 'admin' ? 'sys-admin' : ''} - | -- - | -
${esc(e.message)}
`; }
- },
-
- async loadMemberUserDropdown(teamId) {
- const sel = document.getElementById('adminMemberUser');
- sel.innerHTML = '';
- try {
- const resp = await API.adminListUsers(1, 200);
- const users = resp.users || resp.data || [];
- // Also get existing members to exclude
- const memberResp = await API.adminListMembers(teamId);
- const existingIds = new Set((memberResp.data || []).map(m => m.user_id));
- const available = users.filter(u => u.is_active && !existingIds.has(u.id));
- sel.innerHTML = '' +
- available.map(u => ``).join('');
- } catch (e) { sel.innerHTML = ``; }
- },
-
- // ── Groups Admin ────────────────────────
- _groupEditId: null,
-
- async loadAdminGroups(quiet) {
- const el = document.getElementById('adminGroupList');
- const detail = document.getElementById('adminGroupDetail');
- if (!quiet) {
- el.innerHTML = 'Loading...
';
- detail.style.display = 'none';
- el.style.display = '';
- closeModal('createGroupModal');
- }
- try {
- const resp = await API.adminListGroups();
- const groups = resp.data || [];
- if (!groups.length) { el.innerHTML = 'No groups yet — create one to control access to personas and knowledge bases
'; return; }
-
- el.innerHTML = `
- | Group | Scope | Members | |
|---|---|---|---|
|
- ${esc(g.name)}
- ${esc(g.description || 'No description')}
- |
- ${scopeBadge} | -${g.member_count} member${g.member_count !== 1 ? 's' : ''} | -- - - | -
${esc(e.message)}
`; }
- },
-
- async openGroupDetail(groupId, groupName) {
- this._groupEditId = groupId;
- document.getElementById('adminGroupList').style.display = 'none';
- closeModal('createGroupModal');
- const detail = document.getElementById('adminGroupDetail');
- detail.style.display = '';
- document.getElementById('adminGroupDetailName').textContent = groupName;
- document.getElementById('adminAddGroupMemberForm').style.display = 'none';
-
- // Load group + available permissions + enabled models in parallel
- try {
- const [g, permResp, modelsResp] = await Promise.all([
- API.adminGetGroup(groupId),
- API.adminListPermissions(),
- API.listEnabledModels(),
- ]);
- const scope = g.scope === 'global' ? 'Global group' : 'Team-scoped group';
- document.getElementById('adminGroupDetailMeta').textContent = `${scope} · ${g.member_count} member${g.member_count !== 1 ? 's' : ''}`;
-
- // ── Permission checkboxes ──
- const allPerms = permResp.permissions || [];
- const groupPerms = new Set(g.permissions || []);
- const permDesc = {
- 'model.use': 'Use models for completions',
- 'model.select_any': 'Use any enabled model',
- 'kb.read': 'Search knowledge bases',
- 'kb.write': 'Upload / delete KB documents',
- 'kb.create': 'Create knowledge bases',
- 'channel.create': 'Create channels',
- 'channel.invite': 'Invite users to channels',
- 'persona.create': 'Create personas',
- 'persona.manage': 'Edit / delete team personas',
- 'workflow.create': 'Create workflows',
- 'task.create': 'Create scheduled tasks',
- 'task.admin': 'Manage all tasks + config',
- 'admin.view': 'Read-only admin access',
- 'token.unlimited': 'Bypass token budgets',
- };
- const permEl = document.getElementById('adminGroupPermissions');
- permEl.innerHTML = allPerms.map(p => ``).join('');
-
- // ── Token budget fields ──
- document.getElementById('adminGroupBudgetDaily').value = g.token_budget_daily != null ? g.token_budget_daily : '';
- document.getElementById('adminGroupBudgetMonthly').value = g.token_budget_monthly != null ? g.token_budget_monthly : '';
-
- // ── Model allowlist checkboxes ──
- const models = (modelsResp.data || modelsResp.models || []).filter(m => !m.is_persona);
- const allowedSet = g.allowed_models ? new Set(g.allowed_models) : null;
- const modelEl = document.getElementById('adminGroupModels');
- const seen = new Set();
- const unique = models.filter(m => { if (seen.has(m.model_id)) return false; seen.add(m.model_id); return true; });
- unique.sort((a, b) => a.model_id.localeCompare(b.model_id));
- modelEl.innerHTML = unique.map(m => ``).join('') || 'No models available';
- } catch (e) {
- console.error('openGroupDetail:', e);
- }
-
- // Wire save button
- document.getElementById('adminGroupSavePermsBtn').onclick = () => this._saveGroupPerms(groupId);
-
- await this.loadGroupMembers(groupId);
- },
-
- async _saveGroupPerms(groupId) {
- const status = document.getElementById('adminGroupSaveStatus');
- status.textContent = 'Saving\u2026';
-
- const perms = [...document.querySelectorAll('.group-perm-cb:checked')].map(cb => cb.value);
- const dailyRaw = document.getElementById('adminGroupBudgetDaily').value.trim();
- const monthlyRaw = document.getElementById('adminGroupBudgetMonthly').value.trim();
- const allModelCbs = document.querySelectorAll('.group-model-cb');
- const checkedModelCbs = document.querySelectorAll('.group-model-cb:checked');
- const allChecked = allModelCbs.length > 0 && checkedModelCbs.length === allModelCbs.length;
-
- const update = { permissions: perms };
-
- if (dailyRaw === '') { update.clear_budget_daily = true; }
- else { update.token_budget_daily = parseInt(dailyRaw, 10); }
- if (monthlyRaw === '') { update.clear_budget_monthly = true; }
- else { update.token_budget_monthly = parseInt(monthlyRaw, 10); }
-
- if (allChecked || allModelCbs.length === 0) { update.clear_allowed_models = true; }
- else { update.allowed_models = [...checkedModelCbs].map(cb => cb.value); }
-
- try {
- await API.adminUpdateGroup(groupId, update);
- status.textContent = 'Saved \u2713';
- setTimeout(() => { status.textContent = ''; }, 2000);
- } catch (e) {
- status.textContent = 'Error: ' + e.message;
- }
- },
-
- async loadGroupMembers(groupId) {
- const el = document.getElementById('adminGroupMemberList');
- el.innerHTML = 'Loading...
';
- try {
- const resp = await API.adminListGroupMembers(groupId);
- const members = resp.data || [];
- if (!members.length) { el.innerHTML = 'No members — add users to this group
'; return; }
- el.innerHTML = `
- | Member | Added | |
|---|---|---|
|
- ${esc(m.display_name || m.username || m.email)}
- ${esc(m.email)}
- |
- ${new Date(m.added_at).toLocaleDateString()} | -- - | -
${esc(e.message)}
`; }
- },
-
- async loadGroupMemberDropdown(groupId) {
- const sel = document.getElementById('adminGroupMemberUser');
- sel.innerHTML = '';
- try {
- const resp = await API.adminListUsers(1, 200);
- const users = resp.users || resp.data || [];
- // Exclude existing members
- const memberResp = await API.adminListGroupMembers(groupId);
- const existingIds = new Set((memberResp.data || []).map(m => m.user_id));
- const available = users.filter(u => u.is_active && !existingIds.has(u.id));
- sel.innerHTML = '' +
- available.map(u => ``).join('');
- } catch (e) { sel.innerHTML = ``; }
- },
-
- // ── Grant Picker (shared for Personas + KBs) ──
-
- async openGrantPicker(resourceType, resourceId, resourceName, anchorSelector) {
- // Fetch current grant + all groups for the picker
- const [grantResp, groupsResp] = await Promise.all([
- API.adminGetGrant(resourceType, resourceId),
- API.adminListGroups(),
- ]);
- const grant = grantResp;
- const groups = (groupsResp.data || []);
- const currentScope = grant.grant_scope || 'team_only';
- const currentGroups = new Set(grant.granted_groups || []);
-
- const html = `
-
`;
-
- // Remove any existing picker, then insert after the anchor row
- document.querySelectorAll('.grant-picker-active').forEach(el => el.remove());
- const row = document.querySelector(anchorSelector);
- if (row) {
- const wrapper = document.createElement('div');
- wrapper.className = 'grant-picker-active';
- wrapper.innerHTML = html;
- row.after(wrapper);
-
- // Wire scope toggle
- const scopeSel = document.getElementById(`grantScope_${resourceId}`);
- const groupsDiv = document.getElementById(`grantGroups_${resourceId}`);
- scopeSel?.addEventListener('change', () => {
- groupsDiv.style.display = scopeSel.value === 'groups' ? '' : 'none';
- });
- }
- },
-
- // ── Provider Health Dashboard (v0.22.3) ──────
- async loadAdminHealth() {
- const cardsEl = document.getElementById('adminHealthCards');
- const el = document.getElementById('adminHealthContent');
- if (cardsEl) cardsEl.innerHTML = '';
- el.innerHTML = 'Access: ${esc(resourceName)}
-
-
-
-
-
-
-
-
-
- Loading health data...
';
-
- try {
- const data = await API.adminGetAllProviderHealth();
- const providers = data.data || [];
-
- if (providers.length === 0) {
- el.innerHTML = 'No health data yet — health metrics are collected after the first completion request.
';
- return;
- }
-
- // Stat cards
- const total = providers.length;
- const healthy = providers.filter(p => p.status === 'healthy').length;
- const degraded = providers.filter(p => p.status === 'degraded').length;
- const down = providers.filter(p => p.status === 'down' || p.status === 'unhealthy').length;
- const avgLat = providers.reduce((s, p) => s + (p.avg_latency_ms || 0), 0);
- const avgLatStr = total > 0 ? Math.round(avgLat / total) + 'ms' : '—';
-
- if (cardsEl) {
- cardsEl.innerHTML = `
- Providers
${total}
All configured
Healthy
${healthy}
${total ? Math.round(healthy / total * 100) : 0}%
Degraded
${degraded + down}
${total ? Math.round((degraded + down) / total * 100) : 0}%
Avg Latency
${avgLatStr}
Last hour
| Provider | Status | Latency | Uptime | Requests | Errors | Last Error |
|---|
Failed to load health data: ${esc(e.message)}
`;
- }
- },
-
- // ── Routing Policies (v0.22.3) ───────────────
- async loadAdminRouting() {
- const listEl = document.getElementById('adminRoutingPolicyList');
- const formEl = document.getElementById('adminRoutingForm');
- listEl.innerHTML = 'Loading policies...
';
-
- // Wire add button
- const addBtn = document.getElementById('adminAddRoutingPolicyBtn');
- addBtn?.addEventListener('click', () => UI._showRoutingForm(null), { once: true });
-
- // Wire test button
- const testBtn = document.getElementById('routingTestBtn');
- testBtn?.addEventListener('click', () => UI._runRoutingTest(), { once: true });
-
- try {
- const data = await API.adminListRoutingPolicies();
- const policies = data.data || [];
-
- if (policies.length === 0) {
- listEl.innerHTML = 'No routing policies — requests go to the user\'s default provider config.
';
- return;
- }
-
- const typeLabels = { provider_prefer: 'Provider Prefer', team_route: 'Team Route', cost_limit: 'Cost Limit', model_alias: 'Model Alias' };
-
- listEl.innerHTML = `
- | Policy | Type | Scope | Priority | Status | |
|---|---|---|---|---|---|
| ${esc(p.name)} | -${esc(typeLabels[p.policy_type] || p.policy_type)} | -${p.scope}${p.team_id ? ' · ' + p.team_id.slice(0, 8) : ''} | -${p.priority} | -${p.is_active ? 'active' : 'inactive'} | -- - - - | -
Failed to load routing policies: ${esc(e.message)}
`;
- }
- },
-
- async _showRoutingForm(policyId) {
- const formEl = document.getElementById('adminRoutingForm');
- const isEdit = !!policyId;
- let policy = { name: '', scope: 'global', priority: 100, policy_type: 'provider_prefer', is_active: true, config: {} };
-
- if (isEdit) {
- try { policy = await API.adminGetRoutingPolicy(policyId); } catch (e) { UI.toast(e.message, 'error'); return; }
- }
-
- const cfg = policy.config || {};
- formEl.style.display = '';
- formEl.innerHTML = `
- ${isEdit ? 'Edit' : 'New'} Routing Policy
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
`;
-
- document.getElementById('rpScope').addEventListener('change', (e) => {
- document.getElementById('rpTeamGroup').style.display = e.target.value === 'team' ? '' : 'none';
- });
- document.getElementById('rpCancelBtn').addEventListener('click', () => { formEl.style.display = 'none'; });
- document.getElementById('rpSaveBtn').addEventListener('click', async () => {
- let config;
- try { config = JSON.parse(document.getElementById('rpConfig').value || '{}'); }
- catch (e) { UI.toast('Invalid JSON in config field', 'error'); return; }
-
- const payload = {
- name: document.getElementById('rpName').value,
- priority: parseInt(document.getElementById('rpPriority').value) || 100,
- policy_type: document.getElementById('rpType').value,
- scope: document.getElementById('rpScope').value,
- team_id: document.getElementById('rpScope').value === 'team' ? document.getElementById('rpTeamId').value : null,
- is_active: document.getElementById('rpActive').checked,
- config,
- };
- try {
- if (isEdit) { await API.adminUpdateRoutingPolicy(policyId, payload); }
- else { await API.adminCreateRoutingPolicy(payload); }
- UI.toast(isEdit ? 'Policy updated' : 'Policy created', 'success');
- formEl.style.display = 'none';
- UI.loadAdminRouting();
- } catch (e) { UI.toast(e.message, 'error'); }
- });
- },
-
- async _toggleRoutingPolicy(id, active) {
- try {
- const policy = await API.adminGetRoutingPolicy(id);
- policy.is_active = active;
- await API.adminUpdateRoutingPolicy(id, policy);
- UI.toast(active ? 'Policy enabled' : 'Policy disabled', 'success');
- UI.loadAdminRouting();
- } catch (e) { UI.toast(e.message, 'error'); }
- },
-
- async _deleteRoutingPolicy(id, name) {
- if (!await showConfirm(`Delete routing policy "${name}"?`)) return;
- try {
- await API.adminDeleteRoutingPolicy(id);
- UI.toast('Policy deleted', 'success');
- UI.loadAdminRouting();
- } catch (e) { UI.toast(e.message, 'error'); }
- },
-
- async _runRoutingTest() {
- const model = document.getElementById('routingTestModel').value;
- const userId = document.getElementById('routingTestUser').value || API.user?.id;
- const resultEl = document.getElementById('routingTestResult');
- if (!model) { UI.toast('Model is required', 'warning'); return; }
-
- resultEl.style.display = '';
- resultEl.innerHTML = 'Evaluating...
';
- try {
- const data = await API.adminTestRouting(model, userId);
- const dec = data.decision;
- const candidates = data.candidates || [];
-
- resultEl.innerHTML = `
-
- Decision: ${dec ? `${esc(dec.policy_name || 'no policy')} → ${esc(dec.selected?.slice(0, 8) || '—')}` : 'No routing applied'}
- (${candidates.length} candidates, ${data.policies || 0} policies evaluated)
-
-
- ${candidates.map((c, i) => `
-
`;
- } catch (e) {
- resultEl.innerHTML = `
- ${i + 1}. ${esc(c.provider_id)} / ${esc(c.config_id?.slice(0, 8) || '—')}
- ${esc(c.status || 'unknown')}
- ${c.reason ? `${esc(c.reason)}` : ''}
-
- `).join('')}
- Test failed: ${esc(e.message)}
`;
- }
- },
-
- // ── Capability Overrides (v0.22.3) ───────────
- async loadAdminCapabilities() {
- const el = document.getElementById('adminCapabilityList');
- el.innerHTML = 'Loading overrides...
';
- try {
- const data = await API.adminListCapabilityOverrides();
- const overrides = data.data || [];
-
- if (overrides.length === 0) {
- el.innerHTML = 'No capability overrides — all models use auto-detected capabilities from catalog sync or heuristic inference.
';
- return;
- }
-
- el.innerHTML = `| Model | Provider Config | Field | Value | |
|---|---|---|---|---|
${esc(o.model_id)} |
- ${esc(o.provider_config_id?.slice(0, 8) || 'any')} | -${esc(o.field)} | -${esc(String(o.value))} | -- |
Failed to load overrides: ${esc(e.message)}
`;
- }
- },
-
- async _deleteCapOverride(modelId, overrideId) {
- try {
- await API.adminDeleteModelCapability(modelId, overrideId);
- UI.toast('Override deleted', 'success');
- UI.loadAdminCapabilities();
- } catch (e) { UI.toast(e.message, 'error'); }
- },
-
- async loadAdminSettings() {
- try {
- const data = await API.adminGetSettings();
- // v0.9: { settings: { banner: {...}, ... }, policies: { allow_registration: "true", ... } }
- const settings = data.settings || {};
- const policies = data.policies || {};
-
- // Helper to read from settings map (JSONB values)
- const getSetting = (key, fallback) => {
- const v = settings[key];
- if (v === undefined || v === null) return fallback;
- // Unwrap {value: X} wrapper if present
- return (v && typeof v === 'object' && 'value' in v) ? v.value : v;
- };
-
- // Registration (policy: allow_registration)
- document.getElementById('adminRegToggle').checked = policies.allow_registration === 'true';
-
- // Admin system prompt (global_settings)
- const sysPrompt = getSetting('system_prompt', {}) || {};
- document.getElementById('adminSystemPrompt').value = sysPrompt.content || '';
-
- // Registration default state (policy: default_user_active → 'true' means auto-active)
- const defaultActive = policies.default_user_active === 'true';
- document.getElementById('adminRegDefaultState').value = defaultActive ? 'active' : 'pending';
-
- // User providers / BYOK (policy: allow_user_byok)
- document.getElementById('adminUserProvidersToggle').checked = policies.allow_user_byok === 'true';
-
- // User personas (policy: allow_user_personas)
- document.getElementById('adminUserPersonasToggle').checked = policies.allow_user_personas === 'true';
-
- // KB direct access (policy: kb_direct_access — v0.17.0)
- const kbDirectEl = document.getElementById('adminKBDirectAccessToggle');
- if (kbDirectEl) kbDirectEl.checked = policies.kb_direct_access === 'true';
-
- // Default model (policy: default_model) — populate from current model list
- const defModelSel = document.getElementById('adminDefaultModel');
- if (defModelSel) {
- defModelSel.innerHTML = '';
- let modelList = typeof App !== 'undefined' && App.models ? App.models : [];
- // On admin surface, App isn't loaded — fetch from admin API
- if (modelList.length === 0 && typeof API !== 'undefined' && API.adminListModels) {
- try {
- const mr = await API.adminListModels();
- modelList = (mr.models || mr.data || []).map(m => ({
- id: m.model_id || m.id,
- baseModelId: m.model_id || m.id,
- name: m.display_name || m.model_id || m.id,
- provider: m.provider_name || '',
- hidden: !!m.hidden,
- }));
- } catch (e) { /* non-critical */ }
- }
- modelList.filter(m => !m.hidden).forEach(m => {
- const opt = document.createElement('option');
- opt.value = m.baseModelId || m.id;
- opt.textContent = (m.name || m.id) + (m.provider ? ` (${m.provider})` : '');
- defModelSel.appendChild(opt);
- });
- defModelSel.value = policies.default_model || '';
- }
-
- // Banner (global_settings)
- const banner = getSetting('banner', {}) || {};
- document.getElementById('adminBannerEnabled').checked = !!banner.enabled;
- document.getElementById('adminBannerText').value = banner.text || '';
- document.getElementById('adminBannerBg').value = banner.bg || '#007a33';
- document.getElementById('adminBannerBgHex').value = banner.bg || '#007a33';
- document.getElementById('adminBannerFg').value = banner.fg || '#ffffff';
- document.getElementById('adminBannerFgHex').value = banner.fg || '#ffffff';
- document.getElementById('bannerConfigFields').style.display = banner.enabled ? '' : 'none';
- UI.updateBannerPreview();
-
- // Vault / Encryption status
- const vaultEl = document.getElementById('adminVaultStatus');
-
- // Web Search config (global_settings)
- const searchCfg = getSetting('search_config', {}) || {};
- document.getElementById('adminSearchProvider').value = searchCfg.provider || 'duckduckgo';
- document.getElementById('adminSearchEndpoint').value = searchCfg.endpoint || '';
- document.getElementById('adminSearchApiKey').value = searchCfg.api_key || '';
- document.getElementById('adminSearchMaxResults').value = String(searchCfg.max_results || 5);
- document.getElementById('searxngConfigFields').style.display =
- (searchCfg.provider === 'searxng') ? '' : 'none';
-
- // Auto-Compaction (global_settings)
- const compactionCfg = getSetting('auto_compaction', {}) || {};
- const compactionEnabled = document.getElementById('adminCompactionEnabled');
- if (compactionEnabled) {
- compactionEnabled.checked = !!compactionCfg.enabled;
- document.getElementById('compactionConfigFields').style.display =
- compactionCfg.enabled ? '' : 'none';
- }
- const compThreshold = document.getElementById('adminCompactionThreshold');
- if (compThreshold) compThreshold.value = String(compactionCfg.threshold || 70);
- const compCooldown = document.getElementById('adminCompactionCooldown');
- if (compCooldown) compCooldown.value = String(compactionCfg.cooldown || 30);
-
- // Memory extraction config (v0.18.0)
- const memExtractionCfg = getSetting('memory_extraction', {}) || {};
- const memEnabled = document.getElementById('adminMemoryExtractionEnabled');
- if (memEnabled) {
- memEnabled.checked = !!memExtractionCfg.enabled;
- const memFields = document.getElementById('memoryExtractionConfigFields');
- if (memFields) memFields.style.display = memExtractionCfg.enabled ? '' : 'none';
- memEnabled.addEventListener('change', () => {
- if (memFields) memFields.style.display = memEnabled.checked ? '' : 'none';
- });
- }
- const memAutoApprove = document.getElementById('adminMemoryAutoApprove');
- if (memAutoApprove) memAutoApprove.checked = !!memExtractionCfg.auto_approve;
-
- // Email / SMTP config (v0.20.0 Phase 3)
- const notifCfg = getSetting('notifications', {}) || {};
- if (typeof NotifPrefs !== 'undefined') {
- NotifPrefs._loadAdminSmtp(notifCfg);
- NotifPrefs._initAdminSmtp();
- }
-
- if (vaultEl) {
- try {
- const vault = await API.adminGetVaultStatus();
- const keyBadge = vault.encryption_key_set
- ? 'Active'
- : 'Not Set';
- vaultEl.innerHTML = `
-
-
`;
- } catch (e) {
- vaultEl.innerHTML = 'Could not load vault status';
- }
- }
- } catch (e) { console.debug('Failed to load admin settings:', e); }
- },
-
- updateBannerPreview() {
- const prev = document.getElementById('bannerPreview');
- if (!prev) return;
- const text = document.getElementById('adminBannerText').value || 'PREVIEW';
- const bg = document.getElementById('adminBannerBg').value;
- const fg = document.getElementById('adminBannerFg').value;
- prev.textContent = text;
- prev.style.background = bg;
- prev.style.color = fg;
- },
-
- // ── Admin Channels (v0.23.2) ──────────────
-
- async loadAdminChannels() {
- const list = document.getElementById('adminArchivedList');
- const countEl = document.getElementById('adminArchivedCount');
- const modeEl = document.getElementById('adminRetentionMode');
- if (!list) return;
-
- try {
- const resp = await API._get('/api/v1/admin/channels/archived');
- const channels = resp.channels || [];
- if (countEl) countEl.textContent = channels.length;
- if (modeEl) modeEl.textContent = resp.retention_mode || 'flexible';
-
- if (channels.length === 0) {
- list.innerHTML = '
- Encryption
- ${keyBadge}
-
-
- Encrypted Keys
- ${vault.encrypted_keys}
-
-
- Vault Users
- ${vault.vault_users}
-
- No archived channels
';
- return;
- }
-
- let html = '| Title | Type | Owner | Messages | Archived | ' + - ' |
|---|---|---|---|---|---|
| ${esc(ch.title || 'Untitled')} | -${esc(ch.type)} | -${esc(ch.owner_name)} | -${ch.message_count} | -${age} | -- |
Failed to load: ${esc(e.message)}
`;
- }
- },
-
- async _purgeChannel(channelId) {
- if (!await showConfirm('Permanently delete this archived channel and all its messages? This cannot be undone.')) return;
- try {
- await API._del(`/api/v1/admin/channels/${channelId}/purge`);
- UI.toast('Channel purged', 'success');
- UI.loadAdminChannels(); // refresh list
- } catch (e) {
- UI.toast('Purge failed: ' + e.message, 'error');
- }
- },
-
-});
-
-// ── Exports ─────────────────────────────────
-sb.ns('ADMIN_SECTIONS', ADMIN_SECTIONS);
-sb.ns('ADMIN_LABELS', ADMIN_LABELS);
-sb.ns('ADMIN_LOADERS', ADMIN_LOADERS);
diff --git a/src/js/ui-settings.js b/src/js/ui-settings.js
deleted file mode 100644
index 7b4d077..0000000
--- a/src/js/ui-settings.js
+++ /dev/null
@@ -1,867 +0,0 @@
-// ==========================================
-// Chat Switchboard – UI Settings & Teams
-// ==========================================
-// Extends UI with settings modal tabs, team management,
-// providers, usage, model roles, and user preferences.
-//
-// Exports: none (extends window.UI via Object.assign)
-
-
-Object.assign(UI, {
- // ── General Settings (Settings Surface) ──
-
- async loadGeneralSettings() {
- // Fetch settings from API into App.settings
- try {
- const remote = await API.getSettings();
- if (remote && typeof remote === 'object') {
- if (remote.model) App.settings.model = remote.model;
- if (remote.system_prompt !== undefined) App.settings.systemPrompt = remote.system_prompt;
- if (remote.max_tokens) App.settings.maxTokens = remote.max_tokens;
- if (remote.temperature !== undefined) App.settings.temperature = remote.temperature;
- if (remote.show_thinking !== undefined) App.settings.showThinking = remote.show_thinking;
- }
- } catch (e) { console.warn('Settings load failed:', e.message); }
-
- // Fetch models for the model dropdown
- await fetchModels();
-
- // Populate form elements
- const modelSel = document.getElementById('settingsModel');
- if (modelSel) {
- modelSel.innerHTML = '';
- App.models.filter(m => !m.hidden).forEach(m => {
- const opt = document.createElement('option');
- opt.value = m.id;
- opt.textContent = (m.name || m.id) + (m.provider ? ` (${m.provider})` : '');
- modelSel.appendChild(opt);
- });
- if (App.settings.model) modelSel.value = App.settings.model;
- }
-
- const sysEl = document.getElementById('settingsSystemPrompt');
- if (sysEl) sysEl.value = App.settings.systemPrompt || '';
-
- const maxEl = document.getElementById('settingsMaxTokens');
- if (maxEl) maxEl.value = App.settings.maxTokens || '';
-
- const tempEl = document.getElementById('settingsTemp');
- const tempVal = document.getElementById('settingsTempValue');
- if (tempEl) {
- tempEl.value = App.settings.temperature;
- if (tempVal) tempVal.textContent = App.settings.temperature;
- tempEl.addEventListener('input', () => {
- if (tempVal) tempVal.textContent = tempEl.value;
- });
- }
-
- const thinkEl = document.getElementById('settingsThinking');
- if (thinkEl) thinkEl.checked = App.settings.showThinking;
-
- // Model change → update max tokens hint
- if (modelSel) {
- modelSel.addEventListener('change', () => {
- const model = App.findModel(modelSel.value);
- const caps = model?.capabilities || {};
- const hint = document.getElementById('settingsMaxHint');
- if (hint) {
- hint.textContent = caps.max_output_tokens > 0
- ? `(model max: ${(caps.max_output_tokens / 1000).toFixed(0)}K)` : '';
- }
- });
- // Trigger once to show current model's hint
- modelSel.dispatchEvent(new Event('change'));
- }
-
- // Save button (reuse existing pattern — form auto-saves are not a thing yet)
- const section = document.querySelector('.settings-section');
- if (section && !section.querySelector('.settings-save-btn')) {
- const btn = document.createElement('button');
- btn.className = 'btn-md btn-primary settings-save-btn';
- btn.textContent = 'Save';
- btn.style.marginTop = '12px';
- btn.addEventListener('click', async () => {
- App.settings.model = modelSel?.value || App.settings.model;
- App.settings.systemPrompt = sysEl?.value?.trim() || '';
- App.settings.maxTokens = parseInt(maxEl?.value) || 0;
- App.settings.temperature = parseFloat(tempEl?.value) || 0.7;
- App.settings.showThinking = thinkEl?.checked || false;
- try {
- await API.updateSettings({
- model: App.settings.model,
- system_prompt: App.settings.systemPrompt,
- max_tokens: App.settings.maxTokens,
- temperature: App.settings.temperature,
- show_thinking: App.settings.showThinking,
- });
- UI.toast('Settings saved', 'success');
- } catch (e) { UI.toast(e.message, 'error'); }
- });
- section.appendChild(btn);
- }
- },
-
- // ── Appearance Settings ─────────────────
-
- saveAppearance() {
- const scaleEl = document.getElementById('settingsScale');
- const msgFontEl = document.getElementById('settingsMsgFont');
- const prefs = JSON.parse(localStorage.getItem('cs-appearance') || '{}');
- if (scaleEl) prefs.scale = parseInt(scaleEl.value);
- if (msgFontEl) prefs.msgFont = parseInt(msgFontEl.value);
- // v0.23.2: Theme saved via Theme API (localStorage key: switchboard_theme)
- const activeThemeBtn = document.querySelector('#themeToggle .toggle-btn.active');
- if (activeThemeBtn && typeof Theme !== 'undefined') {
- Theme.set(activeThemeBtn.dataset.theme);
- }
- localStorage.setItem('cs-appearance', JSON.stringify(prefs));
- UI.toast('Appearance saved', 'success');
- },
-
- // ── Teams Settings (Settings Surface) ────
-
- async loadTeamsSettings() {
- const el = document.getElementById('settingsDynamic');
- if (!el) return;
- try {
- const resp = await API.listMyTeams();
- const teams = resp.data || [];
- if (!teams.length) {
- el.innerHTML = 'You are not a member of any teams.
';
- return;
- }
- el.innerHTML = teams.map(t => `
-
-
- `).join('');
- } catch (e) {
- el.innerHTML = '
-
- ${t.description ? `${esc(t.name)}
- ${t.my_role} -${esc(t.description)}
` : ''} -${t.member_count} member${t.member_count !== 1 ? 's' : ''}
- Failed to load teams.
';
- }
- },
-
- loadAppearanceSettings() {
- const prefs = JSON.parse(localStorage.getItem('cs-appearance') || '{}');
- const scale = prefs.scale || 100;
- const msgFont = prefs.msgFont || 14;
- // v0.23.2: Read theme from Theme API
- const theme = typeof Theme !== 'undefined' ? Theme.get() : 'system';
- const keymap = prefs.editorKeymap || 'standard';
-
- const scaleEl = document.getElementById('settingsScale');
- const msgFontEl = document.getElementById('settingsMsgFont');
- if (scaleEl) { scaleEl.value = scale; document.getElementById('scaleValue').textContent = scale + '%'; }
- if (msgFontEl) { msgFontEl.value = msgFont; document.getElementById('msgFontValue').textContent = msgFont + 'px'; }
-
- // Highlight active theme button and wire click
- document.querySelectorAll('#themeToggle .toggle-btn').forEach(btn => {
- btn.classList.toggle('active', btn.dataset.theme === theme);
- btn.onclick = () => {
- document.querySelectorAll('#themeToggle .toggle-btn').forEach(b => b.classList.remove('active'));
- btn.classList.add('active');
- if (typeof Theme !== 'undefined') Theme.set(btn.dataset.theme);
- };
- });
-
- // Highlight active keymap button
- document.querySelectorAll('#keymapToggle .toggle-btn').forEach(btn => {
- btn.classList.toggle('active', btn.dataset.keymap === keymap);
- });
- },
-
- initAppearance() {
- // Theme and appearance are already applied by the universal init
- // in base.html (Theme.init() + UI.restoreAppearance()). This method
- // only wires up the settings UI controls.
-
- // Scale slider: show value live, but apply zoom only on release to avoid
- // jarring layout jumps mid-drag (zoom changes the layout viewport).
- const scaleEl = document.getElementById('settingsScale');
- const msgFontEl = document.getElementById('settingsMsgFont');
- if (scaleEl) {
- scaleEl.addEventListener('input', () => {
- document.getElementById('scaleValue').textContent = parseInt(scaleEl.value) + '%';
- });
- scaleEl.addEventListener('change', () => {
- UI.applyAppearance(parseInt(scaleEl.value), parseInt(msgFontEl?.value || 14));
- });
- }
- if (msgFontEl) {
- msgFontEl.addEventListener('input', () => {
- document.getElementById('msgFontValue').textContent = parseInt(msgFontEl.value) + 'px';
- });
- msgFontEl.addEventListener('change', () => {
- UI.applyAppearance(parseInt(scaleEl?.value || 100), parseInt(msgFontEl.value));
- });
- }
-
- // Theme toggle buttons
- document.querySelectorAll('#themeToggle .toggle-btn').forEach(btn => {
- btn.addEventListener('click', () => {
- const theme = btn.dataset.theme;
- UI.applyTheme(theme); // delegates to Theme.set() — single source of truth
- document.querySelectorAll('#themeToggle .toggle-btn').forEach(b =>
- b.classList.toggle('active', b === btn)
- );
- });
- });
-
- // Editor keymap toggle buttons
- document.querySelectorAll('#keymapToggle .toggle-btn').forEach(btn => {
- btn.addEventListener('click', () => {
- const mode = btn.dataset.keymap;
- document.querySelectorAll('#keymapToggle .toggle-btn').forEach(b =>
- b.classList.toggle('active', b === btn)
- );
- // Persist
- const p = JSON.parse(localStorage.getItem('cs-appearance') || '{}');
- p.editorKeymap = mode;
- localStorage.setItem('cs-appearance', JSON.stringify(p));
- // Notify open editors
- if (typeof sw !== 'undefined') {
- sw.emit('keymap.changed', { mode });
- }
- });
- });
-
- // System theme change listener (for "system" mode)
- // Note: Theme.set('system') registers its own listener, but this
- // additionally fires the theme.changed event for CM6 editors.
- UI._systemThemeQuery = window.matchMedia('(prefers-color-scheme: dark)');
- UI._systemThemeQuery.addEventListener('change', () => {
- const mode = typeof Theme !== 'undefined' ? Theme.get() : 'system';
- if (mode === 'system') UI.applyTheme('system');
- });
- },
-
- /**
- * Apply theme to the document.
- * @param {'light'|'dark'|'system'} mode
- */
- applyTheme(mode) {
- // Delegate to Theme API which handles system-mode resolution and
- // listens for OS preference changes.
- if (typeof Theme !== 'undefined') {
- Theme.set(mode);
- } else {
- // Fallback if Theme not loaded — resolve manually
- let resolved = mode;
- if (mode === 'system') {
- resolved = window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
- }
- document.documentElement.setAttribute('data-theme', resolved);
- }
- // Publish event for CM6 editors and extensions
- if (typeof sw !== 'undefined') {
- const resolved = sw.theme?.current || mode;
- sw.emit('theme.changed', { mode, resolved });
- }
- },
-
- /** Get the currently resolved theme ('dark' or 'light') */
- getResolvedTheme() {
- return document.documentElement.getAttribute('data-theme') === 'light' ? 'light' : 'dark';
- },
-
- // applyAppearance — moved to ui-core.js (v0.25.0-cs11.1) so all surfaces can use it.
-
- async checkUserProvidersAllowed() {
- const notice = document.getElementById('userProvidersDisabled');
- const addBtn = document.getElementById('providerShowAddBtn');
- const tabBtn = document.getElementById('settingsProvidersTabBtn');
- const usageTabBtn = document.getElementById('settingsUsageTabBtn');
- const rolesTabBtn = document.getElementById('settingsRolesTabBtn');
- const kbTabBtn = document.getElementById('settingsKBTabBtn');
- if (!notice) return;
- const allowed = App.policies?.allow_user_byok === 'true';
- if (!kbTabBtn) console.warn('[Settings] settingsKBTabBtn not found in DOM');
- notice.style.display = allowed ? 'none' : '';
- if (addBtn) addBtn.style.display = allowed ? '' : 'none';
- if (tabBtn) tabBtn.style.display = allowed ? '' : 'none';
- if (usageTabBtn) usageTabBtn.style.display = allowed ? '' : 'none';
- if (rolesTabBtn) rolesTabBtn.style.display = allowed ? '' : 'none';
- if (kbTabBtn) kbTabBtn.style.display = allowed ? '' : 'none';
- },
-
- checkUserPersonasAllowed() {
- const addBtn = document.getElementById('userAddPersonaBtn');
- const addForm = document.getElementById('userAddPersonaForm');
- const tabBtn = document.getElementById('settingsPersonasTabBtn');
- const allowed = App.policies?.allow_user_personas === 'true';
- if (addBtn) addBtn.style.display = allowed ? '' : 'none';
- if (addForm && !allowed) addForm.style.display = 'none';
- if (tabBtn) tabBtn.style.display = allowed ? '' : 'none';
- },
-
- async loadProfileIntoSettings() {
- try {
- const p = await API.getProfile();
- document.getElementById('profileDisplayName').value = p.display_name || '';
- document.getElementById('profileEmail').value = p.email || '';
- updateAvatarPreview(p.avatar || null);
- } catch (e) { /* optional */ }
- },
-
- async loadMyTeams() {
- const section = document.getElementById('settingsTeamsSection');
- const el = document.getElementById('settingsTeamsList');
- const menuBtn = document.getElementById('menuTeamAdmin');
- if (!section || !el) return;
- try {
- const resp = await API.listMyTeams();
- const teams = resp.data || [];
- UI._myTeams = teams;
-
- // Show/hide the Team Management flyout item for team admins
- const isTeamAdmin = teams.some(t => t.my_role === 'admin');
- if (menuBtn) menuBtn.style.display = isTeamAdmin ? '' : 'none';
-
- if (teams.length === 0) {
- section.style.display = 'none';
- return;
- }
- section.style.display = '';
- el.innerHTML = teams.map(t => `
-
-
- `).join('');
- } catch (e) { section.style.display = 'none'; if (menuBtn) menuBtn.style.display = 'none'; }
- },
-
- _myTeams: [],
- _managingTeamId: null,
-
- loadTeamsTab() {
- // No longer used — picker is in team admin modal
- },
-
- async openTeamManage(teamId, teamName) {
- UI._managingTeamId = teamId;
- UI._teamAuditPage = 1;
-
- // If the modal isn't open yet (called from settings "Manage →"), open it
- if (!document.getElementById('teamAdminModal').classList.contains('active')) {
- openModal('teamAdminModal');
- }
-
- // Show tabbed content, hide picker
- const adminTeams = (UI._myTeams || []).filter(t => t.my_role === 'admin');
- const titleEl = document.getElementById('teamAdminTitle');
- if (adminTeams.length > 1) {
- titleEl.innerHTML = `← ${esc(teamName)}`;
- } else {
- titleEl.textContent = teamName;
- }
- document.getElementById('teamAdminPicker').style.display = 'none';
- document.getElementById('teamAdminContent').style.display = 'flex';
-
- // Reset forms (null-safe — not all form containers may exist)
- ['settingsTeamAddMember', 'settingsTeamAddPersona', 'settingsTeamProviderForm'].forEach(id => {
- const el = document.getElementById(id);
- if (el) el.style.display = 'none';
- });
- const af = document.getElementById('teamAuditFilterAction');
- if (af) { af.innerHTML = ''; }
-
- // Show Members tab first, load its data
- UI.switchTeamTab('members');
- },
-
- showTeamPicker() {
- document.getElementById('teamAdminTitle').textContent = 'Team Management';
- document.getElementById('teamAdminContent').style.display = 'none';
- document.getElementById('teamAdminPicker').style.display = '';
- },
-
- async loadTeamManageMembers(teamId) {
- const el = document.getElementById('settingsTeamMembers');
- el.innerHTML = '
- ${esc(t.name)}
- ${t.my_role}
- ${t.my_role === 'admin' ? 'Manage →' : ''}
-
- ${t.description ? `${esc(t.description)}
` : ''}
- ${t.member_count} member${t.member_count !== 1 ? 's' : ''}
- Loading...
';
- try {
- const resp = await API.teamListMembers(teamId);
- const members = resp.data || [];
- if (!members.length) { el.innerHTML = 'No members
'; return; }
- el.innerHTML = `
- | Member | Role | |
|---|---|---|
|
- ${esc(m.display_name || m.email)}
- ${m.user_role === 'admin' ? 'sys-admin' : ''}
- |
- - - | -- - | -
${esc(e.message)}
`; }
- },
-
- async loadTeamManageProviders(teamId) {
- const el = document.getElementById('settingsTeamProviders');
- if (!el) return;
- const addBtn = document.getElementById('settingsTeamAddProviderBtn');
- const formEl = document.getElementById('settingsTeamProviderForm');
-
- // Initialize team provider form primitive (once)
- if (!UI._teamProvForm && formEl) {
- UI._teamProvForm = renderProviderForm(formEl, {
- prefix: 'teamProv',
- showPrivate: true,
- showDefaultModel: true,
- onSubmit: async (vals, isEdit) => {
- const tid = UI._managingTeamId;
- try {
- if (isEdit) {
- const updates = {};
- if (vals.name) updates.name = vals.name;
- if (vals.endpoint) updates.endpoint = vals.endpoint;
- if (vals.api_key) updates.api_key = vals.api_key;
- if (vals.model_default) updates.model_default = vals.model_default;
- updates.is_private = vals.is_private || false;
- await API.teamUpdateProvider(tid, vals._editId, updates);
- UI.toast('Provider updated');
- } else {
- if (!vals.name) return UI.toast('Name required', 'error');
- if (!vals.endpoint) return UI.toast('Endpoint required', 'error');
- await API.teamCreateProvider(tid, {
- name: vals.name, provider: vals.provider, endpoint: vals.endpoint,
- api_key: vals.api_key, is_private: vals.is_private || false,
- });
- UI.toast('Provider added');
- }
- formEl.style.display = 'none';
- UI._teamProvForm.setCreateMode();
- UI._teamProvList.refresh();
- await fetchModels();
- } catch (e) { UI.toast(e.message, 'error'); }
- },
- onCancel: () => {
- formEl.style.display = 'none';
- UI._teamProvForm.setCreateMode();
- },
- });
- }
-
- // Initialize team provider list primitive (once)
- if (!UI._teamProvList) {
- UI._teamProvList = renderProviderList(el, {
- apiFetch: async () => {
- const resp = await API.teamListProviders(UI._managingTeamId);
- // Handle policy check
- const allowed = resp.allow_team_providers !== false;
- if (addBtn) addBtn.style.display = allowed ? '' : 'none';
- if (!allowed && !(resp.data || resp.providers || []).length) {
- throw { message: 'Team provider management is disabled by your administrator', _empty: true };
- }
- return resp;
- },
- showPrivate: true,
- showActive: true,
- emptyMsg: 'No team providers — add one to give your team access to additional models',
- onEdit: (prov) => {
- if (UI._teamProvForm) {
- UI._teamProvForm.setEditMode(prov.id, prov);
- formEl.style.display = '';
- }
- },
- onDelete: async (prov) => {
- if (!await showConfirm(`Delete team provider "${prov.name}"? This will remove all models from this provider for your team.`)) return;
- try {
- await API.teamDeleteProvider(UI._managingTeamId, prov.id);
- UI.toast('Provider deleted');
- UI._teamProvList.refresh();
- await fetchModels();
- } catch (e) { UI.toast(e.message, 'error'); }
- },
- onToggleActive: async (prov) => {
- try {
- await API.teamUpdateProvider(UI._managingTeamId, prov.id, { is_active: !prov.is_active });
- UI.toast(prov.is_active ? 'Provider deactivated' : 'Provider activated');
- UI._teamProvList.refresh();
- await fetchModels();
- } catch (e) { UI.toast(e.message, 'error'); }
- },
- });
- }
-
- await UI._teamProvList.refresh();
- },
-
- async loadTeamManagePersonas(teamId) {
- const el = document.getElementById('settingsTeamPersonas');
- el.innerHTML = 'Loading...
';
- try {
- const resp = await API.teamListPersonas(teamId);
- const personas = resp.data || [];
- el.innerHTML = personas.map(p => {
- const icon = p.icon || '';
- return `
-
`;
- }).join('') || '
- ${icon ? icon + ' ' : ''}${esc(p.name)}
-
-
-
- No team personas — create one to give your team preconfigured models
';
- } catch (e) { el.innerHTML = `${esc(e.message)}
`; }
- },
-
- async loadTeamManageGroups(teamId) {
- const el = document.getElementById('settingsTeamGroups');
- if (!el) return;
- el.innerHTML = 'Loading...
';
- try {
- const resp = await API.teamListGroups(teamId);
- const groups = resp.data || [];
- if (!groups.length) { el.innerHTML = 'No groups assigned to this team yet
'; return; }
- el.innerHTML = `
- | Group | Members |
|---|---|
${esc(g.name)} ${esc(g.description || 'No description')} |
- ${g.member_count} member${g.member_count !== 1 ? 's' : ''} | -
${esc(e.message)}
`; }
- },
-
- async loadTeamManageSettings(teamId) {
- if (!teamId) return;
- try {
- const team = await API.teamGetTeam ? API.teamGetTeam(teamId) : await API.adminGetTeam(teamId);
- const settings = typeof team.settings === 'string' ? JSON.parse(team.settings || '{}') : (team.settings || {});
- const privEl = document.getElementById('teamSettingPrivatePolicy');
- const allowEl = document.getElementById('teamSettingAllowProviders');
- if (privEl) privEl.checked = !!settings.require_private_providers;
- if (allowEl) allowEl.checked = settings.allow_team_providers !== false;
-
- // Wire save button (once)
- const saveBtn = document.getElementById('teamSettingSaveBtn');
- if (saveBtn && !saveBtn._wired) {
- saveBtn._wired = true;
- saveBtn.addEventListener('click', async () => {
- const tid = UI._managingTeamId;
- const priv = document.getElementById('teamSettingPrivatePolicy')?.checked || false;
- const allow = document.getElementById('teamSettingAllowProviders')?.checked !== false;
- try {
- await API.adminUpdateTeam(tid, { settings: JSON.stringify({ require_private_providers: priv, allow_team_providers: allow }) });
- UI.toast('Team settings saved', 'success');
- } catch (e) { UI.toast(e.message, 'error'); }
- });
- }
- } catch (e) { /* proceed with defaults */ }
- },
-
- async loadMyUsage() {
- const el = document.getElementById('myUsageTotals')?.parentElement;
- if (!el) return;
- if (!UI._myUsageDash) {
- UI._myUsageDash = renderUsageDashboard(el, {
- apiFetch: (p) => API.getMyUsage(p),
- periodElId: 'myUsagePeriod',
- groupByElId: 'myUsageGroupBy',
- compact: true,
- });
- }
- await UI._myUsageDash.refresh();
- },
-
- async loadTeamUsage() {
- const teamId = UI._managingTeamId;
- if (!teamId) return;
- const el = document.getElementById('settingsTeamUsageTotals')?.parentElement;
- if (!el) return;
- if (!UI._teamUsageDash) {
- UI._teamUsageDash = renderUsageDashboard(el, {
- apiFetch: (p) => API.teamGetUsage(teamId, p),
- periodElId: 'teamUsagePeriod',
- groupByElId: 'teamUsageGroupBy',
- compact: true,
- showUserColumn: true,
- });
- }
- await UI._teamUsageDash.refresh();
- },
-
- _teamAuditPage: 1,
- _teamAuditPerPage: 20,
-
- // ── User Model Roles (BYOK overrides) ──
-
- async loadUserRoles() {
- const el = document.getElementById('userRolesConfig');
- const notice = document.getElementById('userRolesDisabled');
- if (!el) return;
-
- // Only show if BYOK is enabled
- const byokAllowed = App.policies?.allow_user_byok === 'true';
- if (!byokAllowed) {
- el.style.display = 'none';
- if (notice) {
- notice.innerHTML = 'BYOK (Bring Your Own Key) must be enabled by your admin before you can configure model role overrides.
'; - notice.style.display = ''; - } - return; - } - - // Check if user has personal providers - try { - const configs = await API.listConfigs(); - const configList = configs.configs || configs.data || []; - const personalProviders = configList.filter(c => c.scope === 'personal'); - - if (personalProviders.length === 0) { - el.style.display = 'none'; - if (notice) { - notice.innerHTML = 'Add a personal provider in My Providers first to configure model role overrides.
'; - notice.style.display = ''; - } - return; - } - el.style.display = ''; - if (notice) notice.style.display = 'none'; - } catch (e) { - el.innerHTML = `${esc(e.message)}
`;
- return;
- }
-
- if (_userRoleConfig) await _userRoleConfig.refresh();
- },
-
- async loadTeamAuditLog(page) {
- const teamId = UI._managingTeamId;
- if (!teamId) return;
- if (page) UI._teamAuditPage = page;
-
- const el = document.getElementById('settingsTeamAudit');
- if (!el) return;
- el.innerHTML = 'Loading...
';
-
- // Populate action filter on first load
- const actionSel = document.getElementById('teamAuditFilterAction');
- if (actionSel && actionSel.options.length <= 1) {
- try {
- const resp = await API.teamListAuditActions(teamId);
- (resp.actions || []).forEach(a => {
- const opt = document.createElement('option');
- opt.value = a;
- opt.textContent = a;
- actionSel.appendChild(opt);
- });
- } catch (e) { /* optional */ }
- }
-
- const params = {
- page: UI._teamAuditPage,
- per_page: UI._teamAuditPerPage,
- action: document.getElementById('teamAuditFilterAction')?.value || '',
- };
-
- try {
- const resp = await API.teamListAudit(teamId, params);
- const entries = resp.data || [];
- const total = resp.total || 0;
- const totalPages = Math.ceil(total / UI._teamAuditPerPage);
-
- if (entries.length === 0) {
- el.innerHTML = 'No activity recorded for this team
';
- } else {
- el.innerHTML = entries.map(e => {
- const ts = new Date(e.created_at);
- const timeStr = ts.toLocaleDateString() + ' ' + ts.toLocaleTimeString([], {hour:'2-digit', minute:'2-digit'});
- const actor = e.actor_name || 'system';
- const meta = UI._formatAuditMeta(e.metadata);
- return `
-
`;
- }).join('');
- }
-
- // Pagination
- const pgEl = document.getElementById('teamAuditPagination');
- if (totalPages > 1) {
- pgEl.style.display = 'flex';
- document.getElementById('teamAuditPageInfo').textContent = `Page ${UI._teamAuditPage} of ${totalPages} (${total} entries)`;
- document.getElementById('teamAuditPrevBtn').disabled = UI._teamAuditPage <= 1;
- document.getElementById('teamAuditNextBtn').disabled = UI._teamAuditPage >= totalPages;
- } else {
- pgEl.style.display = 'none';
- }
- } catch (e) { el.innerHTML = `
- ${esc(e.action)}
- ${esc(actor)}
- ${esc(e.resource_type)}${e.resource_id ? ':' + esc(e.resource_id).slice(0,8) : ''}
-
-
- ${esc(e.message)}
`; }
- },
-
- async loadTeamPersonaModelDropdown(teamId) {
- const sel = document.getElementById('teamPersona_model');
- if (!sel) return;
- sel.innerHTML = '';
- try {
- const resp = await API.teamListAvailableModels(teamId);
- const models = resp.models || [];
- sel.innerHTML = '';
-
- // Group by source for clarity
- const globalModels = models.filter(m => m.source !== 'team');
- const teamModels = models.filter(m => m.source === 'team');
-
- const addGroup = (label, items) => {
- if (!items.length) return;
- const group = document.createElement('optgroup');
- group.label = label;
- items.forEach(m => {
- const opt = document.createElement('option');
- opt.value = m.model_id || m.id;
- const vis = m.visibility === 'team' ? ' [team-only]' : '';
- opt.textContent = (m.model_id || m.id) + (m.provider_name ? ` (${m.provider_name})` : '') + vis;
- group.appendChild(opt);
- });
- sel.appendChild(group);
- };
-
- addGroup('Global Models', globalModels);
- addGroup('Team Provider Models', teamModels);
- } catch (e) {
- // Fallback to App.models if team endpoint fails
- sel.innerHTML = '';
- App.models.filter(m => !m.isPersona).forEach(m => {
- const opt = document.createElement('option');
- opt.value = m.baseModelId || m.id;
- opt.textContent = (m.name || m.id) + (m.provider ? ` (${m.provider})` : '');
- sel.appendChild(opt);
- });
- }
- },
-
- // ── Providers ────────────────────────────
-
- async loadProviderList() {
- if (_userProvList) { await _userProvList.refresh(); return; }
- // Fallback if primitives not yet initialized
- const el = document.getElementById('providerList');
- el.innerHTML = 'Loading...
';
- },
-
- showProviderForm() { document.getElementById('providerAddForm').style.display = ''; },
- hideProviderForm() {
- document.getElementById('providerAddForm').style.display = 'none';
- if (_userProvForm) _userProvForm.setCreateMode();
- },
-
- // ── User Model List ─────────────────────
-
- async loadUserModels() {
- const el = document.getElementById('userModelList');
- if (!el) return;
- el.innerHTML = 'Loading models...
';
- try {
- // Load preferences if not already loaded
- if (!App.hiddenModels) {
- try {
- const prefData = await API.getModelPreferences();
- App.hiddenModels = new Set(
- (prefData.data || prefData.preferences || []).filter(p => p.hidden).map(p =>
- (p.provider_config_id || '') + ':' + p.model_id
- )
- );
- } catch (e) {
- if (!App.hiddenModels) App.hiddenModels = new Set();
- }
- }
-
- const data = await API.listEnabledModels();
- const models = (data.data || data.models || []).filter(m => !m.is_persona);
- if (!models.length) {
- el.innerHTML = 'No models available
';
- return;
- }
-
- const hiddenCount = models.filter(m => {
- const cfgId = m.config_id || m.provider_config_id || '';
- return App.hiddenModels.has((cfgId || '') + ':' + (m.model_id || m.id));
- }).length;
- const visibleCount = models.length - hiddenCount;
-
- let html = `
- ${visibleCount} visible, ${hiddenCount} hidden of ${models.length} total
-
-
-
-
`;
-
- html += models.map(m => {
- const mid = m.model_id || m.id;
- const cfgId = m.config_id || m.provider_config_id || '';
- const compositeKey = (cfgId || '') + ':' + mid;
- const caps = m.capabilities || {};
- const badges = renderCapBadges(caps, { compact: true });
- const src = m.source === 'personal' ? 'personal'
- : m.source === 'team' ? `👥 ${esc(m.team_name || 'team')}` : '';
- const hidden = App.hiddenModels.has(compositeKey);
- const toggleCls = hidden ? '' : 'enabled';
- const toggleLabel = hidden ? 'Hidden' : '✓ Visible';
- return `
- ${esc(mid)}
- ${badges}
- ${esc(m.provider_name || m.provider || '')}
- ${src}
-
-
`;
- }).join('');
- el.innerHTML = html;
- } catch (e) { el.innerHTML = `${esc(e.message)}
`; }
- },
-
- async loadUserPersonas() {
- const el = document.getElementById('userPersonaList');
- if (!el) return;
- try {
- const data = await API.listUserPersonas();
- // Only show personal personas owned by user
- const personas = (data.data || []).filter(p => p.scope === 'personal');
- if (!personas.length) {
- el.innerHTML = 'No personal personas yet
';
- return;
- }
- el.innerHTML = personas.map(p => {
- const avatarEl = p.avatar ? `
-
`;
- }).join('');
- } catch (e) { el.innerHTML = `
- ${avatarEl}${esc(p.name)}
-
-
-
-
-
- ${esc(e.message)}
`; }
- },
-
-});
-
diff --git a/src/js/workflow-admin.js b/src/js/workflow-admin.js
deleted file mode 100644
index 3565e4f..0000000
--- a/src/js/workflow-admin.js
+++ /dev/null
@@ -1,826 +0,0 @@
-// ==========================================
-// Chat Switchboard — Workflow Builder (Admin)
-// ==========================================
-// Admin panel for managing workflow definitions, stages, and publishing.
-// Registered as ADMIN_LOADERS.workflows in ui-admin.js.
-
-
- // ── Scaffold HTML ────────────────────────
- // Injected directly into adminDynamic by the loader since SCAFFOLDING
- // is scoped inside admin-scaffold.js's IIFE and not accessible here.
-
- var SCAFFOLD_HTML =
- '' +
- '';
-
- // ── State ───────────────────────────────
-
- var _currentWf = null;
- var _editingStageId = null;
- var _personaCache = []; // [{id, name, icon}]
- var _surfacePkgCache = []; // [{id, title}]
-
- // Load personas into the stage editor dropdown.
- async function _wfLoadPersonaSelect(selectedId) {
- var sel = document.getElementById('wfStagePersona');
- if (!sel) return;
-
- // Fetch once per detail session
- if (_personaCache.length === 0) {
- try {
- var resp = await API.adminListPersonas();
- _personaCache = (resp.data || resp || []).map(function(p) {
- return { id: p.id, name: p.name, icon: p.icon || '' };
- });
- } catch (e) {
- // Fall back to user-visible personas
- try {
- var resp2 = await API.listPersonas();
- _personaCache = (resp2.data || resp2 || []).map(function(p) {
- return { id: p.id, name: p.name, icon: p.icon || '' };
- });
- } catch (e2) { /* no personas available */ }
- }
- }
-
- sel.innerHTML = '';
- _personaCache.forEach(function(p) {
- var opt = document.createElement('option');
- opt.value = p.id;
- opt.textContent = (p.icon ? p.icon + ' ' : '') + p.name;
- sel.appendChild(opt);
- });
-
- if (selectedId) sel.value = selectedId;
- }
-
- // Load surface packages into the stage editor dropdown.
- async function _wfLoadSurfacePkgSelect(selectedId) {
- var sel = document.getElementById('wfStageSurfacePkg');
- if (!sel) return;
-
- if (_surfacePkgCache.length === 0) {
- try {
- var resp = await fetch((window.__BASE__ || '') + '/api/v1/admin/packages', {
- headers: API._authHeaders ? API._authHeaders() : {},
- });
- var data = await resp.json();
- var pkgs = data.data || data || [];
- // Include packages that could have surface JS (type surface or workflow)
- _surfacePkgCache = pkgs.filter(function(p) {
- return p.type === 'surface' || p.type === 'workflow' || p.type === 'full';
- }).map(function(p) {
- return { id: p.id, title: p.title || p.id };
- });
- } catch (e) { /* no packages available */ }
- }
-
- sel.innerHTML = '';
- _surfacePkgCache.forEach(function(p) {
- var opt = document.createElement('option');
- opt.value = p.id;
- opt.textContent = p.title;
- sel.appendChild(opt);
- });
-
- if (selectedId) sel.value = selectedId;
- }
-
- // ── Loader (called from ADMIN_LOADERS.workflows) ──
-
- sb.register('_loadAdminWorkflows', async function() {
- // Self-scaffold: inject our HTML into adminDynamic
- var target = document.getElementById('adminDynamic');
- if (target && !document.getElementById('wfAdminList')) {
- target.innerHTML = SCAFFOLD_HTML;
- _wfWireFormBuilder();
- }
-
- const list = document.getElementById('wfAdminList');
- const detail = document.getElementById('wfAdminDetail');
- if (!list) return;
-
- detail.style.display = 'none';
- list.style.display = '';
-
- try {
- const resp = await API.listWorkflows();
- const wfs = resp.data || resp || [];
-
- if (wfs.length === 0) {
- list.innerHTML =
- 'No workflows yet
' +
- '';
- return;
- }
-
- let html = '' +
- '' + wfs.length + ' workflow(s)' +
- '
';
- html += '' +
- '' +
- '' +
- '
| Name | Slug | Entry | Active | Version | ' + - '
|---|---|---|---|---|
| ' + esc(wf.name) + ' | ' + - '' + esc(wf.slug) + ' | ' +
- '' + esc(wf.entry_mode || 'authenticated') + ' | ' + - '' + (wf.is_active ? '✓' : '—') + ' | ' + - 'v' + (wf.version || 1) + ' | ' + - '
Failed to load: ' + esc(e.message) + '
';
- }
- });
-
- // ── Create ──────────────────────────────
-
- sb.register('_wfCreate', async function() {
- const name = prompt('Workflow name:');
- if (!name) return;
- try {
- const wf = await API.createWorkflow({ name });
- UI.toast('Workflow created', 'success');
- _wfOpen(wf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- });
-
- // ── Open Detail ─────────────────────────
-
- sb.register('_wfOpen', async function(id) {
- const list = document.getElementById('wfAdminList');
- const detail = document.getElementById('wfAdminDetail');
- try {
- const wf = await API.getWorkflow(id);
- _currentWf = wf;
- list.style.display = 'none';
- detail.style.display = '';
-
- document.getElementById('wfDetailName').textContent = wf.name;
- document.getElementById('wfDetailVersion').textContent = 'v' + (wf.version || 1);
- document.getElementById('wfDetailStatus').textContent = wf.is_active ? 'Active' : 'Inactive';
- document.getElementById('wfDetailStatus').className = 'badge ' + (wf.is_active ? 'badge-ok' : 'badge-warn');
-
- document.getElementById('wfEditName').value = wf.name;
- document.getElementById('wfEditSlug').value = wf.slug;
- document.getElementById('wfEditDesc').value = wf.description || '';
- document.getElementById('wfEditEntry').value = wf.entry_mode || 'authenticated';
- document.getElementById('wfEditActive').checked = wf.is_active;
-
- // Public URL
- const scope = wf.team_id || 'global';
- const base = location.origin + (window.__BASE__ || '');
- document.getElementById('wfPublicUrl').textContent =
- wf.entry_mode === 'public_link'
- ? base + '/w/' + scope + '/' + wf.slug
- : 'Enable "Public Link" entry mode to generate a URL';
-
- // Preload persona cache for stage list display
- await _wfLoadPersonaSelect('');
-
- // Load stages
- await _wfLoadStages(id);
- _wfWireEvents();
- } catch (e) {
- UI.toast('Failed to load workflow: ' + e.message, 'error');
- }
- });
-
- // ── Stage List ──────────────────────────
-
- async function _wfLoadStages(wfId) {
- const el = document.getElementById('wfStageList');
- if (!el) return;
- try {
- const resp = await API.listStages(wfId);
- const stages = resp.data || resp || [];
- if (stages.length === 0) {
- el.innerHTML = 'No stages — add one below
';
- return;
- }
- let html = '';
- stages.forEach(function(s, i) {
- var personaLabel = '';
- if (s.persona_id) {
- var p = _personaCache.find(function(x) { return x.id === s.persona_id; });
- personaLabel = p ? '' + esc((p.icon ? p.icon + ' ' : '') + p.name) + '' :
- 'persona';
- }
- var modeLabel = '';
- if (s.stage_mode === 'review') {
- modeLabel = 'review';
- } else if (s.stage_mode && s.stage_mode !== 'chat_only') {
- modeLabel = '' + esc(s.stage_mode.replace('_', ' ')) + '';
- }
- var surfaceLabel = '';
- if (s.surface_pkg_id) {
- surfaceLabel = 'pkg: ' + esc(s.surface_pkg_id) + '';
- }
- html += '' +
- '⠿' +
- '' + i + '' +
- '' + esc(s.name) + '' +
- personaLabel + modeLabel + surfaceLabel +
- '' + (s.history_mode || 'full') + '' +
- '' +
- '' +
- '
';
- });
- el.innerHTML = html;
-
- // v0.27.0: Wire DnD reorder on stage rows
- _wfWireStageDnD(el, wfId);
- } catch (e) {
- el.innerHTML = 'Failed: ' + esc(e.message) + '
';
- }
- }
-
- // ── Wire Events (called once per detail open) ──
-
- // v0.27.0: Wire drag-and-drop reorder on stage rows
- function _wfWireStageDnD(container, wfId) {
- var dragSrc = null;
- container.querySelectorAll('.wf-stage-row').forEach(function(row) {
- row.addEventListener('dragstart', function(e) {
- dragSrc = row;
- row.classList.add('dragging');
- e.dataTransfer.effectAllowed = 'move';
- e.dataTransfer.setData('text/plain', row.dataset.id);
- });
- row.addEventListener('dragend', function() {
- row.classList.remove('dragging');
- container.querySelectorAll('.wf-stage-row').forEach(function(r) {
- r.classList.remove('drag-over');
- });
- dragSrc = null;
- });
- row.addEventListener('dragover', function(e) {
- e.preventDefault();
- e.dataTransfer.dropEffect = 'move';
- if (row !== dragSrc) row.classList.add('drag-over');
- });
- row.addEventListener('dragleave', function() {
- row.classList.remove('drag-over');
- });
- row.addEventListener('drop', function(e) {
- e.preventDefault();
- row.classList.remove('drag-over');
- if (!dragSrc || dragSrc === row) return;
-
- // Reorder in DOM
- var rows = Array.from(container.querySelectorAll('.wf-stage-row'));
- var fromIdx = rows.indexOf(dragSrc);
- var toIdx = rows.indexOf(row);
- if (fromIdx < toIdx) {
- row.parentNode.insertBefore(dragSrc, row.nextSibling);
- } else {
- row.parentNode.insertBefore(dragSrc, row);
- }
-
- // Collect new order and send to backend
- var orderedIDs = Array.from(container.querySelectorAll('.wf-stage-row')).map(function(r) {
- return r.dataset.id;
- });
- API.reorderStages(wfId, orderedIDs).then(function() {
- UI.toast('Stages reordered', 'success');
- _wfLoadStages(wfId);
- }).catch(function(err) {
- UI.toast('Reorder failed: ' + (err.message || err), 'error');
- _wfLoadStages(wfId);
- });
- });
- });
- }
-
- var _wired = false;
- function _wfWireEvents() {
- if (_wired) return;
- _wired = true;
-
- document.getElementById('wfBackBtn').onclick = function() {
- _currentWf = null;
- _editingStageId = null;
- _personaCache = [];
- _surfacePkgCache = [];
- _wired = false;
- _loadAdminWorkflows();
- };
-
- document.getElementById('wfSaveBtn').onclick = async function() {
- if (!_currentWf) return;
- try {
- await API.updateWorkflow(_currentWf.id, {
- name: document.getElementById('wfEditName').value.trim(),
- description: document.getElementById('wfEditDesc').value.trim(),
- entry_mode: document.getElementById('wfEditEntry').value,
- is_active: document.getElementById('wfEditActive').checked,
- });
- UI.toast('Saved', 'success');
- _wfOpen(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
-
- document.getElementById('wfPublishBtn').onclick = async function() {
- if (!_currentWf) return;
- try {
- const ver = await API.publishWorkflow(_currentWf.id);
- UI.toast('Published v' + ver.version_number, 'success');
- _wfOpen(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
-
- document.getElementById('wfExportBtn').onclick = function() {
- if (!_currentWf) return;
- API.exportWorkflowPkg(_currentWf.id);
- };
-
- document.getElementById('wfDeleteBtn').onclick = async function() {
- if (!_currentWf) return;
- if (!confirm('Delete workflow "' + _currentWf.name + '"? This cannot be undone.')) return;
- try {
- await API.deleteWorkflow(_currentWf.id);
- UI.toast('Deleted', 'success');
- _currentWf = null;
- _personaCache = [];
- _surfacePkgCache = [];
- _wired = false;
- _loadAdminWorkflows();
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
-
- document.getElementById('wfAddStageBtn').onclick = async function() {
- _editingStageId = null;
- document.getElementById('wfStageName').value = '';
- document.getElementById('wfStageHistory').value = 'full';
- document.getElementById('wfStagePersona').value = '';
- document.getElementById('wfStagePrompt').value = '';
- document.getElementById('wfStageMode').value = 'chat_only';
- document.getElementById('wfStageForm').value = '';
- document.getElementById('wfFormFields').innerHTML = '';
- _wfUpdateFormBuilderVisibility();
- await _wfLoadPersonaSelect('');
- await _wfLoadSurfacePkgSelect('');
- document.getElementById('wfStageEditor').style.display = '';
- };
-
- document.getElementById('wfCancelStageBtn').onclick = function() {
- document.getElementById('wfStageEditor').style.display = 'none';
- _editingStageId = null;
- };
-
- document.getElementById('wfSaveStageBtn').onclick = async function() {
- if (!_currentWf) return;
- var name = document.getElementById('wfStageName').value.trim();
- if (!name) { UI.toast('Stage name required', 'error'); return; }
-
- var stageMode = document.getElementById('wfStageMode').value;
- var formTemplate = null;
-
- if (stageMode === 'form_only' || stageMode === 'form_chat') {
- // Build from visual builder or JSON textarea
- var jsonToggle = document.getElementById('wfFormJsonToggle');
- if (jsonToggle && jsonToggle.checked) {
- var formRaw = document.getElementById('wfStageForm').value.trim();
- if (formRaw) {
- try { formTemplate = JSON.parse(formRaw); }
- catch (e) { UI.toast('Invalid JSON in form template', 'error'); return; }
- }
- } else {
- formTemplate = _wfBuildFormTemplateFromUI();
- }
- if (!formTemplate || !formTemplate.fields || formTemplate.fields.length === 0) {
- UI.toast('Form modes require at least one form field', 'error');
- return;
- }
- } else {
- // chat_only: still allow optional legacy form template
- var formRaw = document.getElementById('wfStageForm').value.trim();
- if (formRaw) {
- try { formTemplate = JSON.parse(formRaw); }
- catch (e) { UI.toast('Invalid JSON in form template', 'error'); return; }
- }
- }
-
- var personaId = document.getElementById('wfStagePersona').value || null;
- var surfacePkgId = document.getElementById('wfStageSurfacePkg').value || null;
-
- var data = {
- name: name,
- history_mode: document.getElementById('wfStageHistory').value,
- stage_mode: stageMode,
- persona_id: personaId,
- system_prompt: document.getElementById('wfStagePrompt').value.trim() || undefined,
- form_template: formTemplate,
- surface_pkg_id: surfacePkgId,
- };
-
- try {
- if (_editingStageId) {
- await API.updateStage(_currentWf.id, _editingStageId, data);
- } else {
- data.ordinal = document.querySelectorAll('.wf-stage-row').length;
- await API.createStage(_currentWf.id, data);
- }
- UI.toast('Stage saved', 'success');
- document.getElementById('wfStageEditor').style.display = 'none';
- _editingStageId = null;
- await _wfLoadStages(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
- }
-
- // ── Edit / Delete Stage ─────────────────
-
- sb.register('_wfEditStage', async function(stageId) {
- if (!_currentWf) return;
- try {
- const resp = await API.listStages(_currentWf.id);
- const stages = resp.data || resp || [];
- const stage = stages.find(function(s) { return s.id === stageId; });
- if (!stage) return;
-
- _editingStageId = stageId;
- document.getElementById('wfStageName').value = stage.name;
- document.getElementById('wfStageHistory').value = stage.history_mode || 'full';
- document.getElementById('wfStageMode').value = stage.stage_mode || 'chat_only';
- await _wfLoadPersonaSelect(stage.persona_id || '');
- document.getElementById('wfStagePrompt').value = stage.system_prompt || '';
-
- // Populate form builder from existing template
- var tpl = stage.form_template;
- document.getElementById('wfStageForm').value = tpl ? JSON.stringify(tpl, null, 2) : '';
- _wfPopulateFormBuilder(tpl);
- _wfUpdateFormBuilderVisibility();
-
- // Surface package selector
- await _wfLoadSurfacePkgSelect(stage.surface_pkg_id || '');
-
- document.getElementById('wfStageEditor').style.display = '';
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- });
-
- // ── Import .pkg ──────────────────────────
-
- sb.register('_wfImportPkg', function() {
- var input = document.createElement('input');
- input.type = 'file';
- input.accept = '.pkg,.zip';
- input.onchange = async function() {
- if (!input.files || !input.files[0]) return;
- var formData = new FormData();
- formData.append('file', input.files[0]);
- try {
- var resp = await fetch((window.__BASE__ || '') + '/api/v1/admin/packages/install', {
- method: 'POST',
- headers: API._authHeaders ? { 'Authorization': API._authHeaders()['Authorization'] } : {},
- body: formData,
- });
- var result = await resp.json();
- if (!resp.ok) {
- UI.toast('Import failed: ' + (result.error || 'unknown'), 'error');
- return;
- }
- UI.toast('Workflow imported: ' + (result.title || result.id), 'success');
- _loadAdminWorkflows();
- } catch (e) {
- UI.toast('Import error: ' + e.message, 'error');
- }
- };
- input.click();
- });
-
- sb.register('_wfDeleteStage', async function(stageId) {
- if (!_currentWf) return;
- if (!confirm('Delete this stage?')) return;
- try {
- await API.deleteStage(_currentWf.id, stageId);
- UI.toast('Stage deleted', 'success');
- await _wfLoadStages(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- });
-
- // ── Form Builder Helpers ────────────────
-
- var FIELD_TYPES = ['text', 'email', 'number', 'date', 'textarea', 'select', 'checkbox', 'file'];
-
- // Show/hide the form builder based on stage_mode
- function _wfUpdateFormBuilderVisibility() {
- var mode = document.getElementById('wfStageMode').value;
- var wrap = document.getElementById('wfFormBuilderWrap');
- if (wrap) wrap.style.display = (mode === 'form_only' || mode === 'form_chat') ? '' : 'none';
- }
-
- // Build a single field row element
- function _wfCreateFieldRow(field) {
- field = field || { key: '', type: 'text', label: '', required: false };
- var row = document.createElement('div');
- row.className = 'wf-field-row';
- row.draggable = true;
- row.innerHTML =
- '⠿' +
- '' +
- '' +
- '' +
- '' +
- '';
-
- // Delete handler
- row.querySelector('.wf-fb-del').onclick = function() {
- row.remove();
- _wfSyncFormJSON();
- };
-
- // Type change: show options editor for select
- row.querySelector('.wf-fb-type').onchange = function() {
- var optWrap = row.querySelector('.wf-fb-options');
- if (this.value === 'select') {
- if (!optWrap) {
- optWrap = document.createElement('div');
- optWrap.className = 'wf-fb-options';
- optWrap.style.cssText = 'margin:4px 0 0 28px;font-size:12px';
- optWrap.innerHTML = '';
- row.appendChild(optWrap);
- }
- optWrap.style.display = '';
- } else if (optWrap) {
- optWrap.style.display = 'none';
- }
- _wfSyncFormJSON();
- };
-
- // If select type, add options input
- if (field.type === 'select') {
- var optWrap = document.createElement('div');
- optWrap.className = 'wf-fb-options';
- optWrap.style.cssText = 'margin:4px 0 0 28px;font-size:12px';
- optWrap.innerHTML = '';
- row.appendChild(optWrap);
- }
-
- // Sync JSON on any input change
- row.querySelectorAll('input, select').forEach(function(el) {
- el.addEventListener('change', _wfSyncFormJSON);
- el.addEventListener('input', _wfSyncFormJSON);
- });
-
- // DnD within field list
- row.addEventListener('dragstart', function(e) {
- row.classList.add('dragging');
- e.dataTransfer.effectAllowed = 'move';
- e.dataTransfer.setData('text/plain', '');
- _wfDragFieldSrc = row;
- });
- row.addEventListener('dragend', function() {
- row.classList.remove('dragging');
- document.querySelectorAll('.wf-field-row').forEach(function(r) { r.classList.remove('drag-over'); });
- _wfDragFieldSrc = null;
- });
- row.addEventListener('dragover', function(e) {
- e.preventDefault();
- if (row !== _wfDragFieldSrc) row.classList.add('drag-over');
- });
- row.addEventListener('dragleave', function() { row.classList.remove('drag-over'); });
- row.addEventListener('drop', function(e) {
- e.preventDefault();
- row.classList.remove('drag-over');
- if (!_wfDragFieldSrc || _wfDragFieldSrc === row) return;
- var container = document.getElementById('wfFormFields');
- var rows = Array.from(container.querySelectorAll('.wf-field-row'));
- var from = rows.indexOf(_wfDragFieldSrc);
- var to = rows.indexOf(row);
- if (from < to) {
- row.parentNode.insertBefore(_wfDragFieldSrc, row.nextSibling);
- } else {
- row.parentNode.insertBefore(_wfDragFieldSrc, row);
- }
- _wfSyncFormJSON();
- });
-
- return row;
- }
-
- var _wfDragFieldSrc = null;
-
- // Populate the form builder from an existing template object
- function _wfPopulateFormBuilder(tpl) {
- var container = document.getElementById('wfFormFields');
- if (!container) return;
- container.innerHTML = '';
-
- if (!tpl || !tpl.fields || !Array.isArray(tpl.fields)) return;
-
- tpl.fields.forEach(function(f) {
- // Support both typed objects and legacy string-only fields
- if (typeof f === 'string') {
- f = { key: f, type: 'text', label: f, required: false };
- }
- container.appendChild(_wfCreateFieldRow(f));
- });
- }
-
- // Build a typed form_template from the visual builder
- function _wfBuildFormTemplateFromUI() {
- var container = document.getElementById('wfFormFields');
- if (!container) return null;
- var rows = container.querySelectorAll('.wf-field-row');
- if (rows.length === 0) return null;
-
- var fields = [];
- rows.forEach(function(row) {
- var key = row.querySelector('.wf-fb-key').value.trim();
- var type = row.querySelector('.wf-fb-type').value;
- var label = row.querySelector('.wf-fb-label').value.trim();
- var required = row.querySelector('.wf-fb-required').checked;
- if (!key) return; // skip empty key fields
-
- var field = { key: key, type: type, label: label || key, required: required };
-
- // Parse select options
- if (type === 'select') {
- var optsInput = row.querySelector('.wf-fb-opts-input');
- if (optsInput && optsInput.value.trim()) {
- field.options = optsInput.value.split(',').map(function(s) {
- s = s.trim();
- return { value: s, label: s };
- }).filter(function(o) { return o.value; });
- }
- }
- fields.push(field);
- });
-
- return fields.length > 0 ? { fields: fields } : null;
- }
-
- // Sync visual builder → JSON textarea (one-way, when builder is active)
- function _wfSyncFormJSON() {
- var jsonToggle = document.getElementById('wfFormJsonToggle');
- if (!jsonToggle) return;
- var tpl = _wfBuildFormTemplateFromUI();
- document.getElementById('wfStageForm').value = tpl ? JSON.stringify(tpl, null, 2) : '';
- }
-
- // Wire form builder controls (called once after scaffold injection)
- function _wfWireFormBuilder() {
- var modeSelect = document.getElementById('wfStageMode');
- if (modeSelect) {
- modeSelect.onchange = _wfUpdateFormBuilderVisibility;
- }
-
- var addBtn = document.getElementById('wfAddFieldBtn');
- if (addBtn) {
- addBtn.onclick = function() {
- var container = document.getElementById('wfFormFields');
- if (container) {
- container.appendChild(_wfCreateFieldRow());
- _wfSyncFormJSON();
- }
- };
- }
-
- var jsonToggle = document.getElementById('wfFormJsonToggle');
- if (jsonToggle) {
- jsonToggle.onchange = function() {
- var textarea = document.getElementById('wfStageForm');
- if (this.checked) {
- // Sync builder → JSON before showing
- _wfSyncFormJSON();
- textarea.style.display = '';
- } else {
- // Sync JSON → builder
- var raw = textarea.value.trim();
- if (raw) {
- try {
- var tpl = JSON.parse(raw);
- _wfPopulateFormBuilder(tpl);
- } catch (e) {
- UI.toast('Invalid JSON — fix before switching to visual mode', 'error');
- this.checked = true;
- return;
- }
- }
- textarea.style.display = 'none';
- }
- };
- }
- }
-
diff --git a/src/js/workflow-team-admin.js b/src/js/workflow-team-admin.js
deleted file mode 100644
index 30b4adc..0000000
--- a/src/js/workflow-team-admin.js
+++ /dev/null
@@ -1,707 +0,0 @@
-// ==========================================
-// Chat Switchboard — Team Workflow Builder (v0.31.2)
-// ==========================================
-// Team admin panel for managing team-scoped workflow definitions,
-// stages, and publishing. Adapted from workflow-admin.js using
-// team-scoped API endpoints. Loaded as a team admin tab.
-
-(function () {
- 'use strict';
-
- var esc = typeof window.esc === 'function' ? window.esc : function (s) {
- var d = document.createElement('div'); d.textContent = s || ''; return d.innerHTML;
- };
-
- // ── Scaffold HTML ────────────────────────
-
- var SCAFFOLD_HTML =
- '' +
- '';
-
- // ── State ───────────────────────────────
-
- var _teamId = null;
- var _teamSlug = null;
- var _currentWf = null;
- var _editingStageId = null;
- var _personaCache = [];
-
- function _getTeamId() {
- return _teamId || (UI && UI._managingTeamId) || null;
- }
-
- // Load team personas into the stage editor dropdown.
- async function _twfLoadPersonaSelect(selectedId) {
- var sel = document.getElementById('twfStagePersona');
- if (!sel) return;
-
- var teamId = _getTeamId();
- if (_personaCache.length === 0 && teamId) {
- try {
- var resp = await API._get('/api/v1/teams/' + teamId + '/personas');
- _personaCache = (resp.data || resp || []).map(function(p) {
- return { id: p.id, name: p.name, icon: p.icon || '' };
- });
- } catch (e) {
- // Fall back to user-visible personas
- try {
- var resp2 = await API.listPersonas();
- _personaCache = (resp2.data || resp2 || []).map(function(p) {
- return { id: p.id, name: p.name, icon: p.icon || '' };
- });
- } catch (e2) { /* no personas available */ }
- }
- }
-
- sel.innerHTML = '';
- _personaCache.forEach(function(p) {
- var opt = document.createElement('option');
- opt.value = p.id;
- opt.textContent = (p.icon ? p.icon + ' ' : '') + p.name;
- sel.appendChild(opt);
- });
-
- if (selectedId) sel.value = selectedId;
- }
-
- // ── Loader (called from switchTeamTab) ──
-
- UI.loadTeamWorkflows = async function(teamId) {
- _teamId = teamId;
- _teamSlug = null;
- _currentWf = null;
- _editingStageId = null;
- _personaCache = [];
- _twfWired = false;
-
- // Fetch team slug for clean public URLs
- try {
- var teamResp = await API._get('/api/v1/admin/teams/' + teamId);
- _teamSlug = teamResp.slug || null;
- } catch (e) { /* fallback to team ID in URLs */ }
-
- var target = document.getElementById('teamTabWorkflows');
- if (!target) return;
-
- // Self-scaffold
- if (!document.getElementById('twfList')) {
- target.innerHTML = SCAFFOLD_HTML;
- _twfWireFormBuilder();
- }
-
- var list = document.getElementById('twfList');
- var detail = document.getElementById('twfDetail');
- if (!list) return;
-
- detail.style.display = 'none';
- list.style.display = '';
-
- try {
- var resp = await API.listTeamWorkflows(teamId);
- var wfs = resp.data || resp || [];
-
- if (wfs.length === 0) {
- list.innerHTML =
- 'No workflows for this team
' +
- '';
- return;
- }
-
- var html = '' +
- '' + wfs.length + ' workflow(s)' +
- '' +
- '
';
- html += '| Name | Slug | Entry | Active | Version | ' + - '
|---|---|---|---|---|
| ' + esc(wf.name) + ' | ' + - '' + esc(wf.slug) + ' | ' +
- '' + esc(wf.entry_mode || 'team_only') + ' | ' + - '' + (wf.is_active ? '✓' : '—') + ' | ' + - 'v' + (wf.version || 1) + ' | ' + - '
Failed to load: ' + esc(e.message) + '
';
- }
- };
-
- // ── Create ──────────────────────────────
-
- sb.register('_twfCreate', async function() {
- var teamId = _getTeamId();
- if (!teamId) return;
- var name = prompt('Workflow name:');
- if (!name) return;
- try {
- var wf = await API.createTeamWorkflow(teamId, { name: name });
- UI.toast('Workflow created', 'success');
- _twfOpen(wf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- });
-
- // ── Open Detail ─────────────────────────
-
- async function _twfOpen(id) {
- var teamId = _getTeamId();
- var list = document.getElementById('twfList');
- var detail = document.getElementById('twfDetail');
- try {
- var wf = await API.getTeamWorkflow(teamId, id);
- _currentWf = wf;
- list.style.display = 'none';
- detail.style.display = '';
-
- document.getElementById('twfDetailName').textContent = wf.name;
- document.getElementById('twfDetailVersion').textContent = 'v' + (wf.version || 1);
- document.getElementById('twfDetailStatus').textContent = wf.is_active ? 'Active' : 'Inactive';
- document.getElementById('twfDetailStatus').className = 'badge ' + (wf.is_active ? 'badge-ok' : 'badge-warn');
-
- document.getElementById('twfEditName').value = wf.name;
- document.getElementById('twfEditSlug').value = wf.slug;
- document.getElementById('twfEditDesc').value = wf.description || '';
- document.getElementById('twfEditEntry').value = wf.entry_mode || 'team_only';
- document.getElementById('twfEditActive').checked = wf.is_active;
-
- // Public URL (v0.31.2: use team slug for clean URLs)
- var scope = _teamSlug || wf.team_id || teamId;
- var base = location.origin + (window.__BASE__ || '');
- document.getElementById('twfPublicUrl').textContent =
- wf.entry_mode === 'public_link'
- ? base + '/w/' + scope + '/' + wf.slug
- : 'Enable "Public Link" entry mode to generate a URL';
-
- // Preload persona cache
- await _twfLoadPersonaSelect('');
-
- // Load stages
- await _twfLoadStages(id);
- _twfWireEvents();
- } catch (e) {
- UI.toast('Failed to load workflow: ' + e.message, 'error');
- }
- }
- sb.register('_twfOpen', function(id) { return _twfOpen(id); });
-
- // ── Stage List ──────────────────────────
-
- async function _twfLoadStages(wfId) {
- var teamId = _getTeamId();
- var el = document.getElementById('twfStageList');
- if (!el) return;
- try {
- var resp = await API.listTeamWorkflowStages(teamId, wfId);
- var stages = resp.data || resp || [];
- if (stages.length === 0) {
- el.innerHTML = 'No stages — add one below
';
- return;
- }
- var html = '';
- stages.forEach(function(s, i) {
- var personaLabel = '';
- if (s.persona_id) {
- var p = _personaCache.find(function(x) { return x.id === s.persona_id; });
- personaLabel = p ? '' + esc((p.icon ? p.icon + ' ' : '') + p.name) + '' :
- 'persona';
- }
- var modeLabel = '';
- if (s.stage_mode === 'review') {
- modeLabel = 'review';
- } else if (s.stage_mode && s.stage_mode !== 'chat_only') {
- modeLabel = '' + esc(s.stage_mode.replace('_', ' ')) + '';
- }
- html += '' +
- '⠿' +
- '' + i + '' +
- '' + esc(s.name) + '' +
- personaLabel + modeLabel +
- '' + (s.history_mode || 'full') + '' +
- '' +
- '' +
- '
';
- });
- el.innerHTML = html;
- _twfWireStageDnD(el, wfId);
- } catch (e) {
- el.innerHTML = 'Failed: ' + esc(e.message) + '
';
- }
- }
-
- // ── Stage DnD ───────────────────────────
-
- function _twfWireStageDnD(container, wfId) {
- var dragSrc = null;
- var teamId = _getTeamId();
- container.querySelectorAll('.wf-stage-row').forEach(function(row) {
- row.addEventListener('dragstart', function(e) {
- dragSrc = row;
- row.classList.add('dragging');
- e.dataTransfer.effectAllowed = 'move';
- e.dataTransfer.setData('text/plain', row.dataset.id);
- });
- row.addEventListener('dragend', function() {
- row.classList.remove('dragging');
- container.querySelectorAll('.wf-stage-row').forEach(function(r) {
- r.classList.remove('drag-over');
- });
- dragSrc = null;
- });
- row.addEventListener('dragover', function(e) {
- e.preventDefault();
- e.dataTransfer.dropEffect = 'move';
- if (row !== dragSrc) row.classList.add('drag-over');
- });
- row.addEventListener('dragleave', function() {
- row.classList.remove('drag-over');
- });
- row.addEventListener('drop', function(e) {
- e.preventDefault();
- row.classList.remove('drag-over');
- if (!dragSrc || dragSrc === row) return;
- var rows = Array.from(container.querySelectorAll('.wf-stage-row'));
- var fromIdx = rows.indexOf(dragSrc);
- var toIdx = rows.indexOf(row);
- if (fromIdx < toIdx) {
- row.parentNode.insertBefore(dragSrc, row.nextSibling);
- } else {
- row.parentNode.insertBefore(dragSrc, row);
- }
- var orderedIDs = Array.from(container.querySelectorAll('.wf-stage-row')).map(function(r) {
- return r.dataset.id;
- });
- API.reorderTeamWorkflowStages(teamId, wfId, orderedIDs).then(function() {
- UI.toast('Stages reordered', 'success');
- _twfLoadStages(wfId);
- }).catch(function(err) {
- UI.toast('Reorder failed: ' + (err.message || err), 'error');
- _twfLoadStages(wfId);
- });
- });
- });
- }
-
- // ── Wire Events ─────────────────────────
-
- var _twfWired = false;
- function _twfWireEvents() {
- if (_twfWired) return;
- _twfWired = true;
-
- document.getElementById('twfBackBtn').onclick = function() {
- _currentWf = null;
- _editingStageId = null;
- _personaCache = [];
- _twfWired = false;
- UI.loadTeamWorkflows(_getTeamId());
- };
-
- document.getElementById('twfSaveBtn').onclick = async function() {
- if (!_currentWf) return;
- var teamId = _getTeamId();
- try {
- await API.updateTeamWorkflow(teamId, _currentWf.id, {
- name: document.getElementById('twfEditName').value.trim(),
- description: document.getElementById('twfEditDesc').value.trim(),
- entry_mode: document.getElementById('twfEditEntry').value,
- is_active: document.getElementById('twfEditActive').checked,
- });
- UI.toast('Saved', 'success');
- _twfOpen(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
-
- document.getElementById('twfPublishBtn').onclick = async function() {
- if (!_currentWf) return;
- var teamId = _getTeamId();
- try {
- var ver = await API.publishTeamWorkflow(teamId, _currentWf.id);
- UI.toast('Published v' + ver.version_number, 'success');
- _twfOpen(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
-
- document.getElementById('twfDeleteBtn').onclick = async function() {
- if (!_currentWf) return;
- if (!confirm('Delete workflow "' + _currentWf.name + '"? This cannot be undone.')) return;
- var teamId = _getTeamId();
- try {
- await API.deleteTeamWorkflow(teamId, _currentWf.id);
- UI.toast('Deleted', 'success');
- _currentWf = null;
- _personaCache = [];
- _twfWired = false;
- UI.loadTeamWorkflows(teamId);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
-
- document.getElementById('twfAddStageBtn').onclick = async function() {
- _editingStageId = null;
- document.getElementById('twfStageName').value = '';
- document.getElementById('twfStageHistory').value = 'full';
- document.getElementById('twfStagePersona').value = '';
- document.getElementById('twfStageMode').value = 'chat_only';
- document.getElementById('twfStageForm').value = '';
- document.getElementById('twfFormFields').innerHTML = '';
- _twfUpdateFormBuilderVisibility();
- await _twfLoadPersonaSelect('');
- document.getElementById('twfStageEditor').style.display = '';
- };
-
- document.getElementById('twfCancelStageBtn').onclick = function() {
- document.getElementById('twfStageEditor').style.display = 'none';
- _editingStageId = null;
- };
-
- document.getElementById('twfSaveStageBtn').onclick = async function() {
- if (!_currentWf) return;
- var teamId = _getTeamId();
- var name = document.getElementById('twfStageName').value.trim();
- if (!name) { UI.toast('Stage name required', 'error'); return; }
-
- var stageMode = document.getElementById('twfStageMode').value;
- var formTemplate = null;
-
- if (stageMode === 'form_only' || stageMode === 'form_chat') {
- var jsonToggle = document.getElementById('twfFormJsonToggle');
- if (jsonToggle && jsonToggle.checked) {
- var formRaw = document.getElementById('twfStageForm').value.trim();
- if (formRaw) {
- try { formTemplate = JSON.parse(formRaw); }
- catch (e) { UI.toast('Invalid JSON in form template', 'error'); return; }
- }
- } else {
- formTemplate = _twfBuildFormTemplateFromUI();
- }
- if (!formTemplate || !formTemplate.fields || formTemplate.fields.length === 0) {
- UI.toast('Form modes require at least one form field', 'error');
- return;
- }
- } else {
- var formRaw = document.getElementById('twfStageForm').value.trim();
- if (formRaw) {
- try { formTemplate = JSON.parse(formRaw); }
- catch (e) { UI.toast('Invalid JSON in form template', 'error'); return; }
- }
- }
-
- var personaId = document.getElementById('twfStagePersona').value || null;
-
- var data = {
- name: name,
- history_mode: document.getElementById('twfStageHistory').value,
- stage_mode: stageMode,
- persona_id: personaId,
- form_template: formTemplate,
- };
-
- try {
- if (_editingStageId) {
- await API.updateTeamWorkflowStage(teamId, _currentWf.id, _editingStageId, data);
- } else {
- data.ordinal = document.querySelectorAll('#twfStageList .wf-stage-row').length;
- await API.createTeamWorkflowStage(teamId, _currentWf.id, data);
- }
- UI.toast('Stage saved', 'success');
- document.getElementById('twfStageEditor').style.display = 'none';
- _editingStageId = null;
- await _twfLoadStages(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- };
- }
-
- // ── Edit / Delete Stage ─────────────────
-
- sb.register('_twfEditStage', async function(stageId) {
- if (!_currentWf) return;
- var teamId = _getTeamId();
- try {
- var resp = await API.listTeamWorkflowStages(teamId, _currentWf.id);
- var stages = resp.data || resp || [];
- var stage = stages.find(function(s) { return s.id === stageId; });
- if (!stage) return;
-
- _editingStageId = stageId;
- document.getElementById('twfStageName').value = stage.name;
- document.getElementById('twfStageHistory').value = stage.history_mode || 'full';
- document.getElementById('twfStageMode').value = stage.stage_mode || 'chat_only';
- await _twfLoadPersonaSelect(stage.persona_id || '');
-
- var tpl = stage.form_template;
- document.getElementById('twfStageForm').value = tpl ? JSON.stringify(tpl, null, 2) : '';
- _twfPopulateFormBuilder(tpl);
- _twfUpdateFormBuilderVisibility();
-
- document.getElementById('twfStageEditor').style.display = '';
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- });
-
- sb.register('_twfDeleteStage', async function(stageId) {
- if (!_currentWf) return;
- if (!confirm('Delete this stage?')) return;
- var teamId = _getTeamId();
- try {
- await API.deleteTeamWorkflowStage(teamId, _currentWf.id, stageId);
- UI.toast('Stage deleted', 'success');
- await _twfLoadStages(_currentWf.id);
- } catch (e) {
- UI.toast('Failed: ' + e.message, 'error');
- }
- });
-
- // ── Form Builder Helpers ────────────────
-
- var FIELD_TYPES = ['text', 'email', 'number', 'date', 'textarea', 'select', 'checkbox', 'file'];
-
- function _twfUpdateFormBuilderVisibility() {
- var mode = document.getElementById('twfStageMode').value;
- var wrap = document.getElementById('twfFormBuilderWrap');
- if (wrap) wrap.style.display = (mode === 'form_only' || mode === 'form_chat') ? '' : 'none';
- }
-
- function _twfCreateFieldRow(field) {
- field = field || { key: '', type: 'text', label: '', required: false };
- var row = document.createElement('div');
- row.className = 'wf-field-row';
- row.innerHTML =
- '' +
- '' +
- '' +
- '' +
- '';
-
- row.querySelector('.wf-fb-del').onclick = function() {
- row.remove();
- _twfSyncFormJSON();
- };
-
- row.querySelector('.wf-fb-type').onchange = function() {
- var optWrap = row.querySelector('.wf-fb-options');
- if (this.value === 'select') {
- if (!optWrap) {
- optWrap = document.createElement('div');
- optWrap.className = 'wf-fb-options';
- optWrap.style.cssText = 'margin:4px 0 0 28px;font-size:12px';
- optWrap.innerHTML = '';
- row.appendChild(optWrap);
- }
- optWrap.style.display = '';
- } else if (optWrap) {
- optWrap.style.display = 'none';
- }
- _twfSyncFormJSON();
- };
-
- if (field.type === 'select') {
- var optWrap = document.createElement('div');
- optWrap.className = 'wf-fb-options';
- optWrap.style.cssText = 'margin:4px 0 0 28px;font-size:12px';
- optWrap.innerHTML = '';
- row.appendChild(optWrap);
- }
-
- row.querySelectorAll('input, select').forEach(function(el) {
- el.addEventListener('change', _twfSyncFormJSON);
- el.addEventListener('input', _twfSyncFormJSON);
- });
-
- return row;
- }
-
- function _twfPopulateFormBuilder(tpl) {
- var container = document.getElementById('twfFormFields');
- if (!container) return;
- container.innerHTML = '';
- if (!tpl || !tpl.fields || !Array.isArray(tpl.fields)) return;
- tpl.fields.forEach(function(f) {
- if (typeof f === 'string') {
- f = { key: f, type: 'text', label: f, required: false };
- }
- container.appendChild(_twfCreateFieldRow(f));
- });
- }
-
- function _twfBuildFormTemplateFromUI() {
- var container = document.getElementById('twfFormFields');
- if (!container) return null;
- var rows = container.querySelectorAll('.wf-field-row');
- if (rows.length === 0) return null;
-
- var fields = [];
- rows.forEach(function(row) {
- var key = row.querySelector('.wf-fb-key').value.trim();
- var type = row.querySelector('.wf-fb-type').value;
- var label = row.querySelector('.wf-fb-label').value.trim();
- var required = row.querySelector('.wf-fb-required').checked;
- if (!key) return;
-
- var field = { key: key, type: type, label: label || key, required: required };
-
- if (type === 'select') {
- var optsInput = row.querySelector('.wf-fb-opts-input');
- if (optsInput && optsInput.value.trim()) {
- field.options = optsInput.value.split(',').map(function(s) {
- s = s.trim();
- return { value: s, label: s };
- }).filter(function(o) { return o.value; });
- }
- }
- fields.push(field);
- });
-
- return fields.length > 0 ? { fields: fields } : null;
- }
-
- function _twfSyncFormJSON() {
- var jsonToggle = document.getElementById('twfFormJsonToggle');
- if (!jsonToggle) return;
- var tpl = _twfBuildFormTemplateFromUI();
- document.getElementById('twfStageForm').value = tpl ? JSON.stringify(tpl, null, 2) : '';
- }
-
- function _twfWireFormBuilder() {
- var modeSelect = document.getElementById('twfStageMode');
- if (modeSelect) {
- modeSelect.onchange = _twfUpdateFormBuilderVisibility;
- }
-
- var addBtn = document.getElementById('twfAddFieldBtn');
- if (addBtn) {
- addBtn.onclick = function() {
- var container = document.getElementById('twfFormFields');
- if (container) {
- container.appendChild(_twfCreateFieldRow());
- _twfSyncFormJSON();
- }
- };
- }
-
- var jsonToggle = document.getElementById('twfFormJsonToggle');
- if (jsonToggle) {
- jsonToggle.onchange = function() {
- var textarea = document.getElementById('twfStageForm');
- if (this.checked) {
- _twfSyncFormJSON();
- textarea.style.display = '';
- } else {
- var raw = textarea.value.trim();
- if (raw) {
- try {
- var tpl = JSON.parse(raw);
- _twfPopulateFormBuilder(tpl);
- } catch (e) {
- UI.toast('Invalid JSON — fix before switching to visual mode', 'error');
- this.checked = true;
- return;
- }
- }
- textarea.style.display = 'none';
- }
- };
- }
- }
-
-})();