[interactive graph editor] Refactor sections

[nicolecomputer]

Summary:

This puts the correct answer and locked figures into their own section so that its easier to get the right things on the screen.

Uploading editor-2.mov…

Issue: LEMS-2179

Test plan:

• Open Storybook
• Open a graph editor
• You should be able to collapse and expand sections for locked figures and the correct answer

[khan-actions-bot]

Gerald

Required Reviewers

• @Khan/perseus for changes to .changeset/brave-turkeys-agree.md, packages/perseus-editor/src/components/heading.tsx, packages/perseus-editor/src/components/interactive-graph-correct-answer.tsx, packages/perseus-editor/src/components/interactive-graph-settings.tsx, packages/perseus-editor/src/components/start-coord-settings.tsx, packages/perseus-editor/src/widgets/interactive-graph-editor.tsx, packages/perseus-editor/src/components/graph-locked-figures/locked-figures-section.tsx, packages/perseus-editor/src/widgets/__tests__/interactive-graph-editor.test.tsx

---

Don't want to be involved in this pull request? Comment #removeme and we won't notify you of further changes.

[github-actions]

Size Change: +240 B (+0.03%)

Total Size: 854 kB

Filename	Size	Change
packages/perseus-editor/dist/es/index.js	273 kB	+240 B (+0.09%)

ℹ️ View Unchanged

Filename	Size
packages/kas/dist/es/index.js	38.2 kB
packages/kmath/dist/es/index.js	4.27 kB
packages/math-input/dist/es/index.js	80.8 kB
packages/math-input/dist/es/strings.js	1.73 kB
packages/perseus-core/dist/es/index.js	1.48 kB
packages/perseus-linter/dist/es/index.js	21.6 kB
packages/perseus/dist/es/index.js	414 kB
packages/perseus/dist/es/strings.js	3.21 kB
packages/pure-markdown/dist/es/index.js	3.67 kB
packages/simple-markdown/dist/es/index.js	12.4 kB

_{compressed-size-action}

[codecov]

Codecov Report

Attention: Patch coverage is 97.08029% with 4 lines in your changes missing coverage. Please review.

Project coverage is 71.17%. Comparing base (8b128b5) to head (4065916).

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1416      +/-   ##
==========================================
+ Coverage   69.62%   71.17%   +1.54%     
==========================================
  Files         504      509       +5     
  Lines      105597   105744     +147     
  Branches     7650    10841    +3191     
==========================================
+ Hits        73521    75261    +1740     
+ Misses      31960    30483    -1477     
+ Partials      116        0     -116     

Files	Coverage Δ
packages/perseus-editor/src/components/heading.tsx	100.00% <100.00%> (ø)
...rc/components/interactive-graph-correct-answer.tsx	100.00% <100.00%> (ø)
...itor/src/components/interactive-graph-settings.tsx	98.81% <100.00%> (+<0.01%)	⬆️
...eus-editor/src/components/start-coord-settings.tsx	97.54% <100.00%> (+0.02%)	⬆️
...us-editor/src/widgets/interactive-graph-editor.tsx	89.03% <100.00%> (-0.26%)	⬇️
...ts/graph-locked-figures/locked-figures-section.tsx	97.80% <93.44%> (+0.15%)	⬆️

... and 135 files with indirect coverage changes

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 8b128b5...4065916. Read the comment docs.

[mark-fitzgerald]

Looks great! This editor has progressed so much over the last several sprints.

Is it possible to have the accordions for these sections be tab-able (for keyboard navigation), like what's in the Locked Figures section?

[github-actions]

npm Snapshot: Published

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

Example:

yarn add @khanacademy/perseus@PR1416

If you are working in Khan Academy's webapp, you can run:

./dev/tools/bump_perseus_version.sh -t PR1416

[nishasy]

Looks great! Thanks for doing this!