[codex] Improve workspace navigation and runtime UI (#4089)

## Thinking Path

> - Paperclip agents do real work in project and execution workspaces.
> - Operators need workspace state to be visible, navigable, and
copyable without digging through raw run logs.
> - The branch included related workspace cards, navigation, runtime
controls, stale-service handling, and issue-property visibility.
> - These changes share the workspace UI and runtime-control surfaces
and can stand alone from unrelated access/profile work.
> - This pull request groups the workspace experience changes into one
standalone branch.
> - The benefit is a clearer workspace overview, better metadata copy
flows, and more accurate runtime service controls.

## What Changed

- Polished project workspace summary cards and made workspace metadata
copyable.
- Added a workspace navigation overview and extracted reusable project
workspace content.
- Squared and polished the execution workspace configuration page.
- Fixed stale workspace command matching and hid stopped stale services
in runtime controls.
- Showed live workspace service context in issue properties.

## Verification

- `pnpm install --frozen-lockfile`
- `pnpm exec vitest run
ui/src/components/ProjectWorkspaceSummaryCard.test.tsx
ui/src/lib/project-workspaces-tab.test.ts
ui/src/components/Sidebar.test.tsx
ui/src/components/WorkspaceRuntimeControls.test.tsx
ui/src/components/IssueProperties.test.tsx`
- `pnpm exec vitest run packages/shared/src/workspace-commands.test.ts
--config /dev/null` because the root Vitest project config does not
currently include `packages/shared` tests.
- Split integration check: merged after runtime/governance,
dev-infra/backups, and access/profiles with no merge conflicts.
- Confirmed this branch does not include `pnpm-lock.yaml`.

## Risks

- Medium risk: touches workspace navigation, runtime controls, and issue
property rendering.
- Visual layout changes may need browser QA, especially around smaller
screens and dense workspace metadata.
- No database migrations are included.

> For core feature work, check [`ROADMAP.md`](ROADMAP.md) first and
discuss it in `#dev` before opening the PR. Feature PRs that overlap
with planned core work may need to be redirected — check the roadmap
first. See `CONTRIBUTING.md`.

## Model Used

- OpenAI Codex, GPT-5.4 tool-enabled coding model, agentic
code-editing/runtime with local shell and GitHub CLI access; exact
context window and reasoning mode are not exposed by the Paperclip
harness.

## Checklist

- [x] I have included a thinking path that traces from project context
to this change
- [x] I have specified the model used (with version and capability
details)
- [x] I have checked ROADMAP.md and confirmed this PR does not duplicate
planned core work
- [x] I have run tests locally and they pass
- [x] I have added or updated tests where applicable
- [x] If this change affects the UI, I have included before/after
screenshots
- [x] I have updated relevant documentation to reflect my changes
- [x] I have considered and documented any risks above
- [x] I will address all Greptile and reviewer comments before
requesting merge

---------

Co-authored-by: Paperclip <noreply@paperclip.ing>

ui/src/lib/project-workspaces-tab.test.ts

@@ -1,5 +1,5 @@
 import { describe, expect, it } from "vitest";
-import type { ExecutionWorkspace, Issue, Project, ProjectWorkspace } from "@paperclipai/shared";
+import type { ExecutionWorkspace, Issue, Project, ProjectWorkspace, WorkspaceRuntimeService } from "@paperclipai/shared";
 import { buildProjectWorkspaceSummaries } from "./project-workspaces-tab";
 
 function createProjectWorkspace(overrides: Partial<ProjectWorkspace>): ProjectWorkspace {
@@ -96,6 +96,39 @@ function createExecutionWorkspace(overrides: Partial<ExecutionWorkspace>): Execu
   };
 }
 
