feat(web): emailgen events in Orchestrator page

The SSE pipe at /orchestrator/events/stream was already streaming
'orchestrator.email.{decky_uuid}' events (the subscription is for the
'orchestrator.>' wildcard), but the consumer side dropped them on the
floor.  Three fixes to close the loop:

* useOrchestratorStream.ts now registers an 'email' SSE listener — the
  EventSource silently ignores frames whose event name has no listener,
  so missing this entry meant every email frame was dropped before
  reaching the page's onEvent handler.

* /api/v1/orchestrator/events accepts kind=email and dispatches to
  list_orchestrator_emails, adapting rows to the existing wire shape:
  subject -> action, sender_email -> src_decky_uuid, recipient_email
  -> dst_decky_uuid, plus email-specific extras (thread_id, language,
  mail_decky_uuid, message_id, in_reply_to) ride along as top-level
  keys.

* Orchestrator.tsx gains an 'email' tab in the kind filter and a
  branch in the row renderer / inspector that:
   - shows full sender / recipient (no UUID truncation),
   - chips the language code next to the subject,
   - relabels ACTION as SUBJECT in the inspector and surfaces
     thread / in-reply-to / mail-decky details.

The 'all' tab continues to show traffic+file only (today's behavior);
operators see emails by switching to the email tab.  A union view at
the API layer is the obvious follow-up but not necessary for now.
This commit is contained in:
2026-04-26 22:56:48 -04:00
parent f97ec4c2c1
commit 818aebadfc
6 changed files with 282 additions and 31 deletions

View File

@@ -212,6 +212,10 @@
}
.orchestrator-root .kind-chip.traffic { border-color: var(--matrix); color: var(--matrix); }
.orchestrator-root .kind-chip.file { border-color: var(--violet); color: var(--violet); }
/* Emailgen rows — distinct accent so the eye separates LLM-driven mail
from SSH/file activity at a glance. Falls back to --accent when the
theme doesn't define --amber. */
.orchestrator-root .kind-chip.email { border-color: var(--amber, var(--accent)); color: var(--amber, var(--accent)); }
/* OK indicator */
.orchestrator-root .ok-yes { color: var(--matrix); font-weight: 700; }

View File

