feat(dashboard): add clickable titles, --limit flag, and loading spinner to list

- Title column renders as markdown link to dashboard URL (clickable in terminal)
- Add --limit flag (default 30) with per_page passed to API
- Wrap fetch in withProgress() for "Fetching dashboards..." spinner
- Add jsonTransform to keep JSON output as plain array

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: betegon

src/commands/dashboard/list.ts

@@ -13,29 +13,40 @@ import { escapeMarkdownCell } from "../../lib/formatters/markdown.js";
 import { type Column, writeTable } from "../../lib/formatters/table.js";
 import {
   applyFreshFlag,
+  buildListLimitFlag,
   FRESH_ALIASES,
   FRESH_FLAG,
 } from "../../lib/list-command.js";
-import { buildDashboardsListUrl } from "../../lib/sentry-urls.js";
+import { withProgress } from "../../lib/polling.js";
+import {
+  buildDashboardsListUrl,
+  buildDashboardUrl,
+} from "../../lib/sentry-urls.js";
 import type { DashboardListItem } from "../../types/dashboard.js";
 import type { Writer } from "../../types/index.js";
 import { resolveOrgFromTarget } from "./resolve.js";
 
 type ListFlags = {
   readonly web: boolean;
   readonly fresh: boolean;
+  readonly limit: number;
   readonly json: boolean;
   readonly fields?: string[];
 };
 
+type DashboardListResult = {
+  dashboards: DashboardListItem[];
+  orgSlug: string;
+};
+
 /**
  * Format dashboard list for human-readable terminal output.
  *
- * Renders a table with ID, title, and widget count columns.
+ * Renders a table with ID, title (clickable link), and widget count columns.
  * Returns "No dashboards found." for empty results.
  */
-function formatDashboardListHuman(dashboards: DashboardListItem[]): string {
-  if (dashboards.length === 0) {
+function formatDashboardListHuman(result: DashboardListResult): string {
+  if (result.dashboards.length === 0) {
     return "No dashboards found.";
   }
 
@@ -45,9 +56,9 @@ function formatDashboardListHuman(dashboards: DashboardListItem[]): string {
     widgets: string;
   };
 
-  const rows: DashboardRow[] = dashboards.map((d) => ({
+  const rows: DashboardRow[] = result.dashboards.map((d) => ({
     id: d.id,
-    title: escapeMarkdownCell(d.title),
+    title: `[${escapeMarkdownCell(d.title)}](${buildDashboardUrl(result.orgSlug, d.id)})`,
     widgets: String(d.widgetDisplay?.length ?? 0),
   }));
 
@@ -75,7 +86,11 @@ export const listCommand = buildCommand({
       "  sentry dashboard list --json\n" +
       "  sentry dashboard list --web",
   },
-  output: { json: true, human: formatDashboardListHuman },
+  output: {
+    json: true,
+    human: formatDashboardListHuman,
+    jsonTransform: (result: DashboardListResult) => result.dashboards,
+  },
   parameters: {
     positional: {
       kind: "tuple",
@@ -95,9 +110,10 @@ export const listCommand = buildCommand({
         brief: "Open in browser",
         default: false,
       },
+      limit: buildListLimitFlag("dashboards"),
       fresh: FRESH_FLAG,
     },
-    aliases: { ...FRESH_ALIASES, w: "web" },
+    aliases: { ...FRESH_ALIASES, w: "web", n: "limit" },
   },
   async func(this: SentryContext, flags: ListFlags, target?: string) {
     applyFreshFlag(flags);
@@ -115,11 +131,14 @@ export const listCommand = buildCommand({
       return;
     }
 
-    const dashboards = await listDashboards(orgSlug);
+    const dashboards = await withProgress(
+      { message: `Fetching dashboards (up to ${flags.limit})...` },
+      () => listDashboards(orgSlug, { perPage: flags.limit })
+    );
     const url = buildDashboardsListUrl(orgSlug);
 
     return {
-      data: dashboards,
+      data: { dashboards, orgSlug } as DashboardListResult,
       hint: dashboards.length > 0 ? `Dashboards: ${url}` : undefined,
     };
   },

src/lib/api/dashboards.ts

@@ -18,15 +18,18 @@ import { apiRequestToRegion } from "./infrastructure.js";
  * List dashboards in an organization.
  *
  * @param orgSlug - Organization slug
+ * @param options - Optional pagination parameters
  * @returns Array of dashboard list items
  */
 export async function listDashboards(
-  orgSlug: string
+  orgSlug: string,
+  options: { perPage?: number } = {}
 ): Promise<DashboardListItem[]> {
   const regionUrl = await resolveOrgRegion(orgSlug);
   const { data } = await apiRequestToRegion<DashboardListItem[]>(
     regionUrl,
-    `/organizations/${orgSlug}/dashboards/`
+    `/organizations/${orgSlug}/dashboards/`,
+    { params: { per_page: options.perPage } }
   );
   return data;
 }

test/commands/dashboard/list.test.ts

@@ -21,6 +21,8 @@ import * as apiClient from "../../../src/lib/api-client.js";
 // biome-ignore lint/performance/noNamespaceImport: needed for spyOn mocking
 import * as browser from "../../../src/lib/browser.js";
 // biome-ignore lint/performance/noNamespaceImport: needed for spyOn mocking
+import * as polling from "../../../src/lib/polling.js";
+// biome-ignore lint/performance/noNamespaceImport: needed for spyOn mocking
 import * as resolveTarget from "../../../src/lib/resolve-target.js";
 import type { DashboardListItem } from "../../../src/types/dashboard.js";
 
@@ -71,19 +73,28 @@ describe("dashboard list command", () => {
   let listDashboardsSpy: ReturnType<typeof spyOn>;
   let resolveOrgSpy: ReturnType<typeof spyOn>;
   let openInBrowserSpy: ReturnType<typeof spyOn>;
+  let withProgressSpy: ReturnType<typeof spyOn>;
 
   beforeEach(() => {
     listDashboardsSpy = spyOn(apiClient, "listDashboards");
     resolveOrgSpy = spyOn(resolveTarget, "resolveOrg");
     openInBrowserSpy = spyOn(browser, "openInBrowser").mockResolvedValue(
       undefined as never
     );
+    // Bypass spinner — just run the callback directly
+    withProgressSpy = spyOn(polling, "withProgress").mockImplementation(
+      (_opts, fn) =>
+        fn(() => {
+          /* no-op setMessage */
+        })
+    );
   });
 
   afterEach(() => {
     listDashboardsSpy.mockRestore();
     resolveOrgSpy.mockRestore();
     openInBrowserSpy.mockRestore();
+    withProgressSpy.mockRestore();
   });
 
   test("outputs JSON array of dashboards with --json", async () => {
@@ -94,7 +105,7 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
     await func.call(
       context,
-      { json: true, web: false, fresh: false },
+      { json: true, web: false, fresh: false, limit: 30 },
       undefined
     );
 
@@ -115,7 +126,7 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
     await func.call(
       context,
-      { json: true, web: false, fresh: false },
+      { json: true, web: false, fresh: false, limit: 30 },
       undefined
     );
 
@@ -131,7 +142,7 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
     await func.call(
       context,
-      { json: false, web: false, fresh: false },
+      { json: false, web: false, fresh: false, limit: 30 },
       undefined
     );
 
@@ -151,7 +162,7 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
     await func.call(
       context,
-      { json: false, web: false, fresh: false },
+      { json: false, web: false, fresh: false, limit: 30 },
       undefined
     );
 
@@ -167,7 +178,7 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
     await func.call(
       context,
-      { json: false, web: false, fresh: false },
+      { json: false, web: false, fresh: false, limit: 30 },
       undefined
     );
 
@@ -184,11 +195,11 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
     await func.call(
       context,
-      { json: true, web: false, fresh: false },
+      { json: true, web: false, fresh: false, limit: 30 },
       "my-org/"
     );
 
-    expect(listDashboardsSpy).toHaveBeenCalledWith("my-org");
+    expect(listDashboardsSpy).toHaveBeenCalledWith("my-org", { perPage: 30 });
   });
 
   test("throws ContextError when org cannot be resolved", async () => {
@@ -198,7 +209,11 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
 
     await expect(
-      func.call(context, { json: false, web: false, fresh: false }, undefined)
+      func.call(
+        context,
+        { json: false, web: false, fresh: false, limit: 30 },
+        undefined
+      )
     ).rejects.toThrow("Organization");
   });
 
@@ -209,11 +224,29 @@ describe("dashboard list command", () => {
     const func = await listCommand.loader();
     await func.call(
       context,
-      { json: false, web: true, fresh: false },
+      { json: false, web: true, fresh: false, limit: 30 },
       undefined
     );
 
     expect(openInBrowserSpy).toHaveBeenCalled();
     expect(listDashboardsSpy).not.toHaveBeenCalled();
   });
+
+  test("passes limit to API via withProgress", async () => {
+    resolveOrgSpy.mockResolvedValue({ org: "test-org" });
+    listDashboardsSpy.mockResolvedValue([DASHBOARD_A]);
+
+    const { context } = createMockContext();
+    const func = await listCommand.loader();
+    await func.call(
+      context,
+      { json: true, web: false, fresh: false, limit: 10 },
+      undefined
+    );
+
+    expect(withProgressSpy).toHaveBeenCalled();
+    expect(listDashboardsSpy).toHaveBeenCalledWith("test-org", {
+      perPage: 10,
+    });
+  });
 });