UI overhaul Phase 5h: extract Measurement Summary tiles - #184
Merged
Conversation
Move the Measurement Summary DeviceRack (TEMPO / KEY SIG / METER / CHARACTER tiles) out of the AnalysisResults monolith into a focused MeasurementSummarySection component. Pure extraction — the section already rendered on the design-system primitives (DeviceRack / MetricTile / MetricBar / Pill / ConfidenceBandBadge / TokenBadgeList) with token-only classes, so no restyle was needed. - New apps/ui/src/components/analysisResults/MeasurementSummarySection.tsx takes phase1 + the parent-derived finalBpm/finalKey/keyIsApproximate/ characteristicPills as props (state stays in the parent). The four helpers exclusive to this section (shortenCharacteristicName, characteristicPillClass, isAssumedMeter, meterStatusLabel) move in alongside it. - lowConfidenceIndicator (+ its title constant) moves to analysisResults/shared.tsx since it is shared with the harmonic-content card still inline in AnalysisResults, which imports it back. - Removed the now-orphaned imports the move left behind (Activity/Clock/ Disc/Music icons, MetricBar/MetricTile/TokenBadgeList primitives, PhaseSourceBadge). DOM output, data-testids, and data-text-roles are byte-identical. tsc, lint:style, build, and all 830 unit tests green with zero test changes. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_016to3B8Hf9eAGxAbzpQNvku
This was referenced Jun 24, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
What
Continues the
AnalysisResults.tsxmonolith split (Phase 5). Extracts the Measurement Summary DeviceRack — the TEMPO / KEY SIG / METER / CHARACTER tiles at the top of the results scroll — into a focusedMeasurementSummarySectioncomponent.This is a pure move: the section already rendered on the design-system primitives (
DeviceRack/MetricTile/MetricBar/Pill/ConfidenceBandBadge/TokenBadgeList) with token-only classes, so no restyle was needed.Changes
apps/ui/src/components/analysisResults/MeasurementSummarySection.tsx— takesphase1plus the parent-derivedfinalBpm/finalKey/keyIsApproximate/characteristicPillsas props (state stays in the parent, per the high-coupling-slice pattern). The four helpers exclusive to this section (shortenCharacteristicName,characteristicPillClass,isAssumedMeter,meterStatusLabel) move in alongside it.lowConfidenceIndicator(+ its title constant) moves toanalysisResults/shared.tsxbecause it is shared with the harmonic-content card still inline inAnalysisResults, which now imports it back.Activity/Clock/Disc/Musicicons,MetricBar/MetricTile/TokenBadgeListprimitives,PhaseSourceBadge).AnalysisResults.tsx: ~170 lines lighter.Chain of custody / contract
Untouched. DOM output, every
data-testid, and everydata-text-roleare byte-identical — this is an import-only restructure. No Phase 1 contract change.Verification
npm run lint(tsc) ✅npm run lint:style✅npm run build✅npm run test:unit— 830 passed, zero test changes (a pure move changes no tests; a broken test would mean the move wasn't pure)🤖 Generated with Claude Code
https://claude.ai/code/session_016to3B8Hf9eAGxAbzpQNvku
Generated by Claude Code