agentille

  on('ui.render', { component: 'AbovePrompt' }, async ($, e, next) => {
    if (e.props.hasSurvey) return next(e)
    const now = Date.now()
    const staged = stage({ agents: live, panes, routes: paneRoutes, run: lastRun, now })
    const focus = focusLines(now)
    const wire = wireRow(wireLog, now)
    if (staged.rows.length === 0 && !selfName && !worker && focus.length === 0 && !wire) return next(e)
    const els = $.ui.resolve(e)
    const kids = focus.map((l) => focusRow(els, l))
    if (worker) kids.push(...workerBand(els, e, await $.clock.now()))
    else if (selfName) kids.push(els.Text({ color: hex(MODEL_COLOR.opus), children: ['agentille worker · ' + selfName] }))
    const theirs = await next(e)
    // No agent rows: the newest wire message alone, no frame.
    if (staged.rows.length === 0) return els.Box({ flexDirection: 'column', children: [...kids, ...(wire ? [wireLine(els, wire)] : []), theirs] })

    const rows = nest(linkPieces(cast(staged, live, lastRun)))
    const cols = (e.props.bodyColumns ?? 80) - 4
    const view = boardRows(rows, { now, tick, cols, wire: wireStatus, transport, view: e.props.view?.agentId ?? null })
    const sw = swarm({ agents: live, routes: paneRoutes, run: lastRun, tick })
    const room = Math.max(1, (e.props.maxRows ?? 10) - 4 - kids.length - (wire ? 1 : 0) - (sw ? 1 : 0))
    const waiting = rows.filter((r) => r.state === 'working').length
    const inner = [boardHeader(els, header({ run: lastRun, formation: runs.get(lastRun)?.formation, squads: squads.map((q) => q.name), loops: loopText(runs.get(lastRun)) }), runningVersion)]
    if (sw) inner.push(swarmLine(els, sw))
    if (rows.length) inner.push(leadRow(els, leadLine({ model: leadModel, busy: e.props.isWorking, waiting })))
    const shown = view.slice(0, room)
    const argvs = shown.map((r) => (r.pane ? focusArgv(transport, rows.find((x) => x.id === r.id)) : null))
    const slot = argvs.some(Boolean)
    shown.forEach((r, i) => inner.push(boardRow(els, r, argvs[i] ? () => { $.process.run(argvs[i], PROBE).catch(() => {}) } : null, slot)))
    if (view.length > room) inner.push(els.Text({ dimColor: true, children: ['   +' + (view.length - room) + ' more · /agt-deck'] }))
    if (wire) inner.push(wireLine(els, wire))
    const board = els.Box({ flexDirection: 'column', borderStyle: 'round', borderColor: hex(FRAME_COLOR), paddingX: 1, children: inner })
    return els.Box({ flexDirection: 'column', children: [...kids, board, theirs] })
  })

const focusRow = (els, text) => els.Text({ color: FOCUS_COLOR.flag, wrap: 'truncate', children: ['⚑ ' + text] })

function wireLine(els, w) {
  const { Text } = els
  return Text({ wrap: 'truncate', children: [Text({ color: hex(WIRE_COLOR), children: ['⇄ ' + w.arrow + '  '] }), w.text, Text({ dimColor: true, children: ['  ' + w.ago] })] })
}

  on('ui.render', { component: 'Pane', requestId: DECK }, async ($, e) => {
    const els = $.ui.resolve(e)
    const { Box, Text } = els
    const now = Date.now()
    const staged = stage({ agents: live, panes, routes: paneRoutes, run: lastRun, now })
    const all = [...staged.rows, ...[...live.values()].filter((a) => a.run === lastRun && !staged.rows.includes(a))]
    const rows = cast({ rows: all.map((r) => (r.kind === 'pane' && !r.model ? { ...r, model: wireStatus.get(r.name)?.model ?? null } : r)), tally: { working: 0 } }, live, lastRun)
    const cols = e.props.bodyColumns ?? 80
    const kids = [boardHeader(els, header({ run: lastRun, formation: runs.get(lastRun)?.formation, squads: squads.map((q) => q.name), loops: loopText(runs.get(lastRun)) }), runningVersion)]
    if (rows.length === 0 && decisions.length === 0 && wireLog.length === 0) {
      kids.push(Text({ dimColor: true, children: ['No agents yet. Type /agt "task": every dispatch shows up here.'] }))
      return Box({ flexDirection: 'column', children: kids })
    }
    if (rows.length) {
      kids.push(rule(els, 'cast'))
      const c = castColumns(rows, { cols, tick: tick >> 1, frameOf: frame, moodOf: (r) => (r.kind === 'sub' ? agentMood(r, now) : r.state === 'working' ? 'working' : 'bye') })
      const orange = hex(MASCOT_COLOR)
      const line = (pick) => Box({ flexDirection: 'row', children: c.cells.map(pick) })
      for (const i of [0, 1, 2]) kids.push(line((m) => Text({ color: orange, dimColor: m.dim, children: [m.lines[i]] })))
      kids.push(line((m) => Text({ dimColor: m.dim, children: [(m.glyph + ' ' + m.role).padEnd(14)] })))
      kids.push(line((m) => Box({ width: 14, children: [m.model ? Text({ color: INK, backgroundColor: colorOf(m.model), children: [chip(m.model)] }) : Text({ dimColor: true, children: ['pane'] })] })))
      if (c.more > 0) kids.push(Text({ dimColor: true, children: ['+' + c.more + ' more'] }))
    }
    if (wireLog.length) {
      kids.push(rule(els, 'conversation'))
      for (const w of wireLines(wireLog)) kids.push(Text({ wrap: 'truncate', children: [Text({ dimColor: true, children: [w.at + '  '] }), Text({ color: w.sub ? undefined : hex(WIRE_COLOR), children: [w.arrow + ' '] }), Text({ dimColor: true, children: [w.kind + ' '] }), w.text] }))
    }
    if (decisions.length) {
      kids.push(rule(els, 'routing'))
      for (const d of routingLines(decisions)) kids.push(Text({ wrap: 'truncate', children: [Text({ dimColor: true, children: [d.at + '  '] }), d.who + '  ', Text({ color: d.color, children: [d.route] }), Text({ color: d.escalated ? colorOf('fable') : d.drift ? 'warning' : undefined, dimColor: !d.escalated && !d.drift, children: [d.reason] })] }))
    }
    const bars = tokenBars(ledger(live, lastRun, paneRoutes), Math.max(8, Math.min(30, cols - 30)))
    if (bars.length) {
      kids.push(rule(els, 'tokens'))
      for (const b of bars) kids.push(Text({ children: [b.name + ' ', Text({ color: hex(ACCENT), children: [b.bar] }), Text({ dimColor: true, children: [' ' + b.tok] })] }))
    }
    return Box({ flexDirection: 'column', children: kids })
  })