The per-agent page had these and the swarm terminal did not; they need no new backend. A cancel turn button beside send, shown while the agent is in a turn, posts to the controller's existing cancel route and says whether a turn was stopped. The terminal's badges add the effort and how long the agent has been in its turn state. The expand tool output setting moves to the shared package so both pages render the one component, and the swarm menu gets it. Docs follow.
32 lines
1.3 KiB
TypeScript
32 lines
1.3 KiB
TypeScript
// Settings-menu row: "expand tool output". Rendered as a `<SettingsMenu>`
|
|
// child (`./SettingsMenu.js`) by each page that has a terminal, the per-agent
|
|
// page and the swarm UI, rather than as a prop on the menu: the caller owns its
|
|
// row, and the menu stays free of options only some pages use. Both read the
|
|
// same preference (`../prefs.js`), which `../terminal/Row.tsx` follows live.
|
|
import { useState } from "preact/hooks";
|
|
import { getExpandDetailsPref, setExpandDetailsPref } from "../prefs.js";
|
|
|
|
export function ExpandDetailsSetting() {
|
|
// Plain localStorage read, not a hook-managed override like
|
|
// theme/motion — `getExpandDetailsPref`/`setExpandDetailsPref`
|
|
// (`@hive/shared/prefs.js`) are the existing shared-storage-key pair
|
|
// the terminal itself already reads live (no round-trip needed here
|
|
// beyond re-rendering this row's own checkbox state on toggle).
|
|
const [expandDetails, setExpandDetailsState] = useState(() =>
|
|
getExpandDetailsPref(),
|
|
);
|
|
return (
|
|
<label class="settings-menu-row">
|
|
<span>expand tool output</span>
|
|
<input
|
|
type="checkbox"
|
|
checked={expandDetails}
|
|
onChange={(e) => {
|
|
const v = (e.target as HTMLInputElement).checked;
|
|
setExpandDetailsPref(v);
|
|
setExpandDetailsState(v);
|
|
}}
|
|
/>
|
|
</label>
|
|
);
|
|
}
|