[Hint Mode: Start Coords] Build the foundation for adding start coords UI for angle graphs

[nishasy]

Summary:

This PR includes the foundation/prerequisites for adding the start coords UI for angle graphs.

• Add the polygon graph type to start-coords-settings.tsx
• Create a WORK IN PROGRESS start-coords-angle.tsx file. This will be properly filled in
  in the following PR, whose main purpose will be adding the body for the UI.
• Add the start coords UI angle flag
• Add a storybook story for angle graphs (and update polygon story to start with start coords)
• Update the angle initializer to account for start coords

Issue: https://khanacademy.atlassian.net/browse/LEMS-2073

Test plan:

yarn jest

Storybook

• http://localhost:6006/?path=/story/perseuseditor-widgets-interactive-graph--interactive-graph-angle

[github-actions]

Size Change: +203 B (+0.02%)

Total Size: 854 kB

Filename	Size	Change
packages/perseus-editor/dist/es/index.js	273 kB	+197 B (+0.07%)
packages/perseus/dist/es/index.js	413 kB	+6 B (0%)

ℹ️ View Unchanged

Filename	Size
packages/kas/dist/es/index.js	38.3 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/strings.js	3.29 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 96.42857% with 2 lines in your changes missing coverage. Please review.

Project coverage is 70.58%. Comparing base (395b44f) to head (6e6f088).
Report is 1 commits behind head on main.

Files	Patch %	Lines
...teractive-graphs/reducer/initialize-graph-state.ts	60.00%	2 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1492      +/-   ##
==========================================
+ Coverage   70.11%   70.58%   +0.46%     
==========================================
  Files         510      514       +4     
  Lines      105645   105738      +93     
  Branches     7668    11462    +3794     
==========================================
+ Hits        74068    74630     +562     
+ Misses      31386    31108     -278     
+ Partials      191        0     -191     

Files	Coverage Δ
...rseus-editor/src/components/start-coords-angle.tsx	100.00% <100.00%> (ø)
...us-editor/src/components/start-coords-settings.tsx	98.77% <100.00%> (+0.08%)	⬆️
packages/perseus-editor/src/components/util.ts	85.62% <100.00%> (+0.54%)	⬆️
packages/perseus/src/index.ts	100.00% <100.00%> (ø)
...teractive-graphs/reducer/initialize-graph-state.ts	81.39% <60.00%> (-0.29%)	⬇️

... and 150 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 395b44f...6e6f088. Read the comment docs.

[nishasy]

Note: Because of my polygon story update, I realized that the "correct" preview's interactive graph doesn't show the right number of sides. This also led me to discover that the segment graph's "correct" preview with start coords doesn't show the right number of segments.

Fixing this in a separate PR.

[khan-actions-bot]

Gerald

Required Reviewers

• @Khan/perseus for changes to .changeset/eleven-paws-serve.md, packages/perseus/src/index.ts, packages/perseus/src/types.ts, packages/perseus-editor/src/__stories__/flags-for-api-options.ts, packages/perseus-editor/src/__stories__/interactive-graph-editor.stories.tsx, packages/perseus-editor/src/components/start-coords-angle.tsx, packages/perseus-editor/src/components/start-coords-settings.tsx, packages/perseus-editor/src/components/util.ts, packages/perseus/src/widgets/__testdata__/interactive-graph.testdata.ts, packages/perseus-editor/src/components/__tests__/util.test.ts, packages/perseus-editor/src/widgets/__tests__/interactive-graph-editor.test.tsx, packages/perseus/src/widgets/interactive-graphs/reducer/initialize-graph-state.ts

---

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

[Myranae]

Looks good to me :) Checked out storybook and the reset to default coords button even does what I expected it to do. I love how you broke up the work like this. I need to get better at this as well :D I am curious though; would it be more helpful for content creators if we allowed them to just set the angle and then the angle of the graph? This might be more possible if we ever end up using polar coordinates though 🤔

[nishasy]

@Myranae Yeah, trying to figure out how to incorporate the angle in degrees is what inspired me to break this out into two PRs instead! I suspect that it may get somewhat complicated. It's temporarily just displaying the coordinates because that's what ultimately gets stored so that the graph knows how to render the angle.