feat: stream real-time progress for agent SDK install/upgrade/uninstall
Replace the spinner-only UX with live log output during agent SDK operations, matching the existing OpenCode plugin install experience. Backend: emit structured events (started/log/completed/failed) via EventEmitter during npm install and binary download. npm commands now run with piped stdio for line-by-line streaming; binary downloads report chunked progress every 1 MB. Frontend: subscribe to `app://agent-install` events through a new `useAgentInstallStream` hook and render a theme-aware log terminal below the preflight checks panel. Also fixes the install log container in both agent settings and the OpenCode plugins modal: auto-scroll no longer shifts the outer page, and colours now follow the active light/dark theme. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -60,7 +60,10 @@ export function OpencodePluginsModal({
|
||||
}, [open])
|
||||
|
||||
useEffect(() => {
|
||||
logEndRef.current?.scrollIntoView({ behavior: "smooth" })
|
||||
const container = logEndRef.current?.parentElement
|
||||
if (container) {
|
||||
container.scrollTop = container.scrollHeight
|
||||
}
|
||||
}, [stream.logs])
|
||||
|
||||
useEffect(() => {
|
||||
@@ -240,11 +243,13 @@ export function OpencodePluginsModal({
|
||||
)}
|
||||
|
||||
{stream.status !== "idle" && (
|
||||
<div className="rounded-md border bg-black/80 text-green-400 p-3 max-h-[200px] overflow-y-auto font-mono text-[11px] leading-relaxed">
|
||||
<div className="rounded-md border bg-muted/50 text-muted-foreground p-3 max-h-[200px] overflow-y-auto font-mono text-[11px] leading-relaxed">
|
||||
{stream.logs.map((line, i) => (
|
||||
<div
|
||||
key={i}
|
||||
className={line.startsWith("ERROR:") ? "text-red-400" : ""}
|
||||
className={
|
||||
line.startsWith("ERROR:") ? "text-destructive" : ""
|
||||
}
|
||||
>
|
||||
{line}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user