Skip to content

feat(dashboard): render complete dashboards as sixel - #1410

Merged
BYK merged 13 commits into
mainfrom
feat/sixel-shared-renderer
Aug 21, 2026
Merged

feat(dashboard): render complete dashboards as sixel#1410
BYK merged 13 commits into
mainfrom
feat/sixel-shared-renderer

Conversation

@jared-outpost

@jared-outpost jared-outpost Bot commented Aug 11, 2026

Copy link
Copy Markdown
Contributor

Closes #1231.

dashboard view --sixel now renders the complete dashboard into one Sixel canvas when terminal geometry is known, preserving the original widget grid. It renders timeseries, categorical bars, scalar values, tables, text, errors, and unsupported states with a single pixel renderer, so capable terminals never mix ASCII widgets with Sixel graphics.

The command always falls back to the complete character dashboard when Sixel capability or terminal cell geometry is unavailable.

The chart core remains resolution-independent, downsamples dense time series, preserves the muted gray Other series, and provides compact tick labels.

Verification

  • pnpm run typecheck
  • pnpm run lint
  • pnpm run test:unit (9,260 passed; 16 skipped)

Coverage includes categorical bars, scalar/table/text/error/unsupported widgets, adjacent widget positioning, dense-series tails, and the no-geometry ASCII fallback.

@vercel

vercel Bot commented Aug 11, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
cli Ready Ready Preview Aug 21, 2026 11:01pm

Request Review

@BYK BYK added the jared Trigger the Jared agent to work on stuff label Aug 19, 2026
@BYK
BYK marked this pull request as ready for review August 19, 2026 07:19
@github-actions github-actions Bot added the risk: medium PR risk score: medium label Aug 19, 2026
Comment thread packages/cli/src/lib/formatters/dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/chart-core.ts
Comment thread packages/cli/src/lib/formatters/dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/dashboard.ts
Comment thread packages/cli/src/lib/formatters/dashboard.ts
@github-actions github-actions Bot added risk: high PR risk score: high and removed risk: medium PR risk score: medium labels Aug 19, 2026
Comment thread packages/cli/src/lib/formatters/dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/dashboard.ts Outdated
@BYK

BYK commented Aug 19, 2026

Copy link
Copy Markdown
Member

Jared, I see no reason for mixing sixel widgets and ASCII ones. If we have sixel everything we have should be possible to render in sixel

@BYK

BYK commented Aug 19, 2026

Copy link
Copy Markdown
Member

Jared?

jared-outpost Bot and others added 6 commits August 21, 2026 20:21
Rework the opt-in sixel timeseries rendering (#1231) around a single
resolution-independent chart core instead of a standalone sixel-only
renderer.

chart-core.ts builds a ChartModel from a TimeseriesResult and rasterizes
it into an RGBA canvas at a caller-chosen resolution. The sixel path
(pixel resolution) is now a thin wrapper over the core, and the ASCII
renderer shares the same categorical palette, so both outputs agree on
hue and stacking. Output target picks the resolution upfront.

Opt-in via --sixel / SENTRY_DASHBOARD_SIXEL=1 / displayType
timeseries_sixel; falls back to text when the terminal lacks support.

Closes #1231
Address review feedback on the sixel timeseries rendering:

- Pull sixel-eligible widgets out of the side-by-side framebuffer and
  render them full-width after the character grid. A DCS image advances
  the cursor by many rows, so composing it into a shared terminal row
  trampled the widget's own borders and any neighbor on those rows.
- Exclude categorical_bar from sixel: the chart core only models
  time-bucket columns, so categorical widgets keep the ASCII
  per-category renderer instead of being drawn as the wrong viz.
- Downsample dense series to the pixel budget in rasterizeChart, so
  ranges with more buckets than ~half the canvas width no longer clip
  their tail off-canvas (mirrors the ASCII sparkline path).
- Use the shared EscapeType for the local esc state in fitToWidth.

Adds tests for the categorical exclusion, standalone-block layout, and
dense-series downsampling.
When sixel-eligible widgets are stripped out of the framebuffer, the
remaining widgets kept their original `layout.y`, so `renderGrid`
still allocated blank bands for the removed rows and the sixel images
were always appended after the whole grid (changing vertical order).

Compress `layout.y` values by dense rank while preserving relative
order within the same original band, so the grid packs contiguously
from y=0 with no holes and no reordering of left/right widgets on the
same row.
The previous dense-rank compression only renumbered `y` values and
ignored `layout.h`. Widgets that were stacked (`y_new = y_prev + h_prev`)
collapsed to consecutive integers and overlapped.

Pack by accumulating the tallest height in each original y-band so the
next band starts immediately below the previous tallest widget.
Detect widgets whose start y lies inside another widget's span (the
common tall-left + short-right pattern). When the layout is staggered,
skip packing and keep the original y values so the grid is rendered
exactly as the dashboard author laid it out.

Staggered packing is out of scope for this opt-in experimental path.
@BYK
BYK force-pushed the feat/sixel-shared-renderer branch from 4a1ee6c to 4a61b5a Compare August 21, 2026 22:24
@BYK BYK changed the title feat(dashboard): sixel timeseries via shared pixel-core renderer feat(dashboard): render complete dashboards as sixel Aug 21, 2026
Comment thread packages/cli/src/lib/formatters/sixel-dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/sixel-dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/sixel-dashboard.ts
Comment thread packages/cli/src/lib/sixel-image.ts

@cursor cursor Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cursor Bugbot has reviewed your changes and found 2 potential issues.

There are 3 total unresolved issues (including 1 from previous review).

Fix All in Cursor

❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.

Reviewed by Cursor Bugbot for commit 71ada2b. Configure here.

Comment thread packages/cli/src/lib/formatters/sixel-dashboard.ts Outdated
Comment thread packages/cli/test/lib/formatters/sixel-dashboard.test.ts Outdated
Comment thread packages/cli/src/lib/formatters/sixel-dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/sixel-dashboard.ts Outdated
Comment thread packages/cli/src/lib/formatters/sixel-dashboard.ts
@BYK
BYK merged commit b28cec4 into main Aug 21, 2026
32 checks passed
@BYK
BYK deleted the feat/sixel-shared-renderer branch August 21, 2026 23:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

jared Trigger the Jared agent to work on stuff risk: high PR risk score: high

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Explore sixel for dashboard rendering

1 participant