@schlenkr/ragents 0.1.10 → 0.1.12

package/apps/web/src/run-panel.tsx

@@ -1,4 +1,4 @@
-// Fremde Klassen von highlight.js und react-diff-view; hier statt in den Komponenten, die auch Mini-Apps bündeln.
+// Foreign classes of highlight.js and react-diff-view; here instead of in the components that mini-apps also bundle.
 import "./highlighting.css";
 import "./diff-view.css";
 import { StrictMode } from "react";
@@ -17,7 +17,7 @@ import { installHostModules } from "./host-modules";
 
 installHostModules();
 const root = document.getElementById("root");
-if (!root) throw new Error("Root-Element fehlt");
+if (!root) throw new Error("Root element is missing");
 
 const reactRoot = createRoot(root);
 try {
@@ -45,8 +45,8 @@ try {
   );
 } catch (cause) {
   reactRoot.render(<AccessScreen>
-    <h1 className="my-3 text-[1.5rem]">Das RAgents-Panel konnte nicht geladen werden</h1>
+    <h1 className="my-3 text-[1.5rem]">The RAgents panel could not be loaded</h1>
     <p className="mb-6 leading-normal" role="alert">{cause instanceof Error ? cause.message : String(cause)}</p>
-    <Button onClick={() => window.location.reload()} variant="outline">Erneut laden</Button>
+    <Button onClick={() => window.location.reload()} variant="outline">Reload</Button>
   </AccessScreen>);
 }

package/apps/web/src/run-preparation.ts

@@ -6,10 +6,10 @@ import type { RpcClient } from "./rpc/client";
 export async function discussRun(sessionId: string, messages: RunPreparationMessage[], signal: AbortSignal, skillName?: string, client: RpcClient = rpc): Promise<RunPreparationResponse> {
   const result = await client.call(coreContracts.prepare, { runId: sessionId, messages, ...(skillName ? { skillName } : {}) }, { signal });
   if (result.kind === "start") {
-    if (!result.input || typeof result.input.text !== "string" || !result.input.text.trim()) throw new Error("Der vorbereitete Startauftrag fehlt.");
+    if (!result.input || typeof result.input.text !== "string" || !result.input.text.trim()) throw new Error("The prepared start task is missing.");
     return result;
   }
-  if (result.kind !== "reply" || typeof result.text !== "string" || !result.text.trim()) throw new Error("Die Vorbereitung hat keine Antwort geliefert.");
+  if (result.kind !== "reply" || typeof result.text !== "string" || !result.text.trim()) throw new Error("The preparation did not return an answer.");
   return result;
 }
 

package/apps/web/src/run-view.ts

@@ -103,7 +103,7 @@ const isRunTurnOutput = (value: unknown): value is RunTurnOutput => {
     && typeof output.occurredAt === "string";
 };
 
-/** Die Modellantworten eines Turns in Journal-Reihenfolge; eine Ansicht ohne das Feld liefert nichts. */
+/** The model responses of a turn in journal order; a view without the field yields nothing. */
 export const runTurnOutputs = (turn: RunTurn): RunTurnOutput[] =>
   (Array.isArray(turn.outputs) ? turn.outputs.filter(isRunTurnOutput) : [])
     .sort((left, right) => left.sequence - right.sequence);
@@ -176,7 +176,7 @@ export interface RunView {
   artifacts: RunArtifact[];
 }
 
-/** Der Gesprächspartner des Run-Chats: der Primary-Actor oder, solange keiner gewählt ist, der als Primary gestoppte Actor. */
+/** The conversation partner of the run chat: the primary actor or, while none is chosen, the actor stopped as primary. */
 export const chatPrimaryId = (view: RunView): string | null => view.primaryActorId ?? view.stoppedPrimaryActorId ?? null;
 
 export type ActorTone = "agent" | "primary" | "script";
@@ -206,7 +206,7 @@ export const runArtifactContentUrl = (runId: string, artifactId: string) => arti
 export const runActorFrom = (value: unknown): RunActor => {
   const actor = value as RunActor | undefined;
   if (typeof actor?.id !== "string" || typeof actor.handle !== "string") {
-    throw new Error("Der Karten-Kontext enthält keinen Actor der Run-Ansicht");
+    throw new Error("The card context contains no actor of the run view");
   }
   return actor;
 };

package/apps/web/src/settings-contributions.ts

@@ -31,13 +31,13 @@ export interface ContributionFilterOption {
 }
 
 export const contributionFilters: readonly ContributionFilterOption[] = [
-  { id: "all", label: "Alle" },
-  { id: "tools", label: "Funktionen" },
+  { id: "all", label: "All" },
+  { id: "tools", label: "Functions" },
   { id: "prompts", label: "Prompts" },
-  { id: "startEntries", label: "Vorlagen" },
+  { id: "startEntries", label: "Templates" },
   { id: "skills", label: "Skills" },
   { id: "hooks", label: "Hooks" },
-  { id: "configuration", label: "Konfiguration" },
+  { id: "configuration", label: "Configuration" },
   { id: "web", label: "Web" },
 ];
 
@@ -82,19 +82,19 @@ export const toolKindLabel = (kind: SettingsTool["kind"]): string => {
 };
 
 export const toolScopeLabel = (scope: SettingsTool["scope"]): string => {
-  if (scope === "global") return "Laufzeitweit";
-  if (scope === "per-agent") return "Je Agent";
-  return "Je Turn";
+  if (scope === "global") return "Runtime-wide";
+  if (scope === "per-agent") return "Per agent";
+  return "Per turn";
 };
 
 export const toolAvailabilityLabel = (availability: SettingsTool["availability"]): string =>
-  availability === "always" ? "Grundsätzlich verfügbar" : "Bedingt verfügbar";
+  availability === "always" ? "Always available" : "Conditionally available";
 
 export const functionSurfaceLabel = (nativeTool: SettingsTool["nativeTool"]): string =>
-  nativeTool === true ? "LLM-Werkzeug" : "TypeScript-Funktion";
+  nativeTool === true ? "LLM tool" : "TypeScript function";
 
 export const skillAudienceLabel = (audience: SettingsSkill["audiences"][number]): string =>
-  audience === "coordinator" ? "Koordinator" : "Agenten";
+  audience === "coordinator" ? "Coordinator" : "Agents";
 
 export const groupContributions = (
   settings: SettingsResponse,
@@ -141,17 +141,17 @@ export const filterGroup = (
   filter: ContributionFilter,
   searchText: string,
 ): PluginGroup => {
-  const needle = searchText.trim().toLocaleLowerCase("de-DE");
+  const needle = searchText.trim().toLocaleLowerCase("en-US");
   const kept = (kind: ContributionKind) => filter === "all" || filter === kind;
   const matches = (haystack: readonly (string | undefined)[]) =>
     needle === "" || haystack.filter((part): part is string => part !== undefined)
-      .join(" ").toLocaleLowerCase("de-DE").includes(needle);
+      .join(" ").toLocaleLowerCase("en-US").includes(needle);
   const configuration = kept("configuration")
     ? group.configuration.filter((entry) => matches([entry.key, entry.source]))
     : [];
   const clientConfig = kept("configuration")
     && group.clientConfig !== undefined
-    && matches([group.id, "Client-Konfiguration", JSON.stringify(group.clientConfig)])
+    && matches([group.id, "Client configuration", JSON.stringify(group.clientConfig)])
     ? group.clientConfig
     : undefined;
   return {
@@ -203,14 +203,14 @@ const webCount = (web: PluginWebModule): number =>
 const filterWebModule = (web: PluginWebModule, needle: string): PluginWebModule => {
   if (web.state !== "contributions") return needle === "" ? web : { state: "hidden" };
   const contributions = web.contributions.filter((contribution) =>
-    [contribution.kind, ...contribution.details].join(" ").toLocaleLowerCase("de-DE").includes(needle));
+    [contribution.kind, ...contribution.details].join(" ").toLocaleLowerCase("en-US").includes(needle));
   return contributions.length === 0 && needle !== "" ? { state: "hidden" } : { state: "contributions", contributions };
 };
 
 const ownersOf = (items: readonly { owner: string }[]): readonly string[] => items.map((item) => item.owner);
 
 export const entryActionLabel = (entry: StartEntry): string =>
-  entry.action === "skill" ? "Skill" : "Run-Script";
+  entry.action === "skill" ? "Skill" : "Run script";
 
 const entrySearchParts = (entry: StartEntry): readonly (string | undefined)[] => [
   entry.id,
@@ -229,24 +229,24 @@ const webModuleOf = (plugin: WebPlugin | undefined): PluginWebModule => {
 };
 
 const webContributionsOf = (plugin: WebPlugin): readonly WebContribution[] => [
-  listed("Reiter der Leiste", (plugin.workspaceTabs ?? []).map((tab) => `${tab.id} (${tab.label})`)),
-  flagged("Dynamische Reiter der Leiste", plugin.workspaceTabsFor !== undefined),
-  listed("Leitfäden", (plugin.guides ?? []).map((guide) => guide.id)),
+  listed("Sidebar tabs", (plugin.workspaceTabs ?? []).map((tab) => `${tab.id} (${tab.label})`)),
+  flagged("Dynamic sidebar tabs", plugin.workspaceTabsFor !== undefined),
+  listed("Guides", (plugin.guides ?? []).map((guide) => guide.id)),
   flagged("Branding", plugin.brand !== undefined),
-  flagged("Fläche", plugin.surface !== undefined),
-  counted("Flächenelemente", (plugin.surfaceElements ?? []).length),
-  counted("Karten-Abschnitte", (plugin.cardSections ?? []).length),
-  counted("Werkzeug-Darstellungen", (plugin.toolPresenters ?? []).length),
-  counted("Entitäts-Darstellungen", (plugin.entityPresenters ?? []).length),
-  counted("Session-Kopfbeiträge", (plugin.sessionHeaders ?? []).length),
-  listed("Übersichtsbeiträge", (plugin.overviewPanels ?? []).map((panel) => panel.id)),
-  listed("Einstellungen", (plugin.settings ?? []).map((setting) => `${setting.id} (${setting.label})`)),
-  counted("Session-Metadaten", (plugin.sessionMetadata ?? []).length),
-  counted("Attention-Beiträge", (plugin.attention ?? []).length),
-  listed("Startoptionen", (plugin.startOptions ?? []).map((option) => option.id)),
-  flagged("Chat-Darstellung", plugin.chatDisplayPolicy !== undefined),
-  listed("Aktionsdarstellungen", (plugin.actionViews ?? []).map((view) => view.owner)),
-  flagged("Session-Provider", plugin.SessionProvider !== undefined),
+  flagged("Surface", plugin.surface !== undefined),
+  counted("Surface elements", (plugin.surfaceElements ?? []).length),
+  counted("Card sections", (plugin.cardSections ?? []).length),
+  counted("Tool presenters", (plugin.toolPresenters ?? []).length),
+  counted("Entity presenters", (plugin.entityPresenters ?? []).length),
+  counted("Session header contributions", (plugin.sessionHeaders ?? []).length),
+  listed("Overview contributions", (plugin.overviewPanels ?? []).map((panel) => panel.id)),
+  listed("Settings", (plugin.settings ?? []).map((setting) => `${setting.id} (${setting.label})`)),
+  counted("Session metadata", (plugin.sessionMetadata ?? []).length),
+  counted("Attention contributions", (plugin.attention ?? []).length),
+  listed("Start options", (plugin.startOptions ?? []).map((option) => option.id)),
+  flagged("Chat display", plugin.chatDisplayPolicy !== undefined),
+  listed("Action views", (plugin.actionViews ?? []).map((view) => view.owner)),
+  flagged("Session provider", plugin.SessionProvider !== undefined),
 ].filter((contribution): contribution is WebContribution => contribution !== undefined);
 
 const listed = (kind: string, details: readonly string[]): WebContribution | undefined =>

package/apps/web/src/theme.ts

@@ -6,8 +6,8 @@ export type ThemePreference = "light" | "dark" | "system";
 export type ResolvedTheme = Exclude<ThemePreference, "system">;
 
 export const themeOptions = [
-  { value: "light", label: "Hell" },
-  { value: "dark", label: "Dunkel" },
+  { value: "light", label: "Light" },
+  { value: "dark", label: "Dark" },
   { value: "system", label: "System" },
 ] as const;
 
@@ -20,7 +20,7 @@ interface ThemeSnapshot {
 export function parseThemePreference(value: string | null): ThemePreference {
   if (value === null) return "dark";
   if (value === "light" || value === "dark" || value === "system") return value;
-  throw new Error(`Ungültige Darstellung in ${THEME_STORAGE_KEY}: ${JSON.stringify(value)}. Erlaubt sind light, dark und system.`);
+  throw new Error(`Invalid theme in ${THEME_STORAGE_KEY}: ${JSON.stringify(value)}. Allowed are light, dark, and system.`);
 }
 
 const errorMessage = (cause: unknown) => cause instanceof Error ? cause.message : String(cause);
@@ -32,7 +32,7 @@ export function createThemeStore(browser: Window) {
     storage = browser.localStorage;
     preference = parseThemePreference(storage.getItem(THEME_STORAGE_KEY));
   } catch (cause) {
-    throw new Error(`Die gespeicherte Darstellung konnte nicht geladen werden. ${errorMessage(cause)}`);
+    throw new Error(`The saved theme could not be loaded. ${errorMessage(cause)}`);
   }
   const media = browser.matchMedia("(prefers-color-scheme: dark)");
   const appearanceOf = (value: ThemePreference): ResolvedTheme => value === "system" ? media.matches ? "dark" : "light" : value;
@@ -78,7 +78,7 @@ export function createThemeStore(browser: Window) {
     try {
       apply(parseThemePreference(storage.getItem(THEME_STORAGE_KEY)));
     } catch (cause) {
-      reportError(`Die Darstellung aus einem anderen Browser-Tab konnte nicht übernommen werden. ${errorMessage(cause)}`);
+      reportError(`The theme from another browser tab could not be applied. ${errorMessage(cause)}`);
     }
   }
 
@@ -88,18 +88,18 @@ export function createThemeStore(browser: Window) {
   return {
     getSnapshot: () => snapshot,
     subscribe(listener: () => void) {
-      if (disposed) throw new Error("Die Darstellung wurde bereits beendet.");
+      if (disposed) throw new Error("The theme has already been disposed.");
       listeners.add(listener);
       return () => { listeners.delete(listener); };
     },
     setPreference(next: ThemePreference) {
-      if (disposed) throw new Error("Die Darstellung wurde bereits beendet.");
+      if (disposed) throw new Error("The theme has already been disposed.");
       try {
         parseThemePreference(next);
         storage.setItem(THEME_STORAGE_KEY, next);
         apply(next);
       } catch (cause) {
-        reportError(`Die Darstellung konnte nicht gespeichert werden. ${errorMessage(cause)}`);
+        reportError(`The theme could not be saved. ${errorMessage(cause)}`);
       }
     },
     dispose() {
@@ -122,7 +122,7 @@ export function initializeTheme(browser: Window) {
 }
 
 export function getThemeStore() {
-  if (!activeTheme) throw new Error("Die Darstellung wurde noch nicht initialisiert.");
+  if (!activeTheme) throw new Error("The theme has not been initialized yet.");
   return activeTheme;
 }
 

package/apps/web/src/title-model-settings.ts

@@ -13,12 +13,12 @@ export function titleModelSettingsFrom(value: unknown): TitleModelSettings {
   if (!isRecord(value) || !Array.isArray(value.models)
     || !value.models.every((model) => isRecord(model) && text(model.provider) && text(model.id) && text(model.label))
     || (value.selection !== null && (!isRecord(value.selection) || !text(value.selection.provider) || !text(value.selection.model)))) {
-    throw new Error("Der Server hat ungültige Einstellungen für Überschriften geliefert.");
+    throw new Error("The server returned invalid title settings.");
   }
   const settings = value as unknown as TitleModelSettings;
   const keys = settings.models.map((model) => titleSelectionKey({ provider: model.provider, model: model.id }));
   if (new Set(keys).size !== keys.length || (settings.selection !== null && !keys.includes(titleSelectionKey(settings.selection)))) {
-    throw new Error("Die Einstellungen für Überschriften passen nicht zum verfügbaren Modellkatalog.");
+    throw new Error("The title settings do not match the available model catalog.");
   }
   return settings;
 }
@@ -26,16 +26,16 @@ export function titleModelSettingsFrom(value: unknown): TitleModelSettings {
 export function titleSelectionFromKey(key: string, models: TitleModelSettings["models"]): TitleModelSelection | null {
   if (key === "null") return null;
   const model = models.find((entry) => titleSelectionKey({ provider: entry.provider, model: entry.id }) === key);
-  if (!model) throw new Error("Das ausgewählte Modell für Überschriften ist nicht verfügbar.");
+  if (!model) throw new Error("The selected model for titles is not available.");
   return { provider: model.provider, model: model.id };
 }
 
 export function titleModelOptions(models: TitleModelSettings["models"], selection: TitleModelSelection | null, query: string) {
-  const search = query.trim().toLocaleLowerCase("de-DE");
+  const search = query.trim().toLocaleLowerCase("en-US");
   return [
-    { value: "null", label: "Keine automatischen Überschriften" },
+    { value: "null", label: "No automatic titles" },
     ...models.filter((model) => (model.provider === selection?.provider && model.id === selection.model)
-      || `${model.label} ${model.id}`.toLocaleLowerCase("de-DE").includes(search))
+      || `${model.label} ${model.id}`.toLocaleLowerCase("en-US").includes(search))
       .map((model) => ({ value: titleSelectionKey({ provider: model.provider, model: model.id }), label: model.label })),
   ];
 }

package/apps/web/src/ui/ListDetail.tsx

@@ -28,7 +28,7 @@ export interface ListDetailProps {
   className?: string;
 }
 
-// Tone und Tonfläche kommen aus data-tone und färben Symbol, Titel und Detailkopf.
+// Tone and tone surface come from data-tone and color the icon, title and detail header.
 const toneVariables = "[--tone:var(--muted-foreground)] [--tone-soft:var(--secondary)] "
   + "data-[tone=accent]:[--tone:var(--primary)] data-[tone=accent]:[--tone-soft:var(--accent)] "
   + "data-[tone=success]:[--tone:var(--success)] data-[tone=success]:[--tone-soft:var(--success-soft)] "
@@ -43,7 +43,7 @@ const itemClasses = cn(toneVariables, focusRing,
 
 const paneClasses = "min-h-0 min-w-0 flex-auto overflow-auto overscroll-contain [scrollbar-gutter:stable]";
 
-// Maßgeblich ist die Breite des Bausteins, nicht die des Fensters; CSS und Messung nutzen dieselbe Schwelle.
+// What counts is the width of the component, not that of the window; CSS and measurement use the same threshold.
 const narrowWidth = 900;
 
 /** Controlled grouped selection with a detail page and a return path on narrow screens. */
@@ -60,7 +60,7 @@ export function ListDetail({ label, items, selectedId, onSelect, disabled = fals
   const groups = new Map<string, ListDetailItem[]>();
   const ids = new Set<string>();
   for (const item of items) {
-    if (!item.id.trim() || ids.has(item.id)) throw new Error("ListDetail-Einträge benötigen eindeutige, nicht leere IDs.");
+    if (!item.id.trim() || ids.has(item.id)) throw new Error("ListDetail entries require unique, non-empty IDs.");
     ids.add(item.id);
     const key = item.group ?? "";
     const group = groups.get(key) ?? [];
@@ -72,7 +72,7 @@ export function ListDetail({ label, items, selectedId, onSelect, disabled = fals
 
   useEffect(() => {
     const root = rootRef.current;
-    if (!root) throw new Error("ListDetail benötigt sein Wurzelelement für die Breitenmessung.");
+    if (!root) throw new Error("ListDetail requires its root element for the width measurement.");
     const observer = new ResizeObserver(([entry]) => {
       const next = entry.contentRect.width < narrowWidth;
       setNarrow(next);
@@ -111,10 +111,10 @@ export function ListDetail({ label, items, selectedId, onSelect, disabled = fals
     <div className="grid min-h-0 min-w-0 flex-auto grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)] grid-rows-[minmax(0,1fr)] gap-6 @max-[900px]/list-detail:grid-cols-[minmax(0,1fr)] @max-[900px]/list-detail:gap-0">
       <div aria-label={label} className={cn(paneClasses, focusRing, "pt-0.5 pr-1.5 pb-3 @max-[900px]/list-detail:group-data-[detail=true]/list-detail:hidden")}
         ref={listRef} role="region" tabIndex={-1}>
-        {items.length === 0 ? <div className="p-6 text-[0.8rem] leading-relaxed text-muted-foreground">{emptyState ?? <p>Keine Einträge vorhanden.</p>}</div>
+        {items.length === 0 ? <div className="p-6 text-[0.8rem] leading-relaxed text-muted-foreground">{emptyState ?? <p>No entries available.</p>}</div>
           : [...groups].map(([group, entries], groupIndex) => <section aria-labelledby={group ? `${prefix}-group-${groupIndex}` : undefined} className="not-first:mt-4.5" key={group}>
             {group && <h3 className="mx-2 mb-2 flex items-center gap-2.5 text-[0.67rem] font-bold tracking-[0.04em] text-muted-foreground" id={`${prefix}-group-${groupIndex}`}>
-              {group}<span className="font-mono text-[0.63rem] opacity-80" aria-label={`${entries.length} Einträge`}>{entries.length}</span>
+              {group}<span className="font-mono text-[0.63rem] opacity-80" aria-label={`${entries.length} entries`}>{entries.length}</span>
             </h3>}
             <ul className="grid grid-cols-[minmax(0,1fr)] gap-1 *:min-w-0">
               {entries.map((item) => <li key={item.id}>
@@ -138,11 +138,11 @@ export function ListDetail({ label, items, selectedId, onSelect, disabled = fals
         data-tone={selected?.tone ?? "neutral"}
         id={`${prefix}-detail`} ref={detailRef} tabIndex={-1}>
         {selected ? <>
-          <div className="hidden flex-none border-b border-border-soft px-3.5 py-2.5 @max-[900px]/list-detail:flex"><Button aria-label="Zur Auswahl" className="rounded-full" onClick={returnToList} size="icon" variant="outline"><ArrowLeftIcon /></Button></div>
+          <div className="hidden flex-none border-b border-border-soft px-3.5 py-2.5 @max-[900px]/list-detail:flex"><Button aria-label="Back to selection" className="rounded-full" onClick={returnToList} size="icon" variant="outline"><ArrowLeftIcon /></Button></div>
           {detailHeader !== undefined && <header className="flex-none border-b border-border-soft bg-(--tone-soft) px-6 py-6 [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 @max-[900px]/list-detail:p-4.5">{detailHeader}</header>}
-          <div aria-label={`${detailLabel}: Inhalt`} className={cn(paneClasses, focusRing, "flex-1 px-6 py-6 text-[0.8rem] leading-[1.7] [overflow-wrap:anywhere] [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 @max-[900px]/list-detail:p-4.5")} role="region" tabIndex={0}>{children}</div>
+          <div aria-label={`${detailLabel}: content`} className={cn(paneClasses, focusRing, "flex-1 px-6 py-6 text-[0.8rem] leading-[1.7] [overflow-wrap:anywhere] [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 @max-[900px]/list-detail:p-4.5")} role="region" tabIndex={0}>{children}</div>
           {detailFooter !== undefined && <footer className="flex flex-none flex-wrap items-center gap-2.5 border-t border-border-soft px-6 py-4 @max-[900px]/list-detail:px-4.5 @max-[900px]/list-detail:py-3.5">{detailFooter}</footer>}
-        </> : <div className="p-6 text-[0.8rem] leading-relaxed text-muted-foreground"><p>{items.length ? "Wähle einen Eintrag, um die Details zu sehen." : "Keine Auswahl verfügbar."}</p></div>}
+        </> : <div className="p-6 text-[0.8rem] leading-relaxed text-muted-foreground"><p>{items.length ? "Choose an entry to see the details." : "No selection available."}</p></div>}
       </section>
     </div>
   </section>;

package/apps/web/src/ui/dialog.tsx

@@ -151,7 +151,7 @@ function DialogContent({
             }
           >
             <XIcon />
-            <span className="sr-only">Schließen</span>
+            <span className="sr-only">Close</span>
           </DialogPrimitive.Close>
         )}
       </DialogPrimitive.Popup>
@@ -199,7 +199,7 @@ function DialogFooter({
       {children}
       {showCloseButton && (
         <DialogPrimitive.Close render={<Button variant="outline" />}>
-          Schließen
+          Close
         </DialogPrimitive.Close>
       )}
     </div>

package/apps/web/src/ui/modal-controller.ts

@@ -37,12 +37,12 @@ export function createModalController({ nextBehavior, onClose, onNavigate }: {
   return {
     get canGoBack() { return history.length > 1; },
     open(page: ModalPage) {
-      if (!page.title.trim()) throw new Error("Ein Dialogschritt benötigt einen Titel.");
+      if (!page.title.trim()) throw new Error("A dialog step requires a title.");
       const previous = nextBehavior() === "push" ? history : history.slice(0, -1);
       update([...previous, { key: nextKey++, page }]);
     },
     back() {
-      if (history.length < 2) throw new Error("Es gibt keinen vorherigen Dialogschritt.");
+      if (history.length < 2) throw new Error("There is no previous dialog step.");
       update(history.slice(0, -1));
     },
     close() { onClose(); },
@@ -65,6 +65,6 @@ export const ModalControllerContext = createContext<ModalController | null>(null
 
 export function useModalController(): ModalController {
   const controller = useContext(ModalControllerContext);
-  if (!controller) throw new Error("Die Dialogsteuerung benötigt einen Modal-Host.");
+  if (!controller) throw new Error("The dialog controller requires a modal host.");
   return controller;
 }

package/apps/web/src/ui/modal.tsx

@@ -18,7 +18,7 @@ export interface ModalProps extends PropsWithChildren {
   keepMounted?: boolean;
 }
 
-/** A dialog frame whose contents can push further steps; Zurück, Escape and the backdrop return to the previous step first. */
+/** A dialog frame whose contents can push further steps; Back, Escape and the backdrop return to the previous step first. */
 export function Modal({ children, className, initialFocus, keepMounted, nextBehavior = "push", onClose, open = true, overlayClassName, scope = "run", showCloseButton = false, size = "medium" }: ModalProps) {
   const onCloseRef = useRef(onClose);
   onCloseRef.current = onClose;
@@ -45,7 +45,7 @@ export function Modal({ children, className, initialFocus, keepMounted, nextBeha
             <div className={cn("contents", entry.key !== current.key && "hidden")} hidden={entry.key !== current.key} inert={entry.key !== current.key} key={entry.key}>
               {entry.page ? <>
                 <DialogHeader className="flex-row items-start gap-3 px-4 pt-4 pb-3">
-                  <Button aria-label="Zurück" onClick={controller.back} size="icon-sm" variant="ghost"><ArrowLeftIcon /></Button>
+                  <Button aria-label="Back" onClick={controller.back} size="icon-sm" variant="ghost"><ArrowLeftIcon /></Button>
                   <div className="flex min-w-0 flex-1 flex-col gap-1">
                     <DialogTitle>{entry.page.title}</DialogTitle>
                     {entry.page.subtitle && <DialogDescription>{entry.page.subtitle}</DialogDescription>}

package/apps/web/src/ui/popover.tsx

@@ -26,7 +26,7 @@ function PopoverContent({
     PopoverPrimitive.Positioner.Props,
     "align" | "alignOffset" | "side" | "sideOffset" | "anchor" | "collisionPadding"
   > & Pick<PopoverPrimitive.Portal.Props, "keepMounted"> & {
-    /** Dunkelt den Rest der Seite ab, damit sich das Pop-out absetzt; Klick daneben schließt es. */
+    /** Dims the rest of the page so the pop-out stands out; a click outside closes it. */
     dim?: boolean
   }) {
   return (

package/apps/web/src/ui/relative-time.ts

@@ -4,33 +4,33 @@ const DAY = 24 * HOUR;
 const WEEK = 7 * DAY;
 
 const date = (at: number, year: boolean): string =>
-  new Date(at).toLocaleDateString("de-DE", year ? { day: "2-digit", month: "2-digit", year: "numeric" } : { day: "2-digit", month: "2-digit" });
+  new Date(at).toLocaleDateString("en-US", year ? { day: "2-digit", month: "2-digit", year: "numeric" } : { day: "2-digit", month: "2-digit" });
 
-/** Die Zeit in der Liste: jetzt, 5 min, 3 h, 2 d, ab sieben Tagen das Datum. Ohne "vor", ohne Sonderfall für gestern. */
+/** The time in the list: now, 5 min, 3 h, 2 d, from seven days on the date. Without "ago", without a special case for yesterday. */
 export const shortTime = (at: number, now: number = Date.now()): string => {
   const passed = now - at;
-  if (passed < MINUTE) return "jetzt";
+  if (passed < MINUTE) return "now";
   if (passed < HOUR) return `${Math.floor(passed / MINUTE)} min`;
   if (passed < DAY) return `${Math.floor(passed / HOUR)} h`;
   if (passed < WEEK) return `${Math.floor(passed / DAY)} d`;
   return date(at, false);
 };
 
-/** Dieselbe Zeit ausgeschrieben; sie steht nur im title der kompakten Zeit. */
+/** The same time written out; it appears only in the title of the compact time. */
 export const longTime = (at: number, now: number = Date.now()): string => {
   const passed = now - at;
-  if (passed < MINUTE) return "gerade eben";
+  if (passed < MINUTE) return "just now";
   if (passed < HOUR) {
     const minutes = Math.floor(passed / MINUTE);
-    return minutes === 1 ? "vor 1 Minute" : `vor ${minutes} Minuten`;
+    return minutes === 1 ? "1 minute ago" : `${minutes} minutes ago`;
   }
   if (passed < DAY) {
     const hours = Math.floor(passed / HOUR);
-    return hours === 1 ? "vor 1 Stunde" : `vor ${hours} Stunden`;
+    return hours === 1 ? "1 hour ago" : `${hours} hours ago`;
   }
   if (passed < WEEK) {
     const days = Math.floor(passed / DAY);
-    return days === 1 ? "vor 1 Tag" : `vor ${days} Tagen`;
+    return days === 1 ? "1 day ago" : `${days} days ago`;
   }
   return date(at, true);
 };

package/apps/web/src/ui/startup-notice.tsx

@@ -1,14 +1,14 @@
 import type { ReactNode } from "react";
 import { cn } from "cn";
 
-/** Was eine Fläche zeigt, solange sie noch keinen Inhalt hat: laufende Arbeit, einen Fehler oder einen ruhigen Hinweis. */
+/** What a surface shows while it has no content yet: ongoing work, an error or a calm notice. */
 export interface StartupNoticeState {
   kind: "working" | "error" | "waiting" | "stopped";
   title: string;
   detail: string;
 }
 
-/** Der eine Ladezustand für Fläche, Run-Panel und dessen Start: Titel, bei laufender Arbeit ein Fortschrittsbalken, darunter was gerade geschieht. */
+/** The one loading state for surface, run panel and its start: title, a progress bar while work is running, below it what is happening right now. */
 export function StartupNotice({ children, className, state }: { children?: ReactNode; className?: string; state: StartupNoticeState }) {
   return <div aria-live="polite" className={cn("w-[min(360px,100%)] text-center text-foreground", className)} data-startup={state.kind}
     role={state.kind === "error" ? "alert" : "status"}>

package/apps/web/src/ui/state-icon.tsx

@@ -11,7 +11,7 @@ interface Mark {
   readonly filled?: boolean;
 }
 
-/** Grün läuft, blau bewegt sich, gelb wartet auf dich, rot ist kaputt, grau ruht, gedämpft ist vorbei; kein Zustand trägt je die Stopp-Glyphe (Quadrat). */
+/** Green is running, blue is moving, yellow is waiting for you, red is broken, gray is idle, muted is over; no state ever carries the stop glyph (square). */
 const RUN_MARKS: Record<RunStateName, Mark> = {
   running: { Icon: CirclePlayIcon, tone: "text-success" },
   waiting: { Icon: CircleEllipsisIcon, tone: "text-warning" },

package/apps/web/src/ui/state-vocabulary.ts

@@ -1,30 +1,30 @@
-/** Das Vokabular aller Seiten: je Zustand genau ein Wort, das im Panel nur als title erscheint. */
+/** The vocabulary of all pages: exactly one word per state, which appears in the panel only as a title. */
 export type RunStateName = "running" | "waiting" | "idle" | "ended" | "failed" | "cancelled";
 
 export type ConnectionStateName =
   | "connected" | "ready" | "starting" | "login-required" | "unreachable" | "stopped" | "failed" | "forbidden";
 
 const RUN_WORDS: Record<RunStateName, string> = {
-  running: "läuft",
-  waiting: "wartet auf Eingabe",
-  idle: "ruht",
-  ended: "beendet",
-  failed: "fehlgeschlagen",
-  cancelled: "abgebrochen",
+  running: "running",
+  waiting: "waiting for input",
+  idle: "idle",
+  ended: "ended",
+  failed: "failed",
+  cancelled: "cancelled",
 };
 
 const CONNECTION_WORDS: Record<ConnectionStateName, string> = {
-  connected: "verbunden",
-  ready: "bereit",
-  starting: "startet",
-  "login-required": "Anmeldung nötig",
-  unreachable: "nicht erreichbar",
-  stopped: "gestoppt",
-  failed: "gescheitert",
-  forbidden: "kein Zugriff",
+  connected: "connected",
+  ready: "ready",
+  starting: "starting",
+  "login-required": "sign-in required",
+  unreachable: "unreachable",
+  stopped: "stopped",
+  failed: "failed",
+  forbidden: "no access",
 };
 
-/** Wartet ein Run, nennt das Wort die Zahl offener Eingaben; ein Werkzeugname steht nie im Zustand. */
+/** When a run is waiting, the word names the number of open inputs; a tool name never appears in the state. */
 export const runStateWord = (state: RunStateName, open = 0): string =>
   state === "waiting" && open > 0 ? `${RUN_WORDS.waiting} (${open})` : RUN_WORDS[state];
 

package/apps/web/src/ui/stop-button.tsx

@@ -4,14 +4,14 @@ import { cn } from "cn";
 import { Button } from "./button";
 import { Spinner } from "./spinner";
 
-/** Die eine Stopp-Glyphe: ein gefülltes rotes Quadrat; ein Zustandssymbol trägt sie nie. */
+/** The one stop glyph: a filled red square; a state icon never carries it. */
 export function StopGlyph({ className, ...props }: Omit<ComponentProps<typeof SquareIcon>, "fill">) {
   return <SquareIcon aria-hidden className={cn("text-destructive", className)} fill="currentColor" {...props} />;
 }
 
 const stopButtonClass = "text-destructive hover:bg-destructive/10 hover:text-destructive dark:hover:bg-destructive/20";
 
-/** Jeder Stopp-Knopf sieht gleich aus: die Glyphe als Symbol, das Wort im Tooltip, rot in Ruhe und beim Hover. */
+/** Every stop button looks the same: the glyph as the icon, the word in the tooltip, red at rest and on hover. */
 export function StopButton({ label, busy = false, className, title, ...props }: Omit<ComponentProps<typeof Button>, "children" | "variant"> & {
   label: string;
   busy?: boolean;

package/bundles/ragents.activity/ragents-bundle.json

@@ -1,5 +1,5 @@
 {
-  "format": 4,
+  "format": 5,
   "id": "ragents.activity",
   "api": 7,
   "hostNames": {
@@ -22,8 +22,8 @@
       ]
     }
   },
-  "stand": "76950227a2595ee5aa386c266cfe5a251b86943efffeda64a971b986ae33faec",
-  "sourceStand": "9f88ec345adcc08f5f6e58e26fbff420969a87fc466c926300b88416fff25856",
+  "revision": "b7b04d050f5f4bcb0980880167b8e2cdd3ad533ba07f589dd0de471b9e55c0fd",
+  "sourceRevision": "d0f96d5406c652a4ed17f8642adfc889bb3be49fc7948f84e0f889ecb910f26e",
   "server": "server/index.js",
   "web": {
     "entry": "web/index.js",

package/bundles/ragents.activity/web/classes.json

@@ -1 +1 @@
-["active","activeActivity","activity","activitySourceFrom","actor","actorFrom","actorId","actors","animate-fade-pulse","aria-hidden","aria-label","as","aus","bg-muted-foreground","byStart","className","const","dann","das","data-kind","der","displayName","eine","elapsed","elapsedLabel","emptySource","entries","entry","ergibt","export","finishedAt","flex","flex-1","flex-none","fremde","from","function","gap-2","geladene","gerade","h","handle","hidden","id","if","import","in-data-[kind=tool]:bg-primary","inspect","interface","is","isRecord","items-baseline","items-stretch","jeweils","key","kind","kindLabels","label","labelOf","laufende","left","length","live","m","min-w-0","minutes","ml-auto","motion-reduce:animate-none","name","needsRunView","nicht","noch","now","null","number","object","oder","offene","optionalText","order","parsed","primaryActorId","react","readRight","readonly","return","right","role","rounded-full","runView","running","runningToolCalls","runningTools","runningTurns","s","seconds","self-stretch","session","sessionHeaders","setNow","shrink-0","size-1.5","source","started","startedAt","startedMillis","state","status","string","tabular-nums","text-[inherit]","text-muted-foreground","timer","title","titleOf","tool","toolCalls","toolFrom","turn","turnFrom","turns","type","typeof","uft","und","undefined","useState","value","w-45","webPlugin","weitere","whitespace-nowrap"]
+["a","active","activeActivity","activity","activitySourceFrom","actor","actorFrom","actorId","actors","and","animate-fade-pulse","aria-hidden","aria-label","as","bg-muted-foreground","byStart","calls","className","const","current","data-kind","displayName","each","elapsed","elapsedLabel","emptySource","entries","entry","export","finishedAt","first","flex","flex-1","flex-none","from","function","gap-2","h","handle","hidden","id","if","import","in","in-data-[kind=tool]:bg-primary","inspect","interface","is","isRecord","items-baseline","items-stretch","key","kind","kindLabels","label","labelOf","left","length","live","loaded","m","min-w-0","minutes","ml-auto","more","motion-reduce:animate-none","name","needsRunView","not","now","null","number","object","oldest","open","optionalText","or","order","parsed","primaryActorId","react","readRight","readonly","return","right","role","rounded-full","run","runView","running","runningToolCalls","runningTools","runningTurns","s","seconds","self-stretch","session","sessionHeaders","setNow","shrink-0","size-1.5","source","started","startedAt","startedMillis","state","status","string","structure","tabular-nums","text-[inherit]","text-muted-foreground","that","the","then","timer","title","titleOf","tool","toolCalls","toolFrom","turn","turnFrom","turns","type","typeof","undefined","unknown","useState","value","w-45","webPlugin","whitespace-nowrap","yet","yields"]