Skip to content

[Preview NG] Rename preview data field names and unify article-all apiOptions#3590

Open
jeremywiebe wants to merge 4 commits intojer/preview-ng-8-migrate-storybook-and-editorsfrom
jer/preview-ng-9-rework-message-fields
Open

[Preview NG] Rename preview data field names and unify article-all apiOptions#3590
jeremywiebe wants to merge 4 commits intojer/preview-ng-8-migrate-storybook-and-editorsfrom
jer/preview-ng-9-rework-message-fields

Conversation

@jeremywiebe
Copy link
Copy Markdown
Collaborator

@jeremywiebe jeremywiebe commented May 6, 2026

Summary:

This PR is part of a series building a typed, hook-based preview system for the Perseus editor. The new system replaces the untyped window.iframeDataStore + raw postMessage(string) communication with structured, validated message passing via usePreviewController and usePreviewPresenter hooks. The new system is being built alongside the old one — no existing behavior changes until the final PR in the series flips the switch.

Previous PRs in this series:

--

Now that the editors and storybook preview page are migrated to the new preview system (#3581), this PR tightens up the preview data shapes. Three changes, all internal to @khanacademy/perseus-editor:

  1. ArticlePreviewData.json becomes article. The json name was a leftover from when sections were stored as raw JSON strings; the type already held a PerseusRenderer and callers all referred to it by content role, so the new name reflects what's actually there. The type is also tightened from PerseusArticle (which is PerseusRenderer | PerseusRenderer[]) to just PerseusRendererArticlePreviewData is now strictly the single-section shape used in edit mode.

  2. A new ArticleAllPreviewData replaces the old ArticlePreviewData[] shape used for the all-sections preview. The new type is {article: ReadonlyArray<PerseusRenderer>, apiOptions: APIOptions} — a single shared apiOptions rather than the previous per-section duplication. linterContext was dropped here because article-all is the read-only "preview" view (not the editing surface), so per-section linter context isn't needed.

  3. QuestionPreviewData.initialHintsVisible is removed. It was always hardcoded to 0 at every call site, and the renderer now hardcodes hintsVisible={0} directly.

These shapes aren't observed outside the editor package today (the message types aren't part of the public API surface — index.ts exports the hooks but not the types), so this is a no-op for any external consumer. The preview-data-sanitizer collapsed too — there's only one apiOptions to sanitize regardless of content type now, so the per-section loop in the article-all branch went away.

Issue: LEMS-3741

Test plan:

  • pnpm tsc
  • pnpm lint
  • pnpm test
  • Reviewer: open Storybook, navigate to the editor previews, and confirm:
    • Question preview still renders (no visible hints; behavior matches main)
    • Article single-section preview renders content
    • Article-all preview renders all sections concatenated with shared apiOptions
    • Hint preview unchanged

…es: drop initialHintsVisible, rename json to article, simplify article-all to single shared apiOptions
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 6, 2026

🗄️ Schema Change: No Changes ✅

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 6, 2026

npm Snapshot: Published

Good news!! We've packaged up the latest commit from this PR (557dad9) and published it to npm. You
can install it using the tag PR3590.

Example:

pnpm add @khanacademy/perseus@PR3590

If you are working in Khan Academy's frontend, you can run the below command.

./dev/tools/bump_perseus_version.ts -t PR3590

If you are working in Khan Academy's webapp, you can run the below command.

./dev/tools/bump_perseus_version.js -t PR3590

@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 6, 2026

🛠️ Item Splitting: No Changes ✅

@jeremywiebe jeremywiebe marked this pull request as ready for review May 6, 2026 20:36
Copy link
Copy Markdown

@claude claude Bot left a comment

Choose a reason for hiding this comment

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

Claude Code Review

This repository is configured for manual code reviews. Comment @claude review to trigger a review and subscribe this PR to future pushes, or @claude review once for a one-time review.

Tip: disable this comment in your organization's Code Review settings.

…ld names in preview messages realted to articles (no longer `json`, now `article` or `section` as needed)
@github-actions
Copy link
Copy Markdown
Contributor

github-actions Bot commented May 6, 2026

Size Change: -43 B (-0.01%)

Total Size: 504 kB

📦 View Changed
Filename Size Change
packages/perseus-editor/dist/es/index.js 104 kB -43 B (-0.04%)
ℹ️ View Unchanged
Filename Size
packages/kas/dist/es/index.js 20.6 kB
packages/keypad-context/dist/es/index.js 1 kB
packages/kmath/dist/es/index.js 6.31 kB
packages/math-input/dist/es/index.js 98.5 kB
packages/math-input/dist/es/strings.js 1.61 kB
packages/perseus-core/dist/es/index.item-splitting.js 12 kB
packages/perseus-core/dist/es/index.js 25.5 kB
packages/perseus-linter/dist/es/index.js 9.41 kB
packages/perseus-score/dist/es/index.js 9.78 kB
packages/perseus-utils/dist/es/index.js 403 B
packages/perseus/dist/es/index.js 198 kB
packages/perseus/dist/es/strings.js 8.5 kB
packages/pure-markdown/dist/es/index.js 1.39 kB
packages/simple-markdown/dist/es/index.js 6.71 kB

compressed-size-action

@jeremywiebe jeremywiebe requested review from a team May 6, 2026 21:31
@jeremywiebe jeremywiebe changed the title Preview NG] Rename preview data field names and unify article-all apiOptions [Preview NG] Rename preview data field names and unify article-all apiOptions May 6, 2026
…o we don't have code that does `data.data.` 🤦
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant