@@ -292,10 +311,13 @@
Salesforce
-
+
+
+
+
+
No credential fields for this connector.
'; + return; + } + fields.forEach((f) => { + const wrap = document.createElement('div'); + wrap.className = 'field-group'; + const alreadySet = existing.has(f.key); + const label = document.createElement('label'); + label.setAttribute('for', `cfg-secret-${f.key}`); + label.textContent = + f.label + (f.required && !alreadySet ? ' *' : '') + (alreadySet ? ' (saved)' : ''); + let input; + if (f.type === 'textarea') { + input = document.createElement('textarea'); + input.rows = 5; + } else { + input = document.createElement('input'); + input.type = 'text'; + } + input.id = `cfg-secret-${f.key}`; + input.dataset.secretKey = f.key; + input.dataset.alreadySet = alreadySet ? '1' : '0'; + input.autocomplete = 'off'; + input.value = ''; + if (alreadySet) { + input.placeholder = '(already set — leave blank to keep)'; + } else if (f.required) { + input.placeholder = 'Required'; + } + wrap.appendChild(label); + wrap.appendChild(input); + host.appendChild(wrap); + }); + if ([...existing].some((k) => fields.some((f) => f.key === k))) { + const hint = document.createElement('p'); + hint.className = 'field-help'; + hint.textContent = + 'Blank credential fields keep the previously saved value. Only type a field to change it.'; + host.appendChild(hint); + } + } + + function collectSecretFields() { + const host = document.getElementById('cfg-secret-fields'); + const secrets = {}; + if (!host) return secrets; + host.querySelectorAll('[data-secret-key]').forEach((el) => { + const key = el.dataset.secretKey; + const val = (el.value || '').trim(); + if (key && val) secrets[key] = val; + }); + return secrets; + } + + async function refreshConfigDropdown(modeOrConnectorId) { + if (!_multitenancyEnabled) return; + const tenantId = getPlaygroundTenantId(); + const select = document.getElementById('playground-config-name'); + if (!select) return; + const previous = select.value; + select.innerHTML = ''; + if (!tenantId) return; + + const connectorId = + _modeToConnectorId[modeOrConnectorId] || + (Object.values(_modeToConnectorId).includes(modeOrConnectorId) + ? modeOrConnectorId + : currentConnectorId()); + if (!connectorId) return; + + const headers = { 'Content-Type': 'application/json', 'X-Tenant-ID': tenantId }; + try { + const res = await fetch( + `/v1/connectors/${encodeURIComponent(connectorId)}/configs`, + { headers } + ); + if (!res.ok) return; + const data = await res.json(); + const configs = Array.isArray(data.configs) + ? data.configs + : Array.isArray(data) + ? data + : []; + let matched = false; + configs.forEach((cfg) => { + const opt = document.createElement('option'); + opt.value = cfg.name || ''; + opt.textContent = cfg.name + (cfg.default ? ' (default)' : ''); + select.appendChild(opt); + if (previous && opt.value === previous) matched = true; + }); + if (previous && matched) { + select.value = previous; + } else if (previous && !matched) { + // Clear stale name from another connector (e.g. Drive → Epic). + select.value = ''; + } else { + const def = configs.find((c) => c.default); + if (def) select.value = def.name || ''; + } + } catch (_) { + // ignore + } + } + + function getPlaygroundTenantId() { + if (!_multitenancyEnabled) return ''; + const el = document.getElementById('playground-tenant-id'); + return (el && el.value ? el.value : '').trim(); + } + + function getPlaygroundConfigName() { + if (!_multitenancyEnabled) return ''; + const el = document.getElementById('playground-config-name'); + return (el && el.value ? el.value : '').trim(); + } + + loadFeatureFlags(); + + function logTenancyContext(actionLabel) { + if (!_multitenancyEnabled) return; + const tenantId = getPlaygroundTenantId(); + const configName = getPlaygroundConfigName(); + const label = actionLabel ? `${actionLabel} — ` : ''; + log( + `${label}Tenant: ${tenantId || '(missing)'} | Config: ${configName || '(default)'}`, + 'system' + ); + } + + function playgroundRequestHeaders(extra = {}) { + const headers = { 'Content-Type': 'application/json', ...extra }; + if (!_multitenancyEnabled) return headers; + const tenantId = getPlaygroundTenantId(); + if (tenantId) { + headers['X-Tenant-ID'] = tenantId; + } + return headers; + } + + function withTenancyQuery(endpoint) { + if (!_multitenancyEnabled) return endpoint; + const configName = getPlaygroundConfigName(); + if (!configName) return endpoint; + const sep = endpoint.includes('?') ? '&' : '?'; + return `${endpoint}${sep}config_name=${encodeURIComponent(configName)}`; + } + async function handleSubmission(payload, endpoint, btn, btnLbl, spinner, resetText, pipelineLabelOverride = null) { resetUI(pipelineLabelOverride); @@ -787,22 +1374,36 @@ document.addEventListener('DOMContentLoaded', () => { btnLbl.textContent = 'Orchestrating...'; log(`Initiating intelligent ${currentMode.toUpperCase()} orchestration...`, 'system'); + logTenancyContext(currentMode.toUpperCase()); + const configName = getPlaygroundConfigName(); + if (configName) { + payload = { ...payload, config_name: configName }; + } + const firstNode = nodes.find((n) => n && !n.classList.contains('hidden')); if (firstNode) firstNode.classList.add('active'); try { - const response = await fetch(endpoint, { + const response = await fetch(withTenancyQuery(endpoint), { method: 'POST', - headers: { 'Content-Type': 'application/json' }, + headers: playgroundRequestHeaders(), body: JSON.stringify(payload) }); - if (!response.ok) throw new Error(`Server returned ${response.status}`); + const data = await response.json().catch(() => ({})); - const data = await response.json(); - traceDisplay.textContent = data.trace_id.toUpperCase(); + if (!response.ok) { + const detail = data.detail || data.message || `Server returned ${response.status}`; + let msg = typeof detail === 'string' ? detail : JSON.stringify(detail); + if (response.status === 403 && /No connector configuration/i.test(msg)) { + msg = `${msg} Open Add config on this connector page.`; + } + throw new Error(msg); + } - for (let i = 0; i < data.steps.length; i++) { + traceDisplay.textContent = (data.trace_id || '').toUpperCase() || '—'; + + for (let i = 0; i < (data.steps || []).length; i++) { const step = data.steps[i]; const node = nodes[i]; if (!node) continue; @@ -1250,6 +1851,135 @@ document.addEventListener('DOMContentLoaded', () => { } }); + // --- Per-connector runtime config CRUD --- + const addConfigBtn = document.getElementById('add-config-btn'); + const connectorAddConfigBtn = document.getElementById('connector-add-config-btn'); + + function modalTenantId() { + const fromModal = (_cfgTenantInput && _cfgTenantInput.value ? _cfgTenantInput.value : '').trim(); + return fromModal || getPlaygroundTenantId(); + } + + async function cfgFetchFor(connectorId, method, path = '', body = null, tenantOverride = null) { + const tenantId = (tenantOverride || getPlaygroundTenantId() || '').trim(); + if (!tenantId) { + throw new Error('Set Tenant ID before managing configs (e.g. acme).'); + } + const opts = { + method, + headers: { 'Content-Type': 'application/json', 'X-Tenant-ID': tenantId }, + }; + if (body != null) { + opts.body = JSON.stringify(body); + } + const response = await fetch( + `/v1/connectors/${encodeURIComponent(connectorId)}/configs${path}`, + opts + ); + const data = await response.json().catch(() => ({})); + if (!response.ok) { + const detail = data.detail || `HTTP ${response.status}`; + throw new Error(typeof detail === 'string' ? detail : JSON.stringify(detail)); + } + return data; + } + + if (addConfigBtn) { + addConfigBtn.addEventListener('click', () => { + openConfigAdminModal(); + }); + } + if (connectorAddConfigBtn) { + connectorAddConfigBtn.addEventListener('click', () => { + openConfigAdminModal(); + }); + } + + document.getElementById('config-admin-close')?.addEventListener('click', () => { + closeConfigAdminModal(); + }); + + document.getElementById('config-admin-modal')?.addEventListener('click', (ev) => { + if (ev.target && ev.target.hasAttribute('data-config-admin-dismiss')) { + closeConfigAdminModal(); + } + }); + + document.addEventListener('keydown', (ev) => { + if (ev.key !== 'Escape') return; + const modal = document.getElementById('config-admin-modal'); + if (modal && !modal.classList.contains('hidden')) { + closeConfigAdminModal(); + } + }); + + document.getElementById('cfg-create')?.addEventListener('click', async () => { + setConfigAdminError(''); + try { + const connectorId = currentConnectorId(); + if (!connectorId) throw new Error('Open a connector page first.'); + const tenantId = modalTenantId(); + if (!tenantId) throw new Error('Tenant ID is required'); + const name = modalSelectedConfigName(); + if (!name) throw new Error('Config name is required'); + const isDefault = document.getElementById('cfg-default')?.value === 'true'; + const secrets = collectSecretFields(); + const tmpl = _connectorCreateDocs[connectorId] || { config: {}, auth: {} }; + const body = { + name, + default: isDefault, + config: tmpl.config || {}, + auth: tmpl.auth || {}, + secrets, + }; + logTenancyContext(`Config SAVE ${connectorId}`); + await cfgFetchFor(connectorId, 'POST', '', body, tenantId); + ensureTenantOption(tenantId, true); + await refreshTenantDropdown(); + ensureTenantOption(tenantId, true); + await refreshConfigDropdown(currentMode); + const headerCfg = document.getElementById('playground-config-name'); + if (headerCfg) headerCfg.value = name; + await refreshModalConfigSelect(tenantId, connectorId, name); + await applyModalConfigSelection(connectorId); + log(`Saved config '${name}' for ${connectorId} / tenant '${tenantId}'`, 'success'); + } catch (err) { + setConfigAdminError(err.message); + log(`Config save failed: ${err.message}`, 'error'); + } + }); + + document.getElementById('cfg-delete')?.addEventListener('click', async () => { + setConfigAdminError(''); + try { + const connectorId = currentConnectorId(); + if (!connectorId) throw new Error('Open a connector page first.'); + const tenantId = modalTenantId(); + const name = modalSelectedConfigName(); + if (!name) throw new Error('Config name is required'); + const newDefault = name === 'default' ? '' : 'default'; + const q = newDefault ? `?new_default=${encodeURIComponent(newDefault)}` : ''; + await cfgFetchFor( + connectorId, + 'DELETE', + `/${encodeURIComponent(name)}${q}`, + null, + tenantId + ); + log(`Deleted config '${name}' for ${connectorId} / tenant '${tenantId}'`, 'success'); + const configSelect = document.getElementById('playground-config-name'); + if (configSelect && configSelect.value === name) { + configSelect.value = ''; + } + await refreshConfigDropdown(currentMode); + await refreshModalConfigSelect(tenantId, connectorId, ''); + await applyModalConfigSelection(connectorId); + } catch (err) { + setConfigAdminError(err.message); + log(`Config delete failed: ${err.message}`, 'error'); + } + }); + if (slackActionSelect) { slackActionSelect.addEventListener('change', () => { const action = slackActionSelect.value; @@ -1557,9 +2287,13 @@ document.addEventListener('DOMContentLoaded', () => { } startRunningTimer(); - const response = await fetch('/scenarios/agent-chat-stream', { + if (_multitenancyEnabled && !getPlaygroundTenantId()) { + throw new Error('Tenant ID is required when multitenancy is enabled'); + } + logTenancyContext('Agent chat (stream)'); + const response = await fetch(withTenancyQuery('/scenarios/agent-chat-stream'), { method: 'POST', - headers: { 'Content-Type': 'application/json' }, + headers: playgroundRequestHeaders(), body: JSON.stringify({ message: message, history: agentConversationHistory.slice(0, -1) @@ -1637,9 +2371,13 @@ document.addEventListener('DOMContentLoaded', () => { return; } - const response = await fetch('/scenarios/agent-chat', { + if (_multitenancyEnabled && !getPlaygroundTenantId()) { + throw new Error('Tenant ID is required when multitenancy is enabled'); + } + logTenancyContext('Agent chat'); + const response = await fetch(withTenancyQuery('/scenarios/agent-chat'), { method: 'POST', - headers: { 'Content-Type': 'application/json' }, + headers: playgroundRequestHeaders(), body: JSON.stringify({ message: message, history: agentConversationHistory.slice(0, -1) // Exclude current message (already in payload) diff --git a/playground/index.html b/playground/index.html index 0882d126..6bf17cf4 100644 --- a/playground/index.html +++ b/playground/index.html @@ -54,6 +54,23 @@