Skip to content

Commit cbb8ae4

Browse files
committed
feat: detailed event log with JSON expansion, docs links point to /docs
1 parent 9876c14 commit cbb8ae4

3 files changed

Lines changed: 42 additions & 16 deletions

File tree

src/cli/dashboard/landing.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -120,7 +120,7 @@ <h1>PARACOSM</h1>
120120
<div class="hero-ctas">
121121
<a href="/sim" class="cta cta-pulse">Launch Simulation <svg><use href="#i-arrow"/></svg></a>
122122
<a href="https://github.com/framersai/paracosm" class="btn-ghost" target="_blank" rel="noopener">View Source</a>
123-
<a href="https://docs.agentos.sh" class="btn-ghost" target="_blank" rel="noopener">Documentation</a>
123+
<a href="/docs" class="btn-ghost">Documentation</a>
124124
</div>
125125

126126
<div class="hero-chips">
@@ -511,7 +511,7 @@ <h2 class="rv">Run your first simulation</h2>
511511
<div class="ft-inner">
512512
<nav class="ft-links" aria-label="Footer">
513513
<a href="https://agentos.sh">agentos.sh</a>
514-
<a href="https://docs.agentos.sh">Docs</a>
514+
<a href="/docs">API Docs</a>
515515
<a href="https://github.com/framersai/paracosm">GitHub</a>
516516
<a href="https://www.npmjs.com/package/paracosm">npm</a>
517517
<a href="https://frame.dev">Frame.dev</a>

src/cli/dashboard/src/App.tsx

Lines changed: 39 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -188,19 +188,45 @@ function AppContent() {
188188
{activeTab === 'chat' && <ChatPanel state={gameState} />}
189189

190190
{activeTab === 'log' && (
191-
<div className="flex-1 overflow-y-auto p-4 font-mono text-xs" role="log" aria-label="Event log" aria-live="polite" style={{ background: 'var(--bg-panel)', color: 'var(--text-3)' }}>
192-
<h2 className="mb-2 font-semibold" style={{ color: 'var(--text-1)', fontSize: '14px' }}>Event Log</h2>
193-
{effectiveEvents.length === 0 && <div>No events yet.</div>}
194-
{effectiveEvents.map((e, i) => (
195-
<div key={i} className="py-0.5">
196-
<span style={{ color: 'var(--amber)' }}>[{e.type}]</span>{' '}
197-
<span style={{ color: 'var(--text-2)' }}>{e.leader}</span>{' '}
198-
{e.data?.turn != null && <span>T{String(e.data.turn)}</span>}
199-
{e.data?.title != null && <span> {String(e.data.title)}</span>}
200-
{e.data?.department != null && <span> {String(e.data.department)}</span>}
201-
{e.data?.outcome != null && <span> &rarr; {String(e.data.outcome)}</span>}
202-
</div>
203-
))}
191+
<div className="flex-1 overflow-y-auto p-4 font-mono text-xs" role="log" aria-label="Event log" aria-live="polite" style={{ background: 'var(--bg-deep)', color: 'var(--text-3)' }}>
192+
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '8px' }}>
193+
<h2 style={{ color: 'var(--text-1)', fontSize: '14px', fontWeight: 700 }}>Event Log ({effectiveEvents.length} events)</h2>
194+
</div>
195+
{effectiveEvents.length === 0 && <div style={{ color: 'var(--text-3)', padding: '20px 0' }}>No events yet. Run a simulation to see the raw SSE event stream.</div>}
196+
{effectiveEvents.map((e, i) => {
197+
const typeColors: Record<string, string> = {
198+
status: 'var(--teal)', turn_start: 'var(--rust)', turn_done: 'var(--rust)',
199+
dept_start: 'var(--text-3)', dept_done: 'var(--green)',
200+
commander_deciding: 'var(--amber)', commander_decided: 'var(--amber)',
201+
outcome: '#e8b44a', drift: 'var(--teal)', agent_reactions: '#6aad48',
202+
bulletin: 'var(--text-2)', promotion: 'var(--teal)',
203+
};
204+
const color = typeColors[e.type] || 'var(--text-3)';
205+
const hasData = e.data && Object.keys(e.data).length > 0;
206+
return (
207+
<details key={i} style={{ borderBottom: '1px solid var(--border)', padding: '2px 0' }}>
208+
<summary style={{ cursor: 'pointer', padding: '4px 0', display: 'flex', gap: '8px', alignItems: 'baseline' }}>
209+
<span style={{ color: 'var(--text-3)', minWidth: '28px', textAlign: 'right', opacity: 0.5 }}>{i}</span>
210+
<span style={{ color, fontWeight: 700, minWidth: '120px' }}>{e.type}</span>
211+
<span style={{ color: 'var(--text-2)', flex: 1, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>{e.leader}</span>
212+
{e.data?.turn != null && <span style={{ color: 'var(--text-3)' }}>T{String(e.data.turn)}</span>}
213+
{e.data?.title && <span style={{ color: 'var(--text-2)' }}>{String(e.data.title)}</span>}
214+
{e.data?.department && <span style={{ color: 'var(--teal)' }}>{String(e.data.department)}</span>}
215+
{e.data?.outcome && <span style={{ color: 'var(--amber)', fontWeight: 700 }}>{String(e.data.outcome)}</span>}
216+
</summary>
217+
{hasData && (
218+
<pre style={{
219+
padding: '8px 12px 8px 44px', margin: '0 0 4px',
220+
background: 'var(--bg-card)', borderRadius: '4px', border: '1px solid var(--border)',
221+
overflow: 'auto', maxHeight: '400px', fontSize: '11px', lineHeight: 1.5,
222+
color: 'var(--text-2)', whiteSpace: 'pre-wrap', wordBreak: 'break-word',
223+
}}>
224+
{JSON.stringify(e.data, null, 2)}
225+
</pre>
226+
)}
227+
</details>
228+
);
229+
})}
204230
</div>
205231
)}
206232

src/cli/dashboard/src/components/layout/Footer.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export function Footer() {
2020
<a href="https://agentos.sh" target="_blank" rel="noopener" style={{ color: 'var(--rust)', fontWeight: 600 }}>agentos.sh</a>
2121
<a href="https://github.com/framersai/paracosm" target="_blank" rel="noopener" style={{ color: 'var(--rust)', fontWeight: 600 }}>github</a>
2222
<a href="https://www.npmjs.com/package/paracosm" target="_blank" rel="noopener" style={{ color: 'var(--rust)', fontWeight: 600 }}>npm</a>
23-
<a href="https://docs.agentos.sh" target="_blank" rel="noopener" style={{ color: 'var(--rust)', fontWeight: 600 }}>docs</a>
23+
<a href="/docs" style={{ color: 'var(--rust)', fontWeight: 600 }}>docs</a>
2424
<a href="https://agentos.sh/blog" target="_blank" rel="noopener" style={{ color: 'var(--rust)', fontWeight: 600 }}>blog</a>
2525
</nav>
2626
<span>

0 commit comments

Comments
 (0)