diff --git a/client/src/styles.css b/client/src/styles.css index bdd8e31..707d509 100644 --- a/client/src/styles.css +++ b/client/src/styles.css @@ -2903,3 +2903,11 @@ input.inline:focus { margin: 2px 0 8px; padding-left: 22px; } + +/* Settings: a column of cards in one grid cell (How coders run, then Cloud boxes beside it). */ +.tab-stack { + display: flex; + flex-direction: column; + gap: 16px; + min-width: 0; +} diff --git a/client/src/ui/ManagerConsole.tsx b/client/src/ui/ManagerConsole.tsx index 5870c55..84ce7ab 100644 --- a/client/src/ui/ManagerConsole.tsx +++ b/client/src/ui/ManagerConsole.tsx @@ -3,7 +3,7 @@ import { api } from '../api'; import { PreviewPill, PreviewSettings } from './AppViewer'; import { agentsOnRepo, pendingRequests, useStore, type ManagerTab } from '../store'; import { CHAMBER_DYE_NAMES, CHAMBER_DYES } from '../../../shared/palette'; -import { CEO_ID, type AgentCli, type AgentMachine, type BoxesView, type CliView, type EffortLevel, type OfficeUpdateView, type RepoView } from '../../../shared/types'; +import { CEO_ID, type AgentCli, type AgentMachine, type BoxesView, type CliView, type CloudBoxesSettings, type EffortLevel, type OfficeUpdateView, type RepoView } from '../../../shared/types'; import { DEFAULT_CLOUD_BOXES } from '../../../shared/cloudBoxes'; import { effectiveModel } from '../../../shared/models'; import { BRIEF_MAX, MISSION_MAX, briefCount, tooLong } from '../../../shared/briefs'; @@ -451,7 +451,7 @@ function CeoTab() { // ---------- team ---------- -function TeamTab() { +function TeamTab({ onCloudSettings }: { onCloudSettings?: () => void }) { const repos = useStore((s) => s.repos); const agents = useStore((s) => s.agents); const settings = useStore((s) => s.settings); @@ -465,6 +465,14 @@ function TeamTab() { if (repos.length === 0) return

Connect a repo first; coders need a chamber to work in.

; return (
+ {terminal && !settings.cloudBoxes?.enabled && onCloudSettings && ( +

+ ☁ Coders can also work in their own Upstash Box in the cloud, off this computer.{' '} + +

+ )} {MODELS.map((m) => (
+ ); +} + +/** The Cloud boxes card once it's switched on: the limit, what's set up, the base box and the boxes themselves. */ +function CloudBoxesDetails({ + cloud, + view, + set, + nameOf, + used, +}: { + cloud: CloudBoxesSettings; + view: BoxesView | null; + set: (p: Partial) => void; + nameOf: (id: string | null) => string; + used: number; +}) { + return ( + <>

A review is skipped when nothing changed since the last one. The DungeonMaster's own model and effort are on the DungeonMaster tab.

-
-

How coders run

- - -

- Coders work like your own coding agents in a terminal, with your skills, MCP servers and settings, and don't stop to ask. The dungeon's workflow (branches, pull requests, QA reporting - back) is in their instructions. -

+
+
+

How coders run

+ + +

+ Coders work like your own coding agents in a terminal, with your skills, MCP servers and settings, and don't stop to ask. The dungeon's workflow (branches, pull requests, QA reporting + back) is in their instructions. +

+
+ {terminal && }
- {terminal && }

Your hold