Skip to content

Commit 2ec235f

Browse files
cowan-macadycowan-macady
committed
feat: add corporate chatbot in iag-mcp-demo
implement [ENG-8488]
1 parent 415c87c commit 2ec235f

7 files changed

Lines changed: 276 additions & 160 deletions

File tree

‎a2a/iag-mcp-demo/chatbot/app.py‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,10 @@
6262
# diagram and dim the optional (profile-gated) service groups.
6363
USECASE = (os.getenv("USECASE") or "").strip()
6464
COMPOSE_PROFILES = [p.strip() for p in (os.getenv("COMPOSE_PROFILES") or "").split(",") if p.strip()]
65+
# Usecase branding (from the usecase bundle's usecase.env): the console
66+
# presents itself as the demo organization, e.g. "SecureHome Insurance".
67+
ORG_NAME = (os.getenv("ORG_NAME") or "").strip()
68+
ORG_TAGLINE = (os.getenv("ORG_TAGLINE") or "").strip()
6569
EXPLAIN_ENABLED = all(
6670
(INDYKITE_BASE_URL, APP_AGENT_CREDENTIALS_TOKEN, EXPLAIN_STAFF_QUERY_ID, EXPLAIN_DIRECT_QUERY_ID),
6771
)
@@ -538,6 +542,9 @@ def get_config():
538542
# architecture page: badge + dimming of profile-gated groups
539543
"usecase": USECASE,
540544
"profiles": COMPOSE_PROFILES,
545+
# usecase branding for the console chrome
546+
"org_name": ORG_NAME,
547+
"org_tagline": ORG_TAGLINE,
541548
},
542549
)
543550

‎a2a/iag-mcp-demo/chatbot/static/architecture.html‎

Lines changed: 47 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -6,45 +6,60 @@
66
<title>Architecture – Indykite IAG demo</title>
77
<style>
88
* { margin: 0; padding: 0; box-sizing: border-box; }
9+
/* Corporate "operations desk" frame, matching the console: warm
10+
paper page, the proven dark diagram kept as an ink-navy plate. */
911
:root {
1012
--accent: #FF6B35;
11-
--bg-primary: #000000;
12-
--bg-secondary: #0A0A0A;
13-
--bg-tertiary: #1A1A1A;
14-
--text-primary: #FFFFFF;
15-
--text-secondary: #B0B0B0;
16-
--text-muted: #666666;
17-
--border-color: #2A2A2A;
13+
--ink-900: #0C1B2A;
14+
--ink-800: #14293F;
15+
--ink-750: #1A3350;
16+
--ink-700: #23405C;
17+
--ink-text: #E8EDF2;
18+
--ink-sub: #A5B5C4;
19+
--ink-faint: #66798C;
20+
--paper: #F5F4F0;
21+
--surface: #FFFFFF;
22+
--line: #E3E1DA;
23+
--text-ink: #1E2A38;
24+
--text-sub: #5C6B7A;
25+
--text-faint: #939CA7;
1826
--agent: #4EA8DE;
1927
--console: #9D8CFF;
2028
--data: #45C486;
21-
--external: #8A8A8A;
29+
--external: #8A9BAC;
30+
--serif: Georgia, 'Iowan Old Style', 'Palatino Linotype', 'Times New Roman', serif;
31+
/* aliases used inside the SVG styles (ink plate) */
32+
--bg-tertiary: var(--ink-800);
33+
--text-primary: var(--ink-text);
34+
--text-secondary: var(--ink-sub);
35+
--text-muted: var(--ink-faint);
36+
--border-color: var(--ink-700);
2237
}
2338
body {
2439
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
25-
background: var(--bg-primary);
26-
color: var(--text-primary);
40+
background: var(--paper);
41+
color: var(--text-ink);
2742
}
2843
.page { max-width: 1440px; margin: 0 auto; padding: 20px 24px 60px; }
2944
.page-header { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 6px; }
30-
.page-header h1 { font-size: 20px; font-weight: 600; }
31-
.page-header a { color: var(--text-secondary); font-size: 13px; text-decoration: none; }
45+
.page-header h1 { font-family: var(--serif); font-size: 22px; font-weight: 600; color: var(--text-ink); }
46+
.page-header a { color: var(--text-sub); font-size: 13px; text-decoration: none; }
3247
.page-header a:hover { color: var(--accent); }
33-
#contextBadge { font-size: 13px; color: var(--text-secondary); background: var(--bg-tertiary); border: 1px solid var(--border-color); border-radius: 8px; padding: 4px 10px; }
34-
.subtitle { color: var(--text-secondary); font-size: 13px; margin-bottom: 14px; }
35-
.diagram-wrap { background: var(--bg-secondary); border: 1px solid var(--border-color); border-radius: 12px; padding: 10px; overflow-x: auto; }
48+
#contextBadge { font-size: 13px; color: var(--text-sub); background: var(--surface); border: 1px solid var(--line); border-radius: 8px; padding: 4px 10px; }
49+
.subtitle { color: var(--text-sub); font-size: 13px; margin-bottom: 14px; }
50+
.diagram-wrap { background: var(--ink-900); border: 1px solid var(--ink-700); border-top: 3px solid var(--accent); border-radius: 12px; padding: 10px; overflow-x: auto; box-shadow: 0 2px 12px rgba(12, 27, 42, 0.12); }
3651
svg { width: 100%; min-width: 1100px; height: auto; display: block; }
3752

