refactor(components): split MathComponents into notation/crystalCut/axisConventions#75
Conversation
…stalCut/axisConventions Move-only, no behavioural change. MathComponents.tsx (571 lines, 19 exports) mixed four concerns; split along the existing boundaries into three focused modules and keep the two composite panels: - notation.tsx: SectionHeader, getCrystalIcon, TensorTerm, FormatPointGroup, FormatGroupLabel, FormatSchoenflies, SymmetryOperation - crystalCut.tsx: KPreset, getPresetsForSystem, LabFrameOrientation, KDirectionSelector - axisConventions.tsx: MonoclinicFrame, getMonoclinicFrame, MONOCLINIC_FRAMES, getAxisTooltipId, AxisOrientationInfo, ConventionNote - MathComponents.tsx: keeps the composite CrystalSettingControl + GroupIdentityHeader All 11 importers (+ the test) updated to the new paths; no re-export barrel. No golden fixture touched. Gates green: lint clean, build passes, test count unchanged (1626). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
There was a problem hiding this comment.
Pull request overview
Refactors the UI “math” component utilities by splitting the former grab-bag MathComponents.tsx into three focused modules (notation, crystal-cut controls, and axis-convention helpers) while keeping the higher-level composite panels in MathComponents.tsx, and updating import sites accordingly.
Changes:
- Introduces
notation.tsx,crystalCut.tsx, andaxisConventions.tsxand moves the corresponding exports into them. - Updates component import paths throughout
src/components/*andsrc/App.tsxto reference the new modules directly (no barrel re-export). - Updates
MathComponents.test.tsto import from the new module locations.
Reviewed changes
Copilot reviewed 15 out of 15 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| src/components/TensorSetupControls.tsx | Switch SectionHeader import to ./notation. |
| src/components/TensorComponentControls.tsx | Switch TensorTerm/SectionHeader imports to ./notation. |
| src/components/SimulatorSetupPanel.tsx | Switch crystal-cut imports to ./crystalCut. |
| src/components/SimulatorEquationPanel.tsx | Switch TensorTerm import to ./notation. |
| src/components/PolarimetrySection.tsx | Switch SectionHeader import to ./notation. |
| src/components/PointGroupExplorer.tsx | Switch group-formatting/icon imports to ./notation. |
| src/components/OperationsModal.tsx | Split imports between ./notation and ./axisConventions. |
| src/components/notation.tsx | New module containing notation/formatting exports (headers, icons, KaTeX formatting helpers). |
| src/components/MathComponents.tsx | Reduced to composite panels (CrystalSettingControl, GroupIdentityHeader) and updated internal imports. |
| src/components/MathComponents.test.ts | Updated tests to import moved helpers from ./axisConventions and ./crystalCut. |
| src/components/CrystalSystemInfoPanel.tsx | Switch notation/axis-orientation imports to new modules. |
| src/components/crystalCut.tsx | New module containing crystal-cut presets + selector UI. |
| src/components/axisConventions.tsx | New module containing monoclinic frame helpers + axis orientation UI. |
| src/components/CalculatorPage.tsx | Switch imports to ./notation + ./crystalCut, keep GroupIdentityHeader from ./MathComponents. |
| src/App.tsx | Switch FormatPointGroup import to ./components/notation. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <span className="font-mono font-medium">y</span> ∥ (<InlineMath math="c \times a" />) (∥ <InlineMath math="b^*" />)<br/> | ||
| <span className="font-mono font-medium">x</span> = <InlineMath math="y \times z" /> (projection of <InlineMath math="a" /> onto plane ⊥ <InlineMath math="c" />) |
There was a problem hiding this comment.
These are JSX attribute string literals (<InlineMath math="y \times z" />), not JavaScript string literals, so backslash escape sequences are not processed — \times is passed to KaTeX verbatim and renders correctly. (Contrast crystalCut.tsx, where the presets are JS string literals and correctly use \\times.) This code is a byte-identical move from the long-shipping MathComponents.tsx on main and renders fine. Double-escaping to \\times here would actually break it, since KaTeX reads \\ as a line break. No change made.
| <span className="font-mono font-medium">x</span> ∥ <InlineMath math="[100]" /> / <InlineMath math="[2\bar{1}\bar{1}0]" /> (a-axis)<br/> | ||
| <span className="font-mono font-medium">y</span> ∥ <InlineMath math="[120]" /> / <InlineMath math="[01\bar{1}0]" /> |
There was a problem hiding this comment.
Same as above: this is a JSX attribute string literal (math="[01\bar{1}0]"), where \bar is passed to KaTeX literally (JSX attributes do not process \b/\t escapes). Verified against the production code on main and the green KaTeX render/tests. Changing to \\bar would pass a literal double-backslash to KaTeX and break rendering. No change made.
What
Move-only refactor:
src/components/MathComponents.tsx(571 lines, 19 exports) mixed fourconcerns and was imported by 11 files. Split it along the existing internal boundaries into
three focused modules, keeping the two composite panels in place. No logic change.
notation.tsxSectionHeader,getCrystalIcon,TensorTerm,FormatPointGroup,FormatGroupLabel,FormatSchoenflies,SymmetryOperationcrystalCut.tsxKPreset,getPresetsForSystem,LabFrameOrientation,KDirectionSelectoraxisConventions.tsxMonoclinicFrame,getMonoclinicFrame,MONOCLINIC_FRAMES,getAxisTooltipId,AxisOrientationInfo,ConventionNoteMathComponents.tsx(kept)CrystalSettingControl,GroupIdentityHeaderAll importers updated to the new paths — no re-export barrel (the point is to dissolve the
grab-bag).
symmetryGroups.tsdeliberately untouched.Safety guarantee
npm run lintclean,npm run buildpasses,npm run test1626 passed (22 files) — identical count.Scoped from
WORKORDER-audit-hygiene-and-split.mdPart F (kept as its own PR, separate from thedocs/planning hygiene in Parts A–E which merged locally).
🤖 Generated with Claude Code