Polish editor dirty state and monitoring UI

Author: pallyoung

packages/server/src/__tests__/monitoring/aggregation.test.ts

@@ -40,6 +40,9 @@ describe("buildMonitoringSnapshot", () => {
           startedAt: 2,
         },
       ],
+      workspaceLabels: {
+        "ws-1": "coder-studio",
+      },
       processRows: [
         {
           pid: 1,
@@ -74,6 +77,7 @@ describe("buildMonitoringSnapshot", () => {
     expect(response.snapshot.workspaces[0]).toEqual(
       expect.objectContaining({
         id: "workspace:ws-1",
+        label: "coder-studio",
         cpuPercent: 25,
         memoryBytes: 250,
       })
@@ -88,6 +92,43 @@ describe("buildMonitoringSnapshot", () => {
     expect(response.snapshot.subprocessGroups[0]?.parentId).toBe("session:sess-1");
   });
 
+  it("falls back to the workspace id when no readable label is available", () => {
+    const response = buildMonitoringSnapshot({
+      settings: {
+        ...createDefaultMonitoringSettings(),
+        enabled: true,
+      },
+      sampledAt: 100,
+      host: null,
+      roots: [
+        {
+          ownerId: "terminal:term-1",
+          rootPid: 100,
+          kind: "terminal",
+          label: "Codex",
+          workspaceId: "ws_1779980247607_u2lfvdjf",
+          sessionId: "sess-1",
+          terminalId: "term-1",
+          providerId: "codex",
+          startedAt: 2,
+        },
+      ],
+      processRows: [
+        {
+          pid: 100,
+          ppid: 1,
+          cpuPercent: 20,
+          rssBytes: 200,
+          elapsedSec: 90,
+          command: "codex",
+        },
+      ],
+      previousSnapshot: null,
+    });
+
+    expect(response.snapshot.workspaces[0]?.label).toBe("ws_1779980247607_u2lfvdjf");
+  });
+
   it("keeps host data when process collection fails", () => {
     const response = buildMonitoringSnapshot({
       settings: {

packages/server/src/__tests__/monitoring/service.test.ts

@@ -334,6 +334,108 @@ describe("MonitoringService", () => {
     );
   });
 
+  it("labels workspace attribution rows with readable workspace names", async () => {
+    const registry = new ManagedProcessRegistry({ now: () => 10 });
+    const service = new MonitoringService({
+      broadcaster: { broadcast: vi.fn() },
+      settingsRepo: {
+        get: (key: string) => {
+          const settings = {
+            "monitoring.enabled": true,
+            "monitoring.hostMetricsEnabled": true,
+            "monitoring.runtimeSummaryEnabled": true,
+            "monitoring.workspaceAttributionEnabled": true,
+            "monitoring.subprocessDrilldownEnabled": false,
+            "monitoring.sampleIntervalMs": 2000,
+          } as Record<string, unknown>;
+          return settings[key];
+        },
+      },
+      registry,
+      sessionMgr: {
+        getAll: () =>
+          [
+            {
+              id: "sess-1",
+              workspaceId: "ws_1779980247607_u2lfvdjf",
+              terminalId: "term-1",
+              providerId: "codex",
+              state: "idle",
+              capability: "full",
+              startedAt: 1,
+              lastActiveAt: 1,
+              title: "Codex",
+            },
+          ] satisfies Session[],
+        findSessionIdByTerminal: () => "sess-1",
+      },
+      workspaceMgr: {
+        get: (workspaceId: string) =>
+          workspaceId === "ws_1779980247607_u2lfvdjf"
+            ? {
+                id: workspaceId,
+                path: "/home/spencer/workspace/coder-studio",
+              }
+            : undefined,
+      },
+      terminalMgr: {
+        getAll: () => [
+          {
+            toDTO: () =>
+              ({
+                id: "term-1",
+                workspaceId: "ws_1779980247607_u2lfvdjf",
+                kind: "agent",
+                title: "Codex",
+                cwd: "/home/spencer/workspace/coder-studio",
+                argv: ["codex"],
+                cols: 120,
+                rows: 30,
+                pid: 100,
+                alive: true,
+                createdAt: 1,
+              }) satisfies Terminal,
+          },
+        ],
+      },
+      hostCollector: {
+        collect: () => ({
+          cpuPercent: 40,
+          memoryUsedBytes: 400,
+          memoryTotalBytes: 1000,
+          memoryAvailableBytes: 600,
+          loadAverage: [0.2, 0.2, 0.1],
+          uptimeSec: 10,
+          pressure: "normal",
+        }),
+      },
+      processCollector: {
+        collect: async () => [
+          { pid: 100, ppid: 1, cpuPercent: 10, rssBytes: 100, elapsedSec: 5, command: "codex" },
+        ],
+      },
+      setInterval: vi.fn(() => ({ unref: vi.fn() })),
+      clearInterval: vi.fn(),
+      now: () => 10,
+    });
+
+    service.start();
+    const response = await service.recheck();
+
+    expect(response.snapshot.workspaces[0]).toEqual(
+      expect.objectContaining({
+        id: "workspace:ws_1779980247607_u2lfvdjf",
+        label: "coder-studio",
+      })
+    );
+    expect(response.snapshot.sessions[0]).toEqual(
+      expect.objectContaining({
+        parentId: "workspace:ws_1779980247607_u2lfvdjf",
+        label: "Codex",
+      })
+    );
+  });
+
   it("unregisters terminal roots that are no longer active", async () => {
     const registry = new ManagedProcessRegistry({ now: () => 10 });
     let sessions: Session[] = [

packages/server/src/monitoring/aggregation.ts

@@ -86,6 +86,7 @@ export function buildMonitoringSnapshot(input: {
   sampledAt: number;
   host: MonitoringHostSummary | null;
   roots: ManagedProcessRoot[];
+  workspaceLabels?: Record<string, string>;
   processRows: ProcessStatRow[] | null;
   previousSnapshot: MonitoringSnapshot | null;
   failureReason?: string;
@@ -213,7 +214,7 @@ export function buildMonitoringSnapshot(input: {
         id: workspaceId,
         kind: "workspace",
         workspaceId: root.workspaceId,
-        label: root.workspaceId,
+        label: input.workspaceLabels?.[root.workspaceId] ?? root.workspaceId,
         cpuPercent: 0,
         memoryBytes: 0,
         processCount: 0,

packages/server/src/monitoring/service.ts

@@ -1,3 +1,4 @@
+import { basename } from "node:path";
 import {
   createEmptyMonitoringResponse,
   deriveMonitoringMode,
@@ -6,6 +7,7 @@ import {
   type Session,
   type Terminal,
   Topics,
+  type Workspace,
 } from "@coder-studio/core";
 import { buildMonitoringSnapshot } from "./aggregation.js";
 import { MonitoringHistoryStore } from "./history-store.js";
@@ -37,6 +39,9 @@ export class MonitoringService {
         getAll(): Session[];
         findSessionIdByTerminal(terminalId: string): string | undefined;
       };
+      workspaceMgr?: {
+        get(workspaceId: string): Pick<Workspace, "id" | "name" | "path"> | undefined;
+      };
       terminalMgr: {
         getAll(): ActiveTerminalLike[];
       };
@@ -171,6 +176,22 @@ export class MonitoringService {
     }
   }
 
+  private getWorkspaceLabels(roots: ReturnType<ManagedProcessRegistry["listRoots"]>) {
+    const labels: Record<string, string> = {};
+    for (const root of roots) {
+      if (!root.workspaceId || labels[root.workspaceId]) {
+        continue;
+      }
+
+      const workspace = this.deps.workspaceMgr?.get(root.workspaceId);
+      const label = workspace?.name?.trim() || (workspace?.path ? basename(workspace.path) : "");
+      if (label) {
+        labels[root.workspaceId] = label;
+      }
+    }
+    return labels;
+  }
+
   private async sampleOnce(
     settings = resolveMonitoringSettings(this.deps.settingsRepo)
   ): Promise<void> {
@@ -189,11 +210,13 @@ export class MonitoringService {
       }
     }
 
+    const roots = this.deps.registry.listRoots();
     const response = buildMonitoringSnapshot({
       settings,
       sampledAt: startedAt,
       host,
-      roots: this.deps.registry.listRoots(),
+      roots,
+      workspaceLabels: this.getWorkspaceLabels(roots),
       processRows,
       previousSnapshot:
         this.latestSampledSnapshot.sampledAt > 0 ? this.latestSampledSnapshot : null,

packages/server/src/server.ts

@@ -336,6 +336,7 @@ export async function createServer(
     settingsRepo,
     registry: managedProcessRegistry,
     sessionMgr,
+    workspaceMgr,
     terminalMgr,
     hostCollector: new HostCollector(),
     processCollector: createProcessTableCollector(),

packages/web/src/features/agent-panes/views/shared/editor-pane-card.test.tsx

@@ -2,18 +2,41 @@ import { fireEvent, render, screen } from "@testing-library/react";
 import { createStore, Provider } from "jotai";
 import { afterEach, describe, expect, it, vi } from "vitest";
 import { localeAtom } from "../../../../atoms/app-ui";
-import { activeFilePathAtomFamily } from "../../../workspace/atoms";
+import {
+  activeFilePathAtomFamily,
+  type OpenFile,
+  openFilesAtomFamily,
+} from "../../../workspace/atoms";
 import { EditorPaneCard } from "./editor-pane-card";
 
 const mocks = vi.hoisted(() => ({
-  editorState: { marker: "editor-state" },
+  editorState: {
+    marker: "editor-state",
+    currentFile: undefined as OpenFile | undefined,
+  },
   mockUseCodeEditorActions: vi.fn(),
   mockCodeEditorHost: vi.fn(() => <div data-testid="editor-host">Editor Host</div>),
   mockCodeEditorDesktopHeaderActions: vi.fn(() => (
-    <div data-testid="editor-toolbar">Editor Toolbar</div>
+    <div data-testid="editor-toolbar" role="toolbar" aria-label="Editor actions">
+      Editor Toolbar
+    </div>
   )),
 }));
 
+vi.mock("../../../../lib/i18n", () => ({
+  useTranslation: () => (key: string, params?: Record<string, string>) => {
+    const dictionary: Record<string, string> = {
+      "action.close": "Close",
+      "code_editor.unsaved_changes": "Unsaved changes",
+      "code_editor.close_unsaved_title": "Discard unsaved changes?",
+      "code_editor.close_unsaved_description": `${params?.name ?? "File"} has unsaved changes.`,
+      "code_editor.discard_and_close": "Discard and Close",
+      "common.cancel": "Cancel",
+    };
+    return dictionary[key] ?? key;
+  },
+}));
+
 vi.mock("../../../code-editor/actions/use-code-editor-actions", () => ({
   useCodeEditorActions: mocks.mockUseCodeEditorActions,
 }));
@@ -51,6 +74,10 @@ describe("EditorPaneCard", () => {
     expect(screen.getByText("app.tsx")).toBeInTheDocument();
     expect(screen.queryByText("src/app.tsx")).not.toBeInTheDocument();
     expect(screen.getByTestId("editor-toolbar")).toBeInTheDocument();
+    expect(screen.getByTestId("editor-toolbar").closest(".panel-header")).toBeTruthy();
+    expect(
+      screen.queryByText("Editor Toolbar")?.closest(".editor-pane-card__toolbar-row")
+    ).toBeNull();
     expect(screen.getByTestId("editor-host")).toBeInTheDocument();
     expect(mocks.mockCodeEditorDesktopHeaderActions).toHaveBeenCalledWith(
       expect.objectContaining({
@@ -75,4 +102,54 @@ describe("EditorPaneCard", () => {
     expect(onSplitPane).toHaveBeenNthCalledWith(2, "pane-1", "vertical");
     expect(onClosePane).toHaveBeenCalledWith("pane-1");
   });
+
+  it("marks dirty editor pane titles and confirms before closing dirty files", () => {
+    const store = createStore();
+    const onClosePane = vi.fn();
+    const onSplitPane = vi.fn();
+
+    mocks.mockUseCodeEditorActions.mockReturnValue(mocks.editorState);
+    store.set(localeAtom, "en");
+    store.set(activeFilePathAtomFamily("ws-123"), "src/app.tsx");
+    store.set(openFilesAtomFamily("ws-123"), {
+      "src/app.tsx": {
+        kind: "text",
+        path: "src/app.tsx",
+        content: "changed",
+        savedContent: "saved",
+        baseHash: "hash-1",
+        isDirty: true,
+      },
+    });
+
+    render(
+      <Provider store={store}>
+        <EditorPaneCard
+          workspaceId="ws-123"
+          paneId="pane-1"
+          onClosePane={onClosePane}
+          onSplitPane={onSplitPane}
+        />
+      </Provider>
+    );
+
+    const title = screen.getByText("app.tsx");
+    const titleElement = title.closest(".panel-header__title");
+    const dirtyMeta = titleElement?.nextElementSibling;
+
+    expect(dirtyMeta).toHaveClass("panel-header__meta");
+    expect(dirtyMeta?.querySelector(".editor-pane-card__dirty-indicator")).toBeTruthy();
+
+    fireEvent.click(screen.getByRole("button", { name: "Close" }));
+    expect(onClosePane).not.toHaveBeenCalled();
+    expect(screen.getByRole("dialog", { name: "Discard unsaved changes?" })).toBeInTheDocument();
+
+    fireEvent.click(screen.getByRole("button", { name: "Cancel" }));
+    expect(onClosePane).not.toHaveBeenCalled();
+
+    fireEvent.click(screen.getByRole("button", { name: "Close" }));
+    fireEvent.click(screen.getByRole("button", { name: "Discard and Close" }));
+
+    expect(onClosePane).toHaveBeenCalledWith("pane-1");
+  });
 });