feat: add manual Y-axis range controls with auto fallback#64
feat: add manual Y-axis range controls with auto fallback#64
Conversation
|
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: cb15a04c1d
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| const handleYRangeChange = (field, value) => { | ||
| const newRange = { ...yRange, [field]: value === '' ? undefined : Number(value) }; | ||
| onYRangeChange(newRange); |
There was a problem hiding this comment.
Preserve raw Y input text until value is complete
Parsing e.target.value with Number(...) on every keystroke drops intermediate numeric states ("-", "0.", etc.), so users cannot reliably type negative or decimal Y bounds; the control snaps to empty/integer values before the input is complete. This breaks manual range entry for common datasets (especially comparison/relative values) unless users paste the full number in one shot.
Useful? React with 👍 / 👎.
| return { | ||
| ...autoScale, | ||
| min, | ||
| max | ||
| }; |
There was a problem hiding this comment.
Recompute Y tick step after overriding min/max
After applying manual bounds, this function keeps autoScale.step unchanged while replacing min/max, so the chart can use a step size that no longer matches the displayed range. In practice, widening bounds (for example from an auto range near 0..1 to a manual max in the thousands) can produce extremely dense ticks and hurt chart readability/performance.
Useful? React with 👍 / 👎.
Motivation
minor onlymax) and an easy way to revert to automatic scaling to avoid breaking existing workflows.Description
yRangestate inAppand passed it intoRegexControlsandChartContainerto expose UI and rendering hooks for Y-axis control.RegexControlswithmin/maxinputs and anAutobutton that clears manual bounds and returns to automatic scaling.ChartContaineraddedgetFinalYScalewhich merges manualyRangewith the computed automaticnicescale and safely falls back to auto when manual bounds are invalid; the same logic is applied to comparison charts.public/locales/en/translation.jsonandpublic/locales/zh/translation.jsonfor the new UI labels and hints.Testing
npm test -- --runand all tests passed (13test files,57tests).npm run lintand it completed successfully with an existing unrelated warning aboutreact-refresh/only-export-components.Codex Task