38-
/* SVG element styles */
39-
.box { fill: var(--bg-tertiary); stroke-width: 1.5; rx: 8; }
53+
/* SVG element styles (unchanged geometry; ink-navy plate palette) */
54+
.box { fill: var(--ink-800); stroke-width: 1.5; rx: 8; }
4055
.b-gateway { stroke: var(--accent); }
4156
.b-agent { stroke: var(--agent); }
4257
.b-console { stroke: var(--console); }
4358
.b-data { stroke: var(--data); }
44-
.b-external { stroke: var(--external); stroke-dasharray: none; fill: #101010; }
45-
.b-band { fill: #0D0D0D; stroke: var(--border-color); }
46-
.b-chip { fill: #161616; stroke: var(--border-color); }
47-
.boundary { fill: none; stroke: var(--text-muted); stroke-dasharray: 7 5; rx: 12; }
59+
.b-external { stroke: var(--external); stroke-dasharray: none; fill: #102134; }
60+
.b-band { fill: #0F2236; stroke: var(--ink-700); }
61+
.b-chip { fill: var(--ink-750); stroke: var(--ink-700); }
62+
.boundary { fill: none; stroke: var(--ink-faint); stroke-dasharray: 7 5; rx: 12; }
4863
.t { fill: var(--text-primary); font-size: 13px; font-weight: 600; }
4964
.t-sub { fill: var(--text-secondary); font-size: 10.5px; font-weight: 400; }
5065
.t-band { fill: var(--text-secondary); font-size: 12px; font-weight: 600; letter-spacing: .04em; }
@@ -61,21 +76,22 @@
6176

6277
.below { display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; margin-top: 20px; }
6378
@media (max-width: 900px) { .below { grid-template-columns: 1fr; } }
64-
.panel { background: var(--bg-secondary); border: 1px solid var(--border-color); border-radius: 12px; padding: 16px 20px; }
65-
.panel h2 { font-size: 14px; margin-bottom: 10px; color: var(--text-primary); }
79+
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 16px 20px; box-shadow: 0 1px 3px rgba(12, 27, 42, 0.06); }
80+
.panel h2 { font-family: var(--serif); font-size: 15px; margin-bottom: 10px; color: var(--text-ink); }
6681
.panel ol { padding-left: 22px; }
67-
.panel li { font-size: 13px; color: var(--text-secondary); margin-bottom: 8px; line-height: 1.45; }
68-
.panel li b { color: var(--text-primary); font-weight: 600; }
82+
.panel li { font-size: 13px; color: var(--text-sub); margin-bottom: 8px; line-height: 1.5; }
83+
.panel li b { color: var(--text-ink); font-weight: 600; }
6984
.legend { list-style: none; }
70-
.legend li { display: flex; align-items: center; gap: 10px; }
71-
.swatch { width: 22px; height: 14px; border-radius: 4px; background: var(--bg-tertiary); border: 2px solid; flex: none; }
85+
.legend li { display: flex; align-items: center; gap: 10px; color: var(--text-sub); font-size: 13px; }
86+
.legend li b { color: var(--text-ink); }
87+
.swatch { width: 22px; height: 14px; border-radius: 4px; background: var(--ink-800); border: 2px solid; flex: none; }
7288
.sw-gateway { border-color: var(--accent); }
7389
.sw-agent { border-color: var(--agent); }
7490
.sw-console { border-color: var(--console); }
7591
.sw-data { border-color: var(--data); }
76-
.sw-external { border-color: var(--external); background: #101010; }
92+
.sw-external { border-color: var(--external); background: #102134; }
7793
.sw-dash { border: none; height: 0; border-top: 2px dashed var(--accent); border-radius: 0; }
78-
.sw-boundary { border: 1.5px dashed var(--text-muted); background: transparent; }
94+
.sw-boundary { border: 1.5px dashed var(--text-faint); background: transparent; }
7995
</style>
8096
</head>
8197
<body>
@@ -383,8 +399,8 @@ <h2 style="margin-top:16px">Optional profiles</h2>
383399
const cfg = await res.json();
384400
const badge = document.getElementById('contextBadge');
385401
const profiles = Array.isArray(cfg.profiles) ? cfg.profiles : [];
386-
if (cfg.usecase || profiles.length) {
387-
badge.textContent = 'usecase: ' + (cfg.usecase || '?')
402+
if (cfg.org_name || cfg.usecase || profiles.length) {
403+
badge.textContent = (cfg.org_name || 'usecase: ' + (cfg.usecase || '?'))
388404
+ (profiles.length ? ' · profiles: ' + profiles.join(', ') : '');
389405
badge.hidden = false;
390406
}

‎a2a/iag-mcp-demo/chatbot/static/index.html‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -347,6 +347,18 @@
347347
EXPLAIN_WF_MAP = data.explain_workflow_map || {};
348348
GRANT_ENABLED = !!data.grant_enabled;
349349
GRANT_MAP = data.grant_map || {};
350+
// Usecase branding: the console presents itself as the demo org.
351+
if (data.org_name) {
352+
document.title = `${data.org_name} · Agent Console`;
353+
const t = document.querySelector('.header-title');
354+
if (t) t.textContent = `${data.org_name} · Agent Console`;
355+
const empty = document.querySelector('.empty-state');
356+
if (empty) {
357+
const ps = empty.querySelectorAll('p');
358+
if (ps[0]) ps[0].textContent = `Welcome to ${data.org_name}`;
359+
if (ps[1] && data.org_tagline) ps[1].textContent = data.org_tagline;
360+
}
361+
}
350362
} catch (e) {
351363
console.warn('Failed to load config', e);
352364
}

0 commit comments

Comments
 (0)