@agenticmail/enterprise 0.5.301 → 0.5.302

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,96 @@
1
+ import { h, useState, useEffect, Fragment, apiCall } from './utils.js';
2
+ import { I } from './icons.js';
3
+
4
+ /**
5
+ * OrgContextSwitcher — Global org context picker for multi-tenant pages.
6
+ *
7
+ * Props:
8
+ * onOrgChange(orgId, org) — called when org selection changes
9
+ * selectedOrgId — currently selected org ID ('' = my org)
10
+ * style — optional container style override
11
+ * showLabel — show "Viewing:" label (default true)
12
+ *
13
+ * The component loads client_organizations from the API and renders a
14
+ * compact dropdown that switches between "My Organization" and client orgs.
15
+ */
16
+ export function OrgContextSwitcher(props) {
17
+ var onOrgChange = props.onOrgChange;
18
+ var selectedOrgId = props.selectedOrgId || '';
19
+ var showLabel = props.showLabel !== false;
20
+ var style = props.style || {};
21
+
22
+ var _orgs = useState([]);
23
+ var orgs = _orgs[0]; var setOrgs = _orgs[1];
24
+ var _loaded = useState(false);
25
+ var loaded = _loaded[0]; var setLoaded = _loaded[1];
26
+
27
+ useEffect(function() {
28
+ apiCall('/organizations').then(function(d) {
29
+ setOrgs(d.organizations || []);
30
+ setLoaded(true);
31
+ }).catch(function() { setLoaded(true); });
32
+ }, []);
33
+
34
+ // Don't render if no client orgs exist
35
+ if (loaded && orgs.length === 0) return null;
36
+ if (!loaded) return null;
37
+
38
+ var selectedOrg = orgs.find(function(o) { return o.id === selectedOrgId; });
39
+
40
+ return h('div', {
41
+ style: Object.assign({
42
+ display: 'flex', alignItems: 'center', gap: 10, padding: '8px 14px',
43
+ background: 'var(--bg-tertiary)', borderRadius: 'var(--radius, 8px)',
44
+ marginBottom: 16, fontSize: 13
45
+ }, style)
46
+ },
47
+ showLabel && h('span', { style: { color: 'var(--text-muted)', fontWeight: 600, whiteSpace: 'nowrap' } }, I.building(), ' Viewing:'),
48
+ h('select', {
49
+ value: selectedOrgId,
50
+ onChange: function(e) {
51
+ var id = e.target.value;
52
+ var org = orgs.find(function(o) { return o.id === id; });
53
+ onOrgChange(id, org || null);
54
+ },
55
+ style: {
56
+ padding: '6px 10px', borderRadius: 6, border: '1px solid var(--border)',
57
+ background: 'var(--bg-card)', color: 'var(--text)', fontSize: 13,
58
+ cursor: 'pointer', fontWeight: 600, flex: 1, maxWidth: 300
59
+ }
60
+ },
61
+ h('option', { value: '' }, 'My Organization'),
62
+ orgs.filter(function(o) { return o.is_active !== false; }).map(function(o) {
63
+ return h('option', { key: o.id, value: o.id }, o.name + (o.billing_rate_per_agent > 0 ? ' (' + (o.currency || 'USD') + ' ' + parseFloat(o.billing_rate_per_agent).toFixed(0) + '/agent)' : ''));
64
+ })
65
+ ),
66
+ selectedOrg && h('span', { style: { fontSize: 11, color: 'var(--text-muted)' } },
67
+ selectedOrg.contact_name ? selectedOrg.contact_name : '',
68
+ selectedOrg.contact_email ? ' \u2022 ' + selectedOrg.contact_email : ''
69
+ )
70
+ );
71
+ }
72
+
73
+ /**
74
+ * useOrgContext — Hook that provides org switching state.
75
+ * Returns [selectedOrgId, selectedOrg, onOrgChange, OrgSwitcher component]
76
+ */
77
+ export function useOrgContext() {
78
+ var _sel = useState('');
79
+ var selectedOrgId = _sel[0]; var setSelectedOrgId = _sel[1];
80
+ var _org = useState(null);
81
+ var selectedOrg = _org[0]; var setSelectedOrg = _org[1];
82
+
83
+ var onOrgChange = function(id, org) {
84
+ setSelectedOrgId(id);
85
+ setSelectedOrg(org);
86
+ };
87
+
88
+ var Switcher = function(extraProps) {
89
+ return h(OrgContextSwitcher, Object.assign({
90
+ selectedOrgId: selectedOrgId,
91
+ onOrgChange: onOrgChange
92
+ }, extraProps || {}));
93
+ };
94
+
95
+ return { selectedOrgId: selectedOrgId, selectedOrg: selectedOrg, onOrgChange: onOrgChange, Switcher: Switcher };
96
+ }
@@ -3,6 +3,7 @@ import { I } from '../components/icons.js';
3
3
  import { E } from '../assets/icons/emoji-icons.js';
4
4
  import { CULTURES, LANGUAGES, PersonaForm } from '../components/persona-fields.js';
5
5
  import { HelpButton } from '../components/help-button.js';
6
+ import { useOrgContext } from '../components/org-switcher.js';
6
7
 
7
8
  // ════════════════════════════════════════════════════════════
8
9
  // DEPLOY MODAL
@@ -1127,6 +1128,7 @@ export function CreateAgentWizard({ onClose, onCreated, toast }) {
1127
1128
  export function AgentsPage({ onSelectAgent }) {
1128
1129
  const app = useApp();
1129
1130
  const toast = app.toast;
1131
+ var orgCtx = useOrgContext();
1130
1132
  const [agents, setAgents] = useState([]);
1131
1133
  const [creating, setCreating] = useState(false);
1132
1134
 
@@ -1138,9 +1140,13 @@ export function AgentsPage({ onSelectAgent }) {
1138
1140
  if (allowedAgents !== '*' && Array.isArray(allowedAgents)) {
1139
1141
  all = all.filter(a => allowedAgents.indexOf(a.id) >= 0);
1140
1142
  }
1143
+ // Filter by selected org context
1144
+ if (orgCtx.selectedOrgId) {
1145
+ all = all.filter(a => a.client_org_id === orgCtx.selectedOrgId);
1146
+ }
1141
1147
  setAgents(all);
1142
1148
  }).catch(() => {});
1143
- useEffect(() => { load(); }, []);
1149
+ useEffect(() => { load(); }, [orgCtx.selectedOrgId]);
1144
1150
 
1145
1151
  // Delete moved to agent detail overview tab with triple confirmation
1146
1152
 
@@ -1149,6 +1155,7 @@ export function AgentsPage({ onSelectAgent }) {
1149
1155
  var _tip = { marginTop: 12, padding: 12, background: 'var(--bg-secondary, #1e293b)', borderRadius: 'var(--radius, 8px)', fontSize: 13 };
1150
1156
 
1151
1157
  return h(Fragment, null,
1158
+ h(orgCtx.Switcher),
1152
1159
  h('div', { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 20 } },
1153
1160
  h('div', null, h('h1', { style: { fontSize: 20, fontWeight: 700, display: 'flex', alignItems: 'center' } }, 'Agents', h(HelpButton, { label: 'Agents' },
1154
1161
  h('p', null, 'Your AI workforce. Each agent has its own email identity, personality, skills, permissions, and deployment target.'),
@@ -1,8 +1,11 @@
1
1
  import { h, useState, useEffect, Fragment, useApp, engineCall, showConfirm, buildAgentEmailMap, buildAgentDataMap, resolveAgentEmail, renderAgentBadge, getOrgId } from '../components/utils.js';
2
2
  import { I } from '../components/icons.js';
3
3
  import { HelpButton } from '../components/help-button.js';
4
+ import { useOrgContext } from '../components/org-switcher.js';
4
5
 
5
6
  export function ApprovalsPage() {
7
+ var orgCtx = useOrgContext();
8
+ var effectiveOrgId = orgCtx.selectedOrgId || getOrgId();
6
9
  const { toast } = useApp();
7
10
  const [pending, setPending] = useState([]);
8
11
  const [history, setHistory] = useState([]);
@@ -13,7 +16,7 @@ export function ApprovalsPage() {
13
16
  const load = () => {
14
17
  engineCall('/approvals/pending').then(d => setPending(d.requests || [])).catch(() => {});
15
18
  engineCall('/approvals/history?limit=50').then(d => setHistory(d.requests || [])).catch(() => {});
16
- engineCall('/agents?orgId=' + getOrgId()).then(d => setAgents(d.agents || [])).catch(() => {});
19
+ engineCall('/agents?orgId=' + effectiveOrgId).then(d => setAgents(d.agents || [])).catch(() => {});
17
20
  };
18
21
  useEffect(() => { load(); }, []);
19
22
 
@@ -33,6 +36,7 @@ export function ApprovalsPage() {
33
36
  var _tip = { marginTop: 12, padding: 12, background: 'var(--bg-secondary, #1e293b)', borderRadius: 'var(--radius, 8px)', fontSize: 13 };
34
37
 
35
38
  return h(Fragment, null,
39
+ h(orgCtx.Switcher),
36
40
  h('div', { style: { marginBottom: 20 } },
37
41
  h('h1', { style: { fontSize: 20, fontWeight: 700, display: 'flex', alignItems: 'center' } }, 'Approvals', h(HelpButton, { label: 'Approvals' },
38
42
  h('p', null, 'The human-in-the-loop checkpoint. When agents attempt sensitive actions (based on your permission settings), they pause and wait for your approval here.'),
@@ -2,6 +2,7 @@ import { h, useState, useEffect, Fragment, buildAgentEmailMap, buildAgentDataMap
2
2
  import { I } from '../components/icons.js';
3
3
  import { DetailModal } from '../components/modal.js';
4
4
  import { HelpButton } from '../components/help-button.js';
5
+ import { useOrgContext } from '../components/org-switcher.js';
5
6
 
6
7
  export function SetupChecklist({ onNavigate }) {
7
8
  const [status, setStatus] = useState(null);
@@ -46,6 +47,8 @@ export function SetupChecklist({ onNavigate }) {
46
47
  }
47
48
 
48
49
  export function DashboardPage() {
50
+ var orgCtx = useOrgContext();
51
+ var effectiveOrgId = orgCtx.selectedOrgId || effectiveOrgId;
49
52
  const [stats, setStats] = useState(null);
50
53
  const [agents, setAgents] = useState([]);
51
54
  const [events, setEvents] = useState([]);
@@ -58,9 +61,9 @@ export function DashboardPage() {
58
61
  useEffect(() => {
59
62
  apiCall('/stats').then(setStats).catch(() => {});
60
63
  apiCall('/agents').then(d => setAgents(d.agents || d || [])).catch(() => {});
61
- engineCall('/agents?orgId=' + getOrgId()).then(d => setEngineAgents(d.agents || [])).catch(() => {});
64
+ engineCall('/agents?orgId=' + effectiveOrgId).then(d => setEngineAgents(d.agents || [])).catch(() => {});
62
65
  engineCall('/activity/events?limit=10').then(d => setEvents(d.events || [])).catch(() => {});
63
- }, []);
66
+ }, [effectiveOrgId]);
64
67
 
65
68
  // Merge admin + engine agents; engine agents (appended last) win in the data map
66
69
  var mergedForMap = [].concat(agents, engineAgents);
@@ -73,6 +76,7 @@ export function DashboardPage() {
73
76
  var _tip = { marginTop: 12, padding: 12, background: 'var(--bg-secondary, #1e293b)', borderRadius: 'var(--radius, 8px)', fontSize: 13 };
74
77
 
75
78
  return h(Fragment, null,
79
+ h(orgCtx.Switcher),
76
80
  h(SetupChecklist, { onNavigate: function(pg) { if (navTo) navTo(pg); } }),
77
81
  h('div', { className: 'stat-grid' },
78
82
  h('div', { className: 'stat-card' }, h('div', { className: 'stat-label', style: { display: 'flex', alignItems: 'center' } }, 'Total Agents', h(HelpButton, { label: 'Total Agents' },
@@ -1,6 +1,7 @@
1
1
  import { h, useState, useEffect, useCallback, Fragment, useApp, engineCall, buildAgentEmailMap, resolveAgentEmail, buildAgentDataMap, renderAgentBadge, getOrgId } from '../components/utils.js';
2
2
  import { I } from '../components/icons.js';
3
3
  import { HelpButton } from '../components/help-button.js';
4
+ import { useOrgContext } from '../components/org-switcher.js';
4
5
 
5
6
  // ─── Constants ──────────────────────────────────────────
6
7
 
@@ -93,6 +94,8 @@ function EmptyState(props) {
93
94
  // ─── Main Page ──────────────────────────────────────────
94
95
 
95
96
  export function GuardrailsPage() {
97
+ var orgCtx = useOrgContext();
98
+ var effectiveOrgId = orgCtx.selectedOrgId || getOrgId();
96
99
  var app = useApp();
97
100
  var toast = app.toast;
98
101
  var tab = useState('overview');
@@ -101,7 +104,7 @@ export function GuardrailsPage() {
101
104
  var _ag = useState([]);
102
105
  var agents = _ag[0]; var setAgents = _ag[1];
103
106
  useEffect(function() {
104
- engineCall('/agents?orgId=' + getOrgId()).then(function(d) { setAgents(d.agents || []); }).catch(function() {});
107
+ engineCall('/agents?orgId=' + effectiveOrgId).then(function(d) { setAgents(d.agents || []); }).catch(function() {});
105
108
  }, []);
106
109
 
107
110
  var TABS = [
@@ -164,8 +167,8 @@ function OverviewTab(props) {
164
167
  var load = function() {
165
168
  setLoading(true);
166
169
  Promise.all([
167
- engineCall('/guardrails/interventions?orgId=' + getOrgId() + '&limit=10').catch(function() { return { interventions: [] }; }),
168
- engineCall('/policies?orgId=' + getOrgId()).catch(function() { return { policies: [] }; }),
170
+ engineCall('/guardrails/interventions?orgId=' + effectiveOrgId + '&limit=10').catch(function() { return { interventions: [] }; }),
171
+ engineCall('/policies?orgId=' + effectiveOrgId).catch(function() { return { policies: [] }; }),
169
172
  engineCall('/onboarding/org/default').catch(function() { return { progress: [] }; }),
170
173
  ]).then(function(res) {
171
174
  setInterventions(res[0].interventions || []);
@@ -203,6 +206,7 @@ function OverviewTab(props) {
203
206
  var typeColor = function(t) { return t === 'kill' ? '#ef4444' : t === 'pause' ? '#f59e0b' : t === 'resume' ? '#15803d' : '#0ea5e9'; };
204
207
 
205
208
  return h(Fragment, null,
209
+ h(orgCtx.Switcher),
206
210
  // Quick action bar
207
211
  h('div', { className: 'card', style: { marginBottom: 16 } },
208
212
  h('div', { className: 'card-body', style: { display: 'flex', gap: 8, alignItems: 'center', flexWrap: 'wrap' } },
@@ -282,17 +286,17 @@ function PoliciesTab() {
282
286
  var editPolicy = _edit[0]; var setEditPolicy = _edit[1];
283
287
  var _exp = useState(null);
284
288
  var expanded = _exp[0]; var setExpanded = _exp[1];
285
- var _form = useState({ orgId: getOrgId(), name: '', category: 'code_of_conduct', description: '', content: '', priority: 0, enforcement: 'mandatory', appliesTo: ['*'], tags: [], enabled: true });
289
+ var _form = useState({ orgId: effectiveOrgId, name: '', category: 'code_of_conduct', description: '', content: '', priority: 0, enforcement: 'mandatory', appliesTo: ['*'], tags: [], enabled: true });
286
290
  var form = _form[0]; var setForm = _form[1];
287
291
 
288
292
  var load = function() {
289
- engineCall('/policies?orgId=' + getOrgId()).then(function(d) { setPolicies(d.policies || []); }).catch(function() {});
293
+ engineCall('/policies?orgId=' + effectiveOrgId).then(function(d) { setPolicies(d.policies || []); }).catch(function() {});
290
294
  };
291
295
  useEffect(load, []);
292
296
 
293
297
  var openCreate = function() {
294
298
  setEditPolicy(null);
295
- setForm({ orgId: getOrgId(), name: '', category: 'code_of_conduct', description: '', content: '', priority: 0, enforcement: 'mandatory', appliesTo: ['*'], tags: [], enabled: true });
299
+ setForm({ orgId: effectiveOrgId, name: '', category: 'code_of_conduct', description: '', content: '', priority: 0, enforcement: 'mandatory', appliesTo: ['*'], tags: [], enabled: true });
296
300
  setShowModal(true);
297
301
  };
298
302
  var openEdit = function(p) {
@@ -314,7 +318,7 @@ function PoliciesTab() {
314
318
  .catch(function(e) { toast(e.message, 'error'); });
315
319
  };
316
320
  var applyDefaults = function() {
317
- engineCall('/policies/templates/apply', { method: 'POST', body: JSON.stringify({ orgId: getOrgId(), createdBy: 'admin' }) })
321
+ engineCall('/policies/templates/apply', { method: 'POST', body: JSON.stringify({ orgId: effectiveOrgId, createdBy: 'admin' }) })
318
322
  .then(function(d) { toast('Applied ' + (d.policies ? d.policies.length : 0) + ' default templates', 'success'); load(); })
319
323
  .catch(function(e) { toast(e.message, 'error'); });
320
324
  };
@@ -451,7 +455,7 @@ function OnboardingTab(props) {
451
455
 
452
456
  var initiate = function() {
453
457
  if (!initAgentId) { toast('Enter an agent ID', 'error'); return; }
454
- engineCall('/onboarding/initiate/' + initAgentId, { method: 'POST', body: JSON.stringify({ orgId: getOrgId() }) })
458
+ engineCall('/onboarding/initiate/' + initAgentId, { method: 'POST', body: JSON.stringify({ orgId: effectiveOrgId }) })
455
459
  .then(function() { toast('Onboarding initiated', 'success'); setInitAgentId(''); load(); })
456
460
  .catch(function(e) { toast(e.message, 'error'); });
457
461
  };
@@ -461,7 +465,7 @@ function OnboardingTab(props) {
461
465
  .catch(function(e) { toast(e.message, 'error'); });
462
466
  };
463
467
  var checkChanges = function() {
464
- engineCall('/onboarding/check-changes', { method: 'POST', body: JSON.stringify({ orgId: getOrgId() }) })
468
+ engineCall('/onboarding/check-changes', { method: 'POST', body: JSON.stringify({ orgId: effectiveOrgId }) })
465
469
  .then(function(d) {
466
470
  var stale = d.staleAgents || [];
467
471
  if (stale.length === 0) { toast('All agents up to date', 'success'); }
@@ -555,7 +559,7 @@ function MemoryTab(props) {
555
559
  var showCreate = _show[0]; var setShowCreate = _show[1];
556
560
  var _exp = useState(null);
557
561
  var expanded = _exp[0]; var setExpanded = _exp[1];
558
- var _form = useState({ agentId: '', orgId: getOrgId(), category: 'org_knowledge', title: '', content: '', source: 'admin', importance: 'normal', tags: [] });
562
+ var _form = useState({ agentId: '', orgId: effectiveOrgId, category: 'org_knowledge', title: '', content: '', source: 'admin', importance: 'normal', tags: [] });
559
563
  var form = _form[0]; var setForm = _form[1];
560
564
 
561
565
  var loadMemories = function(aid) {
@@ -762,13 +766,13 @@ function RulesTab(props) {
762
766
  var _showAnomaly = useState(false);
763
767
  var showAnomalyModal = _showAnomaly[0]; var setShowAnomalyModal = _showAnomaly[1];
764
768
  var _form = useState({
765
- orgId: getOrgId(), name: '', description: '', category: 'anomaly', ruleType: 'threshold',
769
+ orgId: effectiveOrgId, name: '', description: '', category: 'anomaly', ruleType: 'threshold',
766
770
  conditions: { threshold: 10, windowMinutes: 60 },
767
771
  action: 'alert', severity: 'medium', cooldownMinutes: 15, enabled: true
768
772
  });
769
773
  var form = _form[0]; var setForm = _form[1];
770
774
  var _anomalyForm = useState({
771
- orgId: getOrgId(), name: '', ruleType: 'error_rate',
775
+ orgId: effectiveOrgId, name: '', ruleType: 'error_rate',
772
776
  config: { maxErrorsPerHour: 50, windowMinutes: 60 }, action: 'pause', enabled: true
773
777
  });
774
778
  var anomalyForm = _anomalyForm[0]; var setAnomalyForm = _anomalyForm[1];
@@ -777,9 +781,9 @@ function RulesTab(props) {
777
781
 
778
782
  var load = function() {
779
783
  Promise.all([
780
- engineCall('/guardrails/rules?orgId=' + getOrgId()).catch(function() { return { rules: [] }; }),
781
- engineCall('/anomaly-rules?orgId=' + getOrgId()).catch(function() { return { rules: [] }; }),
782
- engineCall('/guardrails/interventions?orgId=' + getOrgId() + '&limit=50').catch(function() { return { interventions: [] }; }),
784
+ engineCall('/guardrails/rules?orgId=' + effectiveOrgId).catch(function() { return { rules: [] }; }),
785
+ engineCall('/anomaly-rules?orgId=' + effectiveOrgId).catch(function() { return { rules: [] }; }),
786
+ engineCall('/guardrails/interventions?orgId=' + effectiveOrgId + '&limit=50').catch(function() { return { interventions: [] }; }),
783
787
  ]).then(function(res) {
784
788
  setRules(res[0].rules || []);
785
789
  setAnomalyRules(res[1].rules || []);
@@ -791,7 +795,7 @@ function RulesTab(props) {
791
795
  // Guardrail rules CRUD
792
796
  var openCreateRule = function() {
793
797
  setEditRule(null);
794
- setForm({ orgId: getOrgId(), name: '', description: '', category: 'anomaly', ruleType: 'threshold', conditions: { threshold: 10, windowMinutes: 60 }, action: 'alert', severity: 'medium', cooldownMinutes: 15, enabled: true });
798
+ setForm({ orgId: effectiveOrgId, name: '', description: '', category: 'anomaly', ruleType: 'threshold', conditions: { threshold: 10, windowMinutes: 60 }, action: 'alert', severity: 'medium', cooldownMinutes: 15, enabled: true });
795
799
  setShowModal(true);
796
800
  };
797
801
  var openEditRule = function(r) {
@@ -1,8 +1,11 @@
1
1
  import { h, useState, useEffect, Fragment, useApp, engineCall, buildAgentEmailMap, buildAgentDataMap, resolveAgentEmail, renderAgentBadge, getOrgId } from '../components/utils.js';
2
2
  import { I } from '../components/icons.js';
3
3
  import { HelpButton } from '../components/help-button.js';
4
+ import { useOrgContext } from '../components/org-switcher.js';
4
5
 
5
6
  export function JournalPage() {
7
+ var orgCtx = useOrgContext();
8
+ var effectiveOrgId = orgCtx.selectedOrgId || getOrgId();
6
9
  const { toast } = useApp();
7
10
  const [entries, setEntries] = useState([]);
8
11
  const [total, setTotal] = useState(0);
@@ -11,9 +14,9 @@ export function JournalPage() {
11
14
  const [agents, setAgents] = useState([]);
12
15
 
13
16
  const load = () => {
14
- engineCall('/journal?orgId=' + getOrgId() + '&limit=50').then(d => { setEntries(d.entries || []); setTotal(d.total || 0); }).catch(() => {});
17
+ engineCall('/journal?orgId=' + effectiveOrgId + '&limit=50').then(d => { setEntries(d.entries || []); setTotal(d.total || 0); }).catch(() => {});
15
18
  engineCall('/journal/stats/default').then(d => setStats(d)).catch(() => {});
16
- engineCall('/agents?orgId=' + getOrgId()).then(d => setAgents(d.agents || [])).catch(() => {});
19
+ engineCall('/agents?orgId=' + effectiveOrgId).then(d => setAgents(d.agents || [])).catch(() => {});
17
20
  };
18
21
  useEffect(load, []);
19
22
 
@@ -29,6 +32,7 @@ export function JournalPage() {
29
32
  var _tip = { marginTop: 12, padding: 12, background: 'var(--bg-secondary, #1e293b)', borderRadius: 'var(--radius, 8px)', fontSize: 13 };
30
33
 
31
34
  return h('div', { className: 'page-inner' },
35
+ h(orgCtx.Switcher),
32
36
  h('div', { className: 'page-header' }, h('h1', { style: { display: 'flex', alignItems: 'center' } }, 'Action Journal', h(HelpButton, { label: 'Action Journal' },
33
37
  h('p', null, 'A tamper-proof log of every action agents have taken. Think of it as an audit trail — every tool call, every side effect, recorded with full context.'),
34
38
  h('h4', { style: _h4 }, 'Why it matters'),
@@ -2,9 +2,11 @@ import { h, useState, useEffect, useCallback, Fragment, useApp, engineCall, buil
2
2
  import { I } from '../components/icons.js';
3
3
  import { Modal } from '../components/modal.js';
4
4
  import { HelpButton } from '../components/help-button.js';
5
+ import { useOrgContext } from '../components/org-switcher.js';
5
6
 
6
7
  export function KnowledgeContributionsPage() {
7
8
  var { toast } = useApp();
9
+ var orgCtx = useOrgContext();
8
10
  var [tab, setTab] = useState('bases');
9
11
  var [bases, setBases] = useState([]);
10
12
  var [roles, setRoles] = useState([]);
@@ -39,14 +41,17 @@ export function KnowledgeContributionsPage() {
39
41
  var [searchDays, setSearchDays] = useState(7);
40
42
  var [searchAgentFilter, setSearchAgentFilter] = useState('');
41
43
 
44
+ // Effective org ID: uses client org if selected, else default
45
+ var effectiveOrgId = orgCtx.selectedOrgId || effectiveOrgId;
46
+
42
47
  var loadBases = useCallback(function() {
43
48
  Promise.all([
44
- engineCall('/knowledge-contribution/bases?orgId=' + getOrgId()).catch(function() { return { bases: [] }; }),
49
+ engineCall('/knowledge-contribution/bases?orgId=' + effectiveOrgId).catch(function() { return { bases: [] }; }),
45
50
  engineCall('/knowledge-bases').catch(function() { return { knowledgeBases: [] }; })
46
51
  ]).then(function(results) {
47
52
  var contribBases = results[0].bases || [];
48
53
  var mainBases = (results[1].knowledgeBases || []).map(function(kb) {
49
- return { id: kb.id, orgId: getOrgId(), name: kb.name, description: kb.description, role: 'general', categories: [], contributorCount: 0, entryCount: kb.stats ? kb.stats.documentCount || 0 : 0, createdAt: kb.createdAt, updatedAt: kb.updatedAt, _source: 'main' };
54
+ return { id: kb.id, orgId: effectiveOrgId, name: kb.name, description: kb.description, role: 'general', categories: [], contributorCount: 0, entryCount: kb.stats ? kb.stats.documentCount || 0 : 0, createdAt: kb.createdAt, updatedAt: kb.updatedAt, _source: 'main' };
50
55
  });
51
56
  // Merge: contribution bases first, then main bases not already in contribution
52
57
  var ids = {};
@@ -63,19 +68,19 @@ export function KnowledgeContributionsPage() {
63
68
  }, []);
64
69
 
65
70
  var loadStats = useCallback(function() {
66
- engineCall('/knowledge-contribution/stats?orgId=' + getOrgId())
71
+ engineCall('/knowledge-contribution/stats?orgId=' + effectiveOrgId)
67
72
  .then(function(d) { setStats(d || {}); })
68
73
  .catch(function() {});
69
74
  }, []);
70
75
 
71
76
  var loadContributions = useCallback(function() {
72
- engineCall('/knowledge-contribution/contributions?orgId=' + getOrgId())
77
+ engineCall('/knowledge-contribution/contributions?orgId=' + effectiveOrgId)
73
78
  .then(function(d) { setContributions(d.contributions || d.cycles || []); })
74
79
  .catch(function() {});
75
80
  }, []);
76
81
 
77
82
  var loadSchedules = useCallback(function() {
78
- engineCall('/knowledge-contribution/schedules?orgId=' + getOrgId())
83
+ engineCall('/knowledge-contribution/schedules?orgId=' + effectiveOrgId)
79
84
  .then(function(d) { setSchedules(d.schedules || []); })
80
85
  .catch(function() {});
81
86
  }, []);
@@ -86,10 +91,10 @@ export function KnowledgeContributionsPage() {
86
91
  loadStats();
87
92
  loadContributions();
88
93
  loadSchedules();
89
- engineCall('/agents?orgId=' + getOrgId()).then(function(d) { setAgents(d.agents || []); }).catch(function() {});
94
+ engineCall('/agents?orgId=' + effectiveOrgId).then(function(d) { setAgents(d.agents || []); }).catch(function() {});
90
95
  }, [loadBases, loadRoles, loadStats, loadContributions, loadSchedules]);
91
96
 
92
- useEffect(function() { load(); }, [load]);
97
+ useEffect(function() { load(); }, [load, effectiveOrgId]);
93
98
 
94
99
  var loadBaseEntries = useCallback(function(baseId) {
95
100
  var params = new URLSearchParams();
@@ -110,7 +115,7 @@ export function KnowledgeContributionsPage() {
110
115
  try {
111
116
  await engineCall('/knowledge-contribution/bases', {
112
117
  method: 'POST',
113
- body: JSON.stringify({ name: baseForm.name, description: baseForm.description, role: baseForm.role, orgId: getOrgId() })
118
+ body: JSON.stringify({ name: baseForm.name, description: baseForm.description, role: baseForm.role, orgId: effectiveOrgId })
114
119
  });
115
120
  toast('Knowledge base created', 'success');
116
121
  setShowCreateBase(false);
@@ -161,7 +166,7 @@ export function KnowledgeContributionsPage() {
161
166
  try {
162
167
  await engineCall('/knowledge-contribution/contribute/' + triggerAgent, {
163
168
  method: 'POST',
164
- body: JSON.stringify({ targetBaseId: triggerBase || undefined, orgId: getOrgId() })
169
+ body: JSON.stringify({ targetBaseId: triggerBase || undefined, orgId: effectiveOrgId })
165
170
  });
166
171
  toast('Contribution triggered', 'success');
167
172
  setShowTrigger(false);
@@ -182,7 +187,7 @@ export function KnowledgeContributionsPage() {
182
187
  frequency: scheduleForm.frequency,
183
188
  dayOfWeek: scheduleForm.dayOfWeek,
184
189
  minConfidence: parseFloat(scheduleForm.minConfidence) || 0.7,
185
- orgId: getOrgId()
190
+ orgId: effectiveOrgId
186
191
  })
187
192
  });
188
193
  toast('Schedule created', 'success');
@@ -1375,6 +1380,9 @@ export function KnowledgeContributionsPage() {
1375
1380
  };
1376
1381
 
1377
1382
  return h(Fragment, null,
1383
+ // Org context switcher
1384
+ h(orgCtx.Switcher),
1385
+
1378
1386
  // Header
1379
1387
  h('div', { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 20 } },
1380
1388
  h('div', null,
@@ -1,14 +1,17 @@
1
- import { h, useState, useEffect, useCallback, Fragment, useApp, engineCall, getOrgId } from '../components/utils.js';
1
+ import { h, useState, useEffect, useCallback, Fragment, useApp, engineCall, apiCall, getOrgId } from '../components/utils.js';
2
2
  import { I } from '../components/icons.js';
3
3
  import { Modal } from '../components/modal.js';
4
4
  import { KnowledgeImportWizard, ImportJobsList } from './knowledge-import.js';
5
5
  import { HelpButton } from '../components/help-button.js';
6
+ import { useOrgContext } from '../components/org-switcher.js';
6
7
 
7
8
  export function KnowledgeBasePage() {
8
9
  const { toast } = useApp();
9
10
  const [kbs, setKbs] = useState([]);
10
11
  const [creating, setCreating] = useState(false);
11
- const [form, setForm] = useState({ name: '', description: '' });
12
+ const [form, setForm] = useState({ name: '', description: '', orgId: '' });
13
+ const [clientOrgs, setClientOrgs] = useState([]);
14
+ const orgCtx = useOrgContext();
12
15
  const [selected, setSelected] = useState(null); // full KB detail
13
16
  const [docs, setDocs] = useState([]);
14
17
  const [chunks, setChunks] = useState([]);
@@ -25,14 +28,20 @@ export function KnowledgeBasePage() {
25
28
 
26
29
  const load = useCallback(() => {
27
30
  engineCall('/knowledge-bases').then(d => setKbs(d.knowledgeBases || [])).catch(() => {});
31
+ apiCall('/organizations').then(d => setClientOrgs(d.organizations || [])).catch(() => {});
28
32
  }, []);
29
33
  useEffect(() => { load(); }, [load]);
30
34
 
35
+ // Filter KBs by selected org context
36
+ const filteredKbs = orgCtx.selectedOrgId
37
+ ? kbs.filter(kb => kb.orgId === orgCtx.selectedOrgId || kb.clientOrgId === orgCtx.selectedOrgId)
38
+ : kbs;
39
+
31
40
  const create = async () => {
32
41
  try {
33
- await engineCall('/knowledge-bases', { method: 'POST', body: JSON.stringify({ name: form.name, description: form.description, orgId: getOrgId() }) });
42
+ await engineCall('/knowledge-bases', { method: 'POST', body: JSON.stringify({ name: form.name, description: form.description, orgId: getOrgId(), clientOrgId: form.orgId || null }) });
34
43
  toast('Knowledge base created', 'success');
35
- setCreating(false); setForm({ name: '', description: '' }); load();
44
+ setCreating(false); setForm({ name: '', description: '', orgId: '' }); load();
36
45
  } catch (e) { toast(e.message, 'error'); }
37
46
  };
38
47
 
@@ -315,16 +324,29 @@ export function KnowledgeBasePage() {
315
324
  h('button', { className: 'btn btn-primary', onClick: () => setCreating(true) }, I.plus(), ' New Knowledge Base')
316
325
  ),
317
326
 
327
+ // Org context switcher
328
+ h(orgCtx.Switcher),
329
+
318
330
  creating && h(Modal, { title: 'Create Knowledge Base', onClose: () => setCreating(false), footer: h(Fragment, null, h('button', { className: 'btn btn-secondary', onClick: () => setCreating(false) }, 'Cancel'), h('button', { className: 'btn btn-primary', onClick: create, disabled: !form.name }, 'Create')) },
319
331
  h('div', { className: 'form-group' }, h('label', { className: 'form-label' }, 'Name'), h('input', { className: 'input', value: form.name, onChange: e => setForm(f => ({ ...f, name: e.target.value })) })),
320
- h('div', { className: 'form-group' }, h('label', { className: 'form-label' }, 'Description'), h('textarea', { className: 'input', value: form.description, onChange: e => setForm(f => ({ ...f, description: e.target.value })) }))
332
+ h('div', { className: 'form-group' }, h('label', { className: 'form-label' }, 'Description'), h('textarea', { className: 'input', value: form.description, onChange: e => setForm(f => ({ ...f, description: e.target.value })) })),
333
+ clientOrgs.length > 0 && h('div', { className: 'form-group' },
334
+ h('label', { className: 'form-label' }, 'Organization'),
335
+ h('select', { className: 'input', value: form.orgId, onChange: e => setForm(f => ({ ...f, orgId: e.target.value })) },
336
+ h('option', { value: '' }, 'My Organization (internal)'),
337
+ clientOrgs.filter(o => o.is_active !== false).map(o =>
338
+ h('option', { key: o.id, value: o.id }, o.name)
339
+ )
340
+ ),
341
+ h('div', { style: { fontSize: 11, color: 'var(--text-muted)', marginTop: 4 } }, 'Assign this knowledge base to a client organization for data isolation')
342
+ )
321
343
  ),
322
344
 
323
345
  loading && h('div', { style: { textAlign: 'center', padding: 40 } }, 'Loading...'),
324
346
 
325
- !loading && kbs.length === 0
326
- ? h('div', { className: 'card' }, h('div', { className: 'card-body' }, h('div', { className: 'empty-state' }, I.knowledge(), h('h3', null, 'No knowledge bases'), h('p', null, 'Create a knowledge base to give agents access to your documents, policies, and data.'))))
327
- : !loading && h('div', { style: { display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(300px, 1fr))', gap: 16 } }, kbs.map(kb =>
347
+ !loading && filteredKbs.length === 0
348
+ ? h('div', { className: 'card' }, h('div', { className: 'card-body' }, h('div', { className: 'empty-state' }, I.knowledge(), h('h3', null, orgCtx.selectedOrgId ? 'No knowledge bases for this organization' : 'No knowledge bases'), h('p', null, orgCtx.selectedOrgId ? 'Create a knowledge base assigned to this organization to get started.' : 'Create a knowledge base to give agents access to your documents, policies, and data.'))))
349
+ : !loading && h('div', { style: { display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(300px, 1fr))', gap: 16 } }, filteredKbs.map(kb =>
328
350
  h('div', { key: kb.id, className: 'card', style: { cursor: 'pointer', transition: 'border-color 0.15s' }, onClick: () => selectKb(kb) },
329
351
  h('div', { className: 'card-body' },
330
352
  h('h3', { style: { fontSize: 15, fontWeight: 600, marginBottom: 4 } }, kb.name),
@@ -332,7 +354,8 @@ export function KnowledgeBasePage() {
332
354
  h('div', { style: { display: 'flex', gap: 8, flexWrap: 'wrap' } },
333
355
  h('span', { className: 'badge badge-info' }, (kb.stats?.documentCount || kb.stats?.documents || kb.stats?.totalDocuments || kb.documents?.length || 0) + ' docs'),
334
356
  h('span', { className: 'badge badge-neutral' }, (kb.stats?.chunkCount || kb.stats?.chunks || kb.stats?.totalChunks || 0) + ' chunks'),
335
- kb.agentIds && kb.agentIds.length > 0 && h('span', { className: 'badge badge-success' }, kb.agentIds.length + ' agent(s)')
357
+ kb.agentIds && kb.agentIds.length > 0 && h('span', { className: 'badge badge-success' }, kb.agentIds.length + ' agent(s)'),
358
+ (function() { var org = kb.clientOrgId && clientOrgs.find(function(o) { return o.id === kb.clientOrgId; }); return org ? h('span', { className: 'badge', style: { background: 'var(--bg-secondary)', fontSize: 10 } }, I.building(), ' ', org.name) : null; })()
336
359
  ),
337
360
  h('div', { style: { display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginTop: 10 } },
338
361
  h('div', { style: { fontSize: 11, color: 'var(--text-muted)' } }, 'Click to view details \u2192'),
@@ -1,8 +1,11 @@
1
1
  import { h, useState, useEffect, useRef, Fragment, useApp, engineCall, buildAgentEmailMap, resolveAgentEmail, buildAgentDataMap, renderAgentBadge, getOrgId } from '../components/utils.js';
2
2
  import { I } from '../components/icons.js';
3
3
  import { HelpButton } from '../components/help-button.js';
4
+ import { useOrgContext } from '../components/org-switcher.js';
4
5
 
5
6
  export function MessagesPage() {
7
+ var orgCtx = useOrgContext();
8
+ var effectiveOrgId = orgCtx.selectedOrgId || getOrgId();
6
9
  const { toast } = useApp();
7
10
  const [messages, setMessages] = useState([]);
8
11
  const [agents, setAgents] = useState([]);
@@ -10,19 +13,19 @@ export function MessagesPage() {
10
13
  const [mainTab, setMainTab] = useState('messages');
11
14
  const [subTab, setSubTab] = useState('all');
12
15
  const [showModal, setShowModal] = useState(false);
13
- const [form, setForm] = useState({ orgId: getOrgId(), fromAgentId: '', toAgentId: '', subject: '', content: '', priority: 'normal' });
16
+ const [form, setForm] = useState({ orgId: effectiveOrgId, fromAgentId: '', toAgentId: '', subject: '', content: '', priority: 'normal' });
14
17
  const [selectedNode, setSelectedNode] = useState(null);
15
18
  const [nodePositions, setNodePositions] = useState([]);
16
19
  const svgRef = useRef(null);
17
20
 
18
21
  const loadMessages = () => {
19
- engineCall('/messages?orgId=' + getOrgId() + '&limit=100').then(d => setMessages(d.messages || [])).catch(() => {});
22
+ engineCall('/messages?orgId=' + effectiveOrgId + '&limit=100').then(d => setMessages(d.messages || [])).catch(() => {});
20
23
  };
21
24
  const loadAgents = () => {
22
- engineCall('/agents?orgId=' + getOrgId()).then(d => setAgents(d.agents || [])).catch(() => {});
25
+ engineCall('/agents?orgId=' + effectiveOrgId).then(d => setAgents(d.agents || [])).catch(() => {});
23
26
  };
24
27
  const loadTopology = () => {
25
- engineCall('/messages/topology?orgId=' + getOrgId()).then(d => setTopology(d.topology || null)).catch(() => {});
28
+ engineCall('/messages/topology?orgId=' + effectiveOrgId).then(d => setTopology(d.topology || null)).catch(() => {});
26
29
  };
27
30
  useEffect(() => { loadMessages(); loadAgents(); loadTopology(); }, []);
28
31
 
@@ -200,6 +203,7 @@ export function MessagesPage() {
200
203
  var _tip = { marginTop: 12, padding: 12, background: 'var(--bg-secondary, #1e293b)', borderRadius: 'var(--radius, 8px)', fontSize: 13 };
201
204
 
202
205
  return h('div', { className: 'page-inner' },
206
+ h(orgCtx.Switcher),
203
207
  // Page header
204
208
  h('div', { className: 'page-header' }, h('h1', { style: { display: 'flex', alignItems: 'center' } }, 'Agent Messages', h(HelpButton, { label: 'Agent Messages' },
205
209
  h('p', null, 'All inter-agent and external communications in one place. See how your agents talk to each other and to the outside world.'),
@@ -1,6 +1,7 @@
1
1
  import { h, useState, useEffect, useCallback, useRef, Fragment, useApp, engineCall, getOrgId } from '../components/utils.js';
2
2
  import { I } from '../components/icons.js';
3
3
  import { HelpButton } from '../components/help-button.js';
4
+ import { useOrgContext } from '../components/org-switcher.js';
4
5
 
5
6
  // ─── Inject theme CSS once ───────────────────────────────
6
7
  var _injected = false;
@@ -133,6 +134,8 @@ function OrgSummary(props) {
133
134
 
134
135
  // ─── Main Component ─────────────────────────────────────
135
136
  export function OrgChartPage() {
137
+ var orgCtx = useOrgContext();
138
+ var effectiveOrgId = orgCtx.selectedOrgId || getOrgId();
136
139
  injectCSS();
137
140
  var app = useApp();
138
141
  var toast = app.toast;
@@ -151,7 +154,7 @@ export function OrgChartPage() {
151
154
  setLoading(true); setError(null);
152
155
  Promise.all([
153
156
  engineCall('/hierarchy/org-chart').catch(function() { return null; }),
154
- engineCall('/agents?orgId=' + getOrgId()).catch(function() { return { agents: [] }; }),
157
+ engineCall('/agents?orgId=' + effectiveOrgId).catch(function() { return { agents: [] }; }),
155
158
  ]).then(function(res) {
156
159
  var hierRes = res[0]; var agentRes = res[1];
157
160
  var avatarMap = {};
@@ -211,6 +214,7 @@ export function OrgChartPage() {
211
214
  );
212
215
 
213
216
  return h('div', { style: { height: '100%', display: 'flex', flexDirection: 'column', background: 'var(--oc-bg)', borderRadius: 'var(--radius-lg)', overflow: 'hidden' } },
217
+ h(orgCtx.Switcher, { style: { margin: '8px 12px 0', borderRadius: 6 } }),
214
218
  // Toolbar
215
219
  h('div', { style: { display: 'flex', alignItems: 'center', gap: 10, padding: '10px 16px', borderBottom: '1px solid var(--oc-border)', background: 'var(--oc-toolbar)', flexShrink: 0, flexWrap: 'wrap' } },
216
220
  h('div', { style: { fontWeight: 700, fontSize: 14, color: 'var(--oc-text)', display: 'flex', alignItems: 'center', gap: 6 } },