@@ -12,16 +12,27 @@ import './Orchestrator.css';
interface OrchestratorEntry {
uuid: string;
ts: string;
kind: 'traffic' | 'file' | string;
kind: 'traffic' | 'file' | 'email' | string;
protocol: string;
action: string;
src_decky_uuid: string | null;
dst_decky_uuid: string;
success: boolean;
payload: string;
// Email-only extras — populated when `kind === 'email'`, undefined
// for traffic/file rows. The renderer keys off `kind` to decide
// whether to read these.
subject?: string;
sender_email?: string;
recipient_email?: string;
language?: string;
thread_id?: string;
mail_decky_uuid?: string;
message_id?: string;
in_reply_to?: string | null;
}
type KindFilter = 'all' | 'traffic' | 'file';
type KindFilter = 'all' | 'traffic' | 'file' | 'email';
type StreamStatus = 'connecting' | 'live' | 'error';
const ROW_CAP = 500;
@@ -88,19 +99,53 @@ const Orchestrator: React.FC = () => {
onStatus: setStatus,
onEvent: (ev: OrchestratorStreamEvent) => {
if (pausedRef.current) return;
if (ev.name !== 'traffic' && ev.name !== 'file') return;
const p = ev.payload as Partial<OrchestratorEntry>;
const row: OrchestratorEntry = {
uuid: `live-${ev.ts ?? Date.now()}-${Math.random().toString(36).slice(2, 8)}`,
ts: ev.ts ?? new Date().toISOString(),
kind: (p.kind ?? ev.name) as OrchestratorEntry['kind'],
protocol: p.protocol ?? '?',
action: p.action ?? '',
src_decky_uuid: p.src_decky_uuid ?? null,
dst_decky_uuid: p.dst_decky_uuid ?? '',
success: Boolean(p.success),
payload: typeof p.payload === 'string' ? p.payload : JSON.stringify(p.payload ?? {}),
if (ev.name !== 'traffic' && ev.name !== 'file' && ev.name !== 'email') return;
const p = ev.payload as Partial<OrchestratorEntry> & {
// Live email payloads come from worker._one_tick — see emailgen
// worker.py for the bus payload shape.
sender_email?: string;
recipient_email?: string;
subject?: string;
language?: string;
thread_id?: string;
mail_decky_uuid?: string;
message_id?: string;
in_reply_to?: string | null;
};
const isEmail = ev.name === 'email' || p.kind === 'email';
const row: OrchestratorEntry = isEmail
? {
uuid: `live-${ev.ts ?? Date.now()}-${Math.random().toString(36).slice(2, 8)}`,
ts: ev.ts ?? new Date().toISOString(),
kind: 'email',
protocol: 'smtp',
action: p.subject ?? '',
// Map sender/recipient onto src/dst so the existing inspector
// shows them naturally — the API does the same on REST reads.
src_decky_uuid: p.sender_email ?? null,
dst_decky_uuid: p.recipient_email ?? '',
success: Boolean(p.success),
payload: typeof p.payload === 'string' ? p.payload : JSON.stringify(p.payload ?? {}),
subject: p.subject,
sender_email: p.sender_email,
recipient_email: p.recipient_email,
language: p.language,
thread_id: p.thread_id,
mail_decky_uuid: p.mail_decky_uuid,
message_id: p.message_id,
in_reply_to: p.in_reply_to ?? null,
}
: {
uuid: `live-${ev.ts ?? Date.now()}-${Math.random().toString(36).slice(2, 8)}`,
ts: ev.ts ?? new Date().toISOString(),
kind: (p.kind ?? ev.name) as OrchestratorEntry['kind'],
protocol: p.protocol ?? '?',
action: p.action ?? '',
src_decky_uuid: p.src_decky_uuid ?? null,
dst_decky_uuid: p.dst_decky_uuid ?? '',
success: Boolean(p.success),
payload: typeof p.payload === 'string' ? p.payload : JSON.stringify(p.payload ?? {}),
};
setStreamRows((prev) => [row, ...prev].slice(0, ROW_CAP));
},
});
@@ -156,7 +201,7 @@ const Orchestrator: React.FC = () => {
<div className="controls-row">
<div className="seg-group" role="tablist" aria-label="Filter by event kind">
{(['all', 'traffic', 'file'] as KindFilter[]).map((k) => (
{(['all', 'traffic', 'file', 'email'] as KindFilter[]).map((k) => (
<button
key={k}
className={kindParam === k ? 'active' : ''}
@@ -210,7 +255,10 @@ const Orchestrator: React.FC = () => {
{visible.length > 0 ? visible.map((r) => {
const fresh = now - new Date(r.ts).getTime() < FRESH_MS;
const cls = !r.success ? 'fail' : fresh ? 'fresh' : '';
const kindCls = r.kind === 'traffic' || r.kind === 'file' ? r.kind : '';
const kindCls =
r.kind === 'traffic' || r.kind === 'file' || r.kind === 'email'
? r.kind : '';
const isEmail = r.kind === 'email';
return (
<tr
key={r.uuid}
@@ -221,11 +269,28 @@ const Orchestrator: React.FC = () => {
<td>
<span className={`kind-chip ${kindCls}`}>{r.kind}</span>
</td>
<td className="mono matrix-text">{r.action}</td>
<td className="mono matrix-text">
{isEmail && r.language && (
<span
className="chip dim-chip"
style={{ marginRight: 6 }}
title={`Language: ${r.language}`}
>
{r.language.toUpperCase()}
</span>
)}
{r.action}
</td>
<td className="src-dst">
{r.src_decky_uuid ? `${r.src_decky_uuid.slice(0, 8)}` : '—'}
{/* Email rows show full sender / recipient addresses;
UUID rows stay truncated. */}
{isEmail
? (r.src_decky_uuid ?? '—')
: (r.src_decky_uuid ? `${r.src_decky_uuid.slice(0, 8)}` : '—')}
<span className="arrow"></span>
{r.dst_decky_uuid ? `${r.dst_decky_uuid.slice(0, 8)}` : '—'}
{isEmail
? (r.dst_decky_uuid || '—')
: (r.dst_decky_uuid ? `${r.dst_decky_uuid.slice(0, 8)}` : '—')}
</td>
<td>
<span className={r.success ? 'ok-yes' : 'ok-no'}>
@@ -241,7 +306,13 @@ const Orchestrator: React.FC = () => {
<EmptyState
icon={Cpu}
title={loading ? 'LOADING…' : 'NO ORCHESTRATOR ACTIVITY YET'}
hint={loading ? undefined : 'start the worker with `decnet orchestrate`'}
hint={
loading
? undefined
: kindParam === 'email'
? 'start the worker with `decnet emailgen run`'
: 'start the worker with `decnet orchestrate`'
}
/>
</td>
</tr>

View File

@@ -5,13 +5,22 @@ import { useToast } from './Toasts/useToast';
export interface OrchestratorInspectorEntry {
uuid: string;
ts: string;
kind: 'traffic' | 'file' | string;
kind: 'traffic' | 'file' | 'email' | string;
protocol: string;
action: string;
src_decky_uuid: string | null;
dst_decky_uuid: string;
success: boolean;
payload: string;
// Email-only extras populated when `kind === 'email'`.
subject?: string;
sender_email?: string;
recipient_email?: string;
language?: string;
thread_id?: string;
mail_decky_uuid?: string;
message_id?: string;
in_reply_to?: string | null;
}
interface Props {
@@ -52,7 +61,10 @@ const OrchestratorInspector: React.FC<Props> = ({ event, onClose }) => {
const copyEvent = () => copy(JSON.stringify(event, null, 2), 'EVENT JSON');
const copyPayload = () => copy(prettyPayload, 'PAYLOAD JSON');
const kindCls = event.kind === 'traffic' || event.kind === 'file' ? event.kind : '';
const kindCls =
event.kind === 'traffic' || event.kind === 'file' || event.kind === 'email'
? event.kind : '';
const isEmail = event.kind === 'email';
const srcSrc = sourceTag(event.src_decky_uuid);
const dstSrc = sourceTag(event.dst_decky_uuid);
const isLive = event.uuid.startsWith('live-');
@@ -87,9 +99,42 @@ const OrchestratorInspector: React.FC<Props> = ({ event, onClose }) => {
<span className="chip dim-chip">{event.protocol.toUpperCase()}</span>
</div>
<div className="k">ACTION</div>
<div className="k">{isEmail ? 'SUBJECT' : 'ACTION'}</div>
<div className="v mono matrix-text">{event.action}</div>
{isEmail && event.language && (
<>
<div className="k">LANGUAGE</div>
<div className="v">
<span className="chip dim-chip">{event.language.toUpperCase()}</span>
</div>
</>
)}
{isEmail && event.thread_id && (
<>
<div className="k">THREAD</div>
<div className="v">
<span className="hash-text">{event.thread_id}</span>
</div>
</>
)}
{isEmail && event.in_reply_to && (
<>
<div className="k">IN-REPLY-TO</div>
<div className="v">
<span className="hash-text">{event.in_reply_to}</span>
</div>
</>
)}
{isEmail && event.mail_decky_uuid && (
<>
<div className="k">MAIL DECKY</div>
<div className="v">
<span className="hash-text">{event.mail_decky_uuid}</span>
</div>
</>
)}
<div className="k">OUTCOME</div>
<div className="v">
<span className={event.success ? 'ok-yes' : 'ok-no'}>

View File

@@ -5,7 +5,11 @@
*/
import { useEffect, useRef } from 'react';
export type OrchestratorStreamEventName = 'snapshot' | 'traffic' | 'file';
export type OrchestratorStreamEventName =
| 'snapshot'
| 'traffic'
| 'file'
| 'email';
export interface OrchestratorStreamEvent {
name: OrchestratorStreamEventName | string;
@@ -21,7 +25,13 @@ export interface UseOrchestratorStreamOptions {
onStatus?: (status: 'connecting' | 'live' | 'error') => void;
}
const NAMED_EVENTS: OrchestratorStreamEventName[] = ['snapshot', 'traffic', 'file'];
// Must include every leaf the SSE endpoint emits — the EventSource
// silently drops frames whose `event:` name has no listener registered.
// New leaves on the bus need a corresponding entry here or the
// dashboard ignores them despite the SSE pipe carrying them through.
const NAMED_EVENTS: OrchestratorStreamEventName[] = [
'snapshot', 'traffic', 'file', 'email',
];
export function useOrchestratorStream({
enabled,