+function createRuntimeService(overrides: Partial<WorkspaceRuntimeService> = {}): WorkspaceRuntimeService {
+  return {
+    id: overrides.id ?? "service-1",
+    companyId: overrides.companyId ?? "company-1",
+    projectId: overrides.projectId ?? "project-1",
+    projectWorkspaceId: overrides.projectWorkspaceId ?? null,
+    executionWorkspaceId: overrides.executionWorkspaceId ?? null,
+    issueId: overrides.issueId ?? null,
+    scopeType: overrides.scopeType ?? "execution_workspace",
+    scopeId: overrides.scopeId ?? null,
+    serviceName: overrides.serviceName ?? "preview",
+    status: overrides.status ?? "running",
+    lifecycle: overrides.lifecycle ?? "ephemeral",
+    reuseKey: overrides.reuseKey ?? null,
+    command: overrides.command ?? null,
+    cwd: overrides.cwd ?? null,
+    port: overrides.port ?? 3100,
+    url: overrides.url ?? "http://127.0.0.1:3100",
+    provider: overrides.provider ?? "local_process",
+    providerRef: overrides.providerRef ?? null,
+    ownerAgentId: overrides.ownerAgentId ?? null,
+    startedByRunId: overrides.startedByRunId ?? null,
+    lastUsedAt: overrides.lastUsedAt ?? new Date("2026-03-26T10:00:00Z"),
+    startedAt: overrides.startedAt ?? new Date("2026-03-26T09:00:00Z"),
+    stoppedAt: overrides.stoppedAt ?? null,
+    stopPolicy: overrides.stopPolicy ?? null,
+    healthStatus: overrides.healthStatus ?? "healthy",
+    configIndex: overrides.configIndex ?? null,
+    createdAt: overrides.createdAt ?? new Date("2026-03-26T09:00:00Z"),
+    updatedAt: overrides.updatedAt ?? new Date("2026-03-26T09:30:00Z"),
+  };
+}
+
 describe("buildProjectWorkspaceSummaries", () => {
   const primaryWorkspace = createProjectWorkspace({
     id: "workspace-default",
@@ -228,4 +261,63 @@ describe("buildProjectWorkspaceSummaries", () => {
     expect(summaries).toHaveLength(1);
     expect(summaries[0]?.key).toBe("project:workspace-default");
   });
+
+  it("sorts workspaces with running services first and marks live service urls", () => {
+    const summaries = buildProjectWorkspaceSummaries({
+      project,
+      issues: [
+        createIssue({
+          id: "issue-stopped",
+          executionWorkspaceId: "exec-stopped",
+          updatedAt: new Date("2026-03-27T12:00:00Z"),
+        }),
+        createIssue({
+          id: "issue-live",
+          executionWorkspaceId: "exec-live",
+          updatedAt: new Date("2026-03-25T12:00:00Z"),
+        }),
+      ],
+      executionWorkspaces: [
+        createExecutionWorkspace({
+          id: "exec-stopped",
+          name: "newer stopped",
+          lastUsedAt: new Date("2026-03-27T12:00:00Z"),
+          runtimeServices: [
+            createRuntimeService({
+              id: "service-stopped",
+              executionWorkspaceId: "exec-stopped",
+              status: "stopped",
+              url: "http://127.0.0.1:4100",
+            }),
+          ],
+        }),
+        createExecutionWorkspace({
+          id: "exec-live",
+          name: "older live",
+          lastUsedAt: new Date("2026-03-25T12:00:00Z"),
+          runtimeServices: [
+            createRuntimeService({
+              id: "service-live",
+              executionWorkspaceId: "exec-live",
+              status: "running",
+              url: "http://127.0.0.1:4200",
+            }),
+          ],
+        }),
+      ],
+    });
+
+    expect(summaries[0]).toMatchObject({
+      key: "execution:exec-live",
+      primaryServiceUrl: "http://127.0.0.1:4200",
+      primaryServiceUrlRunning: true,
+      runningServiceCount: 1,
+    });
+    expect(summaries[1]).toMatchObject({
+      key: "execution:exec-stopped",
+      primaryServiceUrl: "http://127.0.0.1:4100",
+      primaryServiceUrlRunning: false,
+      runningServiceCount: 0,
+    });
+  });
 });