-
Notifications
You must be signed in to change notification settings - Fork 352
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
New event logging to Interactive Graph. #1719
New event logging to Interactive Graph. #1719
Conversation
GeraldRequired Reviewers
Don't want to be involved in this pull request? Comment |
npm Snapshot: PublishedGood news!! We've packaged up the latest commit from this PR (24fb584) and published it to npm. You Example: yarn add @khanacademy/perseus@PR1719 If you are working in Khan Academy's webapp, you can run: ./dev/tools/bump_perseus_version.sh -t PR1719 |
Size Change: +79 B (+0.01%) Total Size: 865 kB
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This looks good, but I'd recommend moving the mapping of interactive graph type into webapp if my reading of this is correct (see comment). :)
const [width, height] = props.box; | ||
const tickStep = props.step as vec.Vector2; | ||
|
||
const uniqueId = React.useId(); | ||
const descriptionId = `interactive-graph-description-${uniqueId}`; | ||
const graphRef = React.useRef<HTMLElement>(null); | ||
const dependencies = useDependencies(); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
A slight stylistic improvement that might make it easier for future readers to see what parts of dependencies
are being used:
const dependencies = useDependencies(); | |
const {analytics} = useDependencies(); |
payload: { | ||
type: type, | ||
}, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
suggestion: We can shorten this shorthand property naming:
payload: { | |
type: type, | |
}, | |
payload: { type }, |
export type InteractiveGraphName = | ||
| "angle" | ||
| "segment" | ||
| "linear-system" | ||
| "linear" | ||
| "ray" | ||
| "none" | ||
| "polygon" | ||
| "point" | ||
| "circle" | ||
| "quadratic" | ||
| "sinusoid"; | ||
|
||
export type InteractiveGraphEnum = | ||
| "ANGLE" | ||
| "SEGMENT" | ||
| "LINEAR_SYSTEM" | ||
| "LINEAR" | ||
| "RAY" | ||
| "NONE" | ||
| "POLYGON" | ||
| "POINT" | ||
| "CIRCLE" | ||
| "QUADRATIC" | ||
| "SINUSOID"; | ||
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
suggestion: I'm guessing the InteracativeGraphEnum
matches the enum values for the event in CEDAR? In that case, I'd recommend that this mapping live in webapp's adapter rather than here. Otherwise we're pulling CEDAR concepts into the Perseus codebase. I think it's completely fine to use the interactive-graph
's graph type in the event and then map it to the CEDAR value in webapp.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM!
Summary:
Adding new analytic event to interactive graph when it renders while adding details on what type of graph is rendered.
Issue: LEMS-2324
Test plan: