Embeddable charts 269#279
Open
lalithsagar10 wants to merge 27 commits intoSemiAnalysisAI:masterfrom
Open
Conversation
Contributor
lalithsagar10
commented
May 1, 2026
- Added an iframe-safe embeddable scatter chart route and embed client/view components.
- Implemented canonical/embed URL state support and expanded URL-state tests.
- Added CSP/middleware/layout updates required for secure embedding.
- Wired embed/share behavior into chart display helpers and inference chart display.
|
Someone is attempting to deploy a commit to the SemiAnalysisAI Team on Vercel. A member of the Team first needs to authorize it. |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
…ysisAI#283) Drops the amber "still in early stages of adding support" banner from inference, historical trends, and evaluation chart displays. Cleans up the now-unused isModelExperimental imports at the call sites. Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…emiAnalysisAI#284) * feat(inference): add toggleable bus/car speed overlay on scatter charts Decorative emoji markers anchor each chart corner to a "vehicle" metaphor: the bus sits at the batch-friendly end of the Pareto frontier (high throughput / low cost on the low-interactivity side, or the high-latency side on e2e charts) and the racing car sits at the interactivity-favoring end. Corner placement is derived from chartDefinition.chartType plus the metric's roofline direction so the markers track the y-axis semantics across throughput, cost, and energy metrics. Adds a "Bus / Race Car" toggle to the inference legend (off by default) backed by a new i_speed share-link param and threaded through InferenceContext. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(inference): scale bus/race car overlay 40% larger Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * feat(inference): TTFT-aware bus/car corners + searchable Y-axis selector - Derive bus/car corner placement from the post-flipped roofline alone so input-token metrics that swap X to TTFT (interactivity chart) and e2e charts both anchor the bus on the high-latency batch side. - Add a SearchableSelect component (single-select with grouped options and a built-in search input) and use it for the Y-axis metric picker. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * test(inference): cover speed overlay corner logic, searchable select, E2E - Extract corner placement into a pure helper (lib/speed-overlay.ts) and unit-test all four roofline directions plus the undefined fallback. - Render speed-overlay images with data-testid + data-corner attributes so E2E tests can assert placement without geometry math. - Add E2E coverage for the legend toggle, default + cost + input-token (TTFT) corner mappings, off-cleanup, and the i_speed URL param. - Add unit tests for SearchableSelect: trigger label, group flattening, search filtering across option and group labels, no-results state, and click-to-select behavior. - Mark searchable-select items with role="option" so existing E2E tests that target the Y-axis dropdown via [role="option"] keep working. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(searchable-select): suppress hydration on label, scope E2E search - Trigger label is derived from URL/persisted state which only resolves client-side; suppress the harmless server/client mismatch on the trigger text (was causing React #418 in the production bundle and failing url-params.cy.ts tests that hit ?i_metric). - Other components (chart legend, MultiSelect) reuse the "Search..." placeholder, so scope every speed-overlay E2E search lookup to the open Y-axis dropdown via [data-slot="select-content"]. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(searchable-select): defer trigger label until mount, drop enter anim - suppressHydrationWarning kept the SSR-rendered default label in place after hydration, so URL params like ?i_metric=y_costh never produced the right trigger text. Track a `mounted` flag and render the placeholder during SSR / first render, then swap in the resolved label on the next client tick (matches Radix Select's behavior). - Drop the tailwindcss-animate enter animations on the dropdown panel: the initial 0-opacity / 0-scale frames made Cypress treat the search input as not visible and fail cy.type() in CI. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(searchable-select): hoist search header out of the scroll container Sticky position with no enclosing scroll context resolves to fixed in Chrome/Firefox, leaving the search input pinned to the viewport top behind the global page header — Cypress correctly reports the input as covered and fails cy.type(). Move the search header into a sibling div above the scrollable list so its position is plain static / relative, and the scroll area only contains the option list. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * test(speed-overlay): drop tautological car-vs-bus contract test --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com> Co-authored-by: adibarra <93070681+adibarra@users.noreply.github.com>
…le (SemiAnalysisAI#285) * feat(inference): line labels for unofficial run rooflines The "Line Labels" toggle now also labels overlay (unofficial run) rooflines, not just official ones. Each (hwKey, runIndex) pair gets its own label using the run-palette color (matching the legend swatches), sharing the same greedy collision-avoidance pass as official labels so they never overlap. Both interactivity-chart placement and TTFT/E2EL endpoint placement support overlay, and the zoom handler updates them in lockstep with official labels. Also document the broader rule in AGENTS.md: any new inference / evaluation chart feature must work for both official and unofficial overlay paths, with manual verification and at least one test against the overlay branch. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(inference): label overlay rooflines with branch name to match legend The overlay legend shows "✕ <branch>" per loaded unofficial run, but the line labels were using the hw label (e.g. "B200") so the chart and legend didn't speak the same language. Look up the run via unofficialRunInfos[runIndex] and use the same "✕ <branch>" text in both placement modes (interactivity mid-line + TTFT/E2EL endpoint). Falls back to the hw label only when run metadata is missing. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…ce Car (SemiAnalysisAI#287) * feat(inference): add Donkey / Elytra Minecraft overlay alongside Bus / Race Car Adds a second decorative overlay pair using Minecraft assets — chested donkey for the batch corner, elytra for the interactivity corner — as a toggle independent of the existing Bus / Race Car overlay. Both pairs share the same metric-aware corner placement (via getSpeedOverlayCorners) and stack horizontally inward when enabled together so neither pair hides the other. Asset sources (transparent PNGs from the Minecraft Wiki): - public/decorative/donkey-chest.png — Chested_Donkey_JE5 - public/decorative/elytra.png — Elytra_JE2_BE2 (256px render) State threaded through InferenceContext as showMinecraftOverlay / setShowMinecraftOverlay with i_mc share-link param. Existing speed overlay testids (speed-overlay-bus / -car) preserved as aliases so prior E2E selectors keep working. New describe block covers toggle default, image hrefs, corner placement, both-on stacking offset, and URL-param restore for the new pair. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(overlay): swap elytra to the front-facing 2D inventory sprite The previous side-view 3D render read as an unrecognizable shape next to the donkey. Use the canonical 256×256 front-facing inventory sprite (both wings spread, pixel-art) from the Minecraft Wiki so the meaning ("flying gear") is immediately legible at the chart-corner size. Also note the asset provenance in a code comment near the render site. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(overlay): use ElytraNew front-facing sprite (per review) Drops in the user-specified ElytraNew.png from the Minecraft Fandom wiki — both wings spread, classic in-game inventory framing — and updates the attribution comment to point at the new source. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(overlay): render the donkey 50% larger than other overlay icons Donkey-with-chest now anchors at 1.5× SIZE (≈117 px) while bus, race car, and elytra stay at the standard 78 px. Per-pair slowSize/fastSize fields make the stacking offset honor each image's actual width so the larger donkey doesn't overlap a stacked elytra/bus when both pairs are on. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…alysisAI#288) * feat(gpu-graph): add date line labels to GPU comparison rooflines The "Line Labels" toggle is now available on the GPU config / comparison-date dashboard graph too, sharing the same showLineLabels state as the scatter chart. Each visible (date, hwKey) roofline gets exactly one label rendered along it — text is the **date** rather than the hw config, since the legend already carries the hw identity in its grouping and color, and date is the dimension that distinguishes series within a single GPU comparison view. Implementation mirrors ScatterGraph: a custom layer dedupes per (date, hwKey) by picking the longest roofline, runs greedy collision avoidance on the interactivity chart (try start → midpoint → 2/3 → endpoint) and falls back to spaced-out endpoint labels for TTFT / E2EL. Zoom updates labels in lockstep with the rooflines. Labels respect the activeDates legend filter so toggling a series off hides its label. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(gpu-graph): include hw config in line label, not just the date Each line label now reads "<hw display label> • <date>" so the chart is self-contained — the user no longer has to cross-reference the legend's hw grouping to know which roofline is which GPU. Bumps LABEL_W from 90 to 160 to give the wider labels enough horizontal breathing room in the collision-avoidance pass. Component test asserts both the date strings and the hw display labels appear. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…tion and conc-list parsing (SemiAnalysisAI#290)
…emiAnalysisAI#278) * fix: close precision multiselect when focus moves to other filters * fix: unify inference dropdown one-click switching behavior * Dropdown changes fixed * Fixed e2e tests * fix: dropdown Escape key, selected-option styling, and switching regression test --------- Co-authored-by: Lalith <lalith@todaiyo.ai> Co-authored-by: Alec Ibarra <93070681+adibarra@users.noreply.github.com>
* chore: bump deps and override vulnerable transitive deps (uuid, postcss) * chore: bump next/react to latest patch and unpin
…oss (SemiAnalysisAI#297) * feat(theme): scatter Minecraft assets + Ender Dragon fly-across on minecraft theme Adds a `MinecraftDecorations` client component that renders six iconic Minecraft assets at fixed corner positions when the minecraft theme is active, plus a one-shot Ender Dragon GIF that flies right-to-left across the viewport every time the theme is activated: - top-left: Creeper mob render - top-right: Diamond pickaxe (rotated 35°, mining vibe) - mid-right: Technoblade body render (RIP — pig-king skin) - bottom-left: Grass block - bottom-mid: TNT - bottom-right: Diamond - top stripe: Ender Dragon, fly-across once per activation Mirrors the `RickMortyDecorations` pattern from PR SemiAnalysisAI#295: a MutationObserver on `document.documentElement` toggles the cast live with the mode picker, all images are `pointer-events: none` at z-0, and the static cutouts are hidden below `lg` so narrow chart layouts stay clean. The dragon uses a `dragonNonce` React key so its `<img>` remounts on every off→on theme transition, restarting the CSS animation. Keyframe `mc-dragon-flyacross` lives in globals.css next to the existing splash-bounce animation, takes ~9s, and respects `prefers-reduced-motion: reduce`. Asset provenance: minecraft.wiki (CC BY-NC-SA 3.0) for blocks/items and the Ender Dragon GIF; mc-heads.net body render for the Technoblade skin (decorative use). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(theme): drop Technoblade cutout from minecraft decorations Removes the mid-right Technoblade body render and its asset. Six remaining decorations (creeper, diamond pickaxe, grass block, TNT, diamond, dragon) keep the spread of the cast unchanged. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(theme): swap creeper for zombified piglin facing inward Replace the top-left creeper with a Zombified Piglin sprite from the Minecraft Wiki. The canonical render faces left (sword arm out the viewer's left), which on a top-left anchor would point AWAY from the chart. Mirror it with `scaleX(-1)` so the sword-arm faces toward the middle of the viewport, where the user's attention actually is. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * fix(theme): add CC BY-NC-SA 3.0 attribution for minecraft assets --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com> Co-authored-by: adibarra <93070681+adibarra@users.noreply.github.com>
…es (SemiAnalysisAI#293) Bumps the all-minor-patch group with 4 updates in the / directory: [pnpm/action-setup](https://github.com/pnpm/action-setup), [anthropics/claude-code-action](https://github.com/anthropics/claude-code-action), [slackapi/slack-github-action](https://github.com/slackapi/slack-github-action) and [cypress-io/github-action](https://github.com/cypress-io/github-action). Updates `pnpm/action-setup` from 6.0.3 to 6.0.5 - [Release notes](https://github.com/pnpm/action-setup/releases) - [Commits](pnpm/action-setup@903f9c1...8912a91) Updates `anthropics/claude-code-action` from 1.0.107 to 1.0.111 - [Release notes](https://github.com/anthropics/claude-code-action/releases) - [Commits](anthropics/claude-code-action@567fe95...fefa07e) Updates `slackapi/slack-github-action` from 3.0.2 to 3.0.3 - [Release notes](https://github.com/slackapi/slack-github-action/releases) - [Changelog](https://github.com/slackapi/slack-github-action/blob/main/CHANGELOG.md) - [Commits](slackapi/slack-github-action@03ea543...45a88b9) Updates `cypress-io/github-action` from 7.1.9 to 7.1.10 - [Release notes](https://github.com/cypress-io/github-action/releases) - [Changelog](https://github.com/cypress-io/github-action/blob/master/CHANGELOG.md) - [Commits](cypress-io/github-action@783cb3f...c495c3d) --- updated-dependencies: - dependency-name: anthropics/claude-code-action dependency-version: 1.0.111 dependency-type: direct:production update-type: version-update:semver-patch dependency-group: all-minor-patch - dependency-name: cypress-io/github-action dependency-version: 7.1.10 dependency-type: direct:production update-type: version-update:semver-patch dependency-group: all-minor-patch - dependency-name: pnpm/action-setup dependency-version: 6.0.5 dependency-type: direct:production update-type: version-update:semver-patch dependency-group: all-minor-patch - dependency-name: slackapi/slack-github-action dependency-version: 3.0.3 dependency-type: direct:production update-type: version-update:semver-patch dependency-group: all-minor-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Alec Ibarra <93070681+adibarra@users.noreply.github.com>
…env vars (SemiAnalysisAI#305) * fix(ci): claude workflow dev server failing due to missing .env + db env vars * fix(ci): drop bogus -- --hostname/--port args that next dev mistakes for project dir; remove .env stub (dotenv-cli v11 tolerates missing file)
…I#307) * feat(theme): play canonical Ender Dragon growl during fly-across Adds the dragon idle/growl SFX (~3s, ~26 KB MP3 transcoded from minecraft.wiki's Ender_dragon_idle1.ogg) that fires on every off→on minecraft theme activation, in lockstep with the existing dragon fly-across GIF. Gated on the same `minecraft-sound` localStorage flag used by the click-sound effect in minecraft-background.tsx so a single mute toggle covers all SFX, and skipped when prefers-reduced-motion is set (matching the visual suppression). Browsers block autoplay before the first user gesture — that's silently caught; the very next theme toggle is itself a gesture and unlocks subsequent plays. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> * chore(theme): hover dragon mid-screen so the growl lands on a pause Extends the fly-across to 12s with a 35%→60% (4.2s–7.2s) hold at center, and delays the audio start by 4.2s so the 3s growl sample plays during the held position instead of bleeding across the entrance/exit motion. The wing-flap GIF keeps the dragon visually alive during the hover. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.