Assemble a body's readouts once, not once per panel
Follow-up to review on #3. The card and the detail page each built their own Measured/Derived split, kind label and provenance sentence — the drift buildBodyViewModel exists to prevent, re-forked one layer up, and the drift would have been in which side of the measured/derived line a quantity falls on, which is the distinction those panels exist to draw. One bodyReadouts(body) now returns both blocks and the sentence, and both templates iterate it. The two surfaces render identical rows as a result, and the card gains the inclination the detail page already showed. Also from that review: - KIND_LABELS was duplicated between the two panels; it now lives beside bodyReadouts. The third copy the review pointed at is a different union (search results are star/body/exoplanet, and label a body "Body"), so it stays where it is. - CardRow was HudReadout renamed. Both are now Readout, which HudReadout extends with its derived flag. - The enterable-systems count was a 21-line lazy memo over arrays that are already in hand; it is one expression where those arrays are assigned. - buildBodyViewModel now carries hostStarId, so the detail scene stops rescanning both catalogues for something the builder had already resolved. - heliocentricPeriodDays was called twice for the same body. - The superscript helper was a split/map/join; it is a replace. - info-panel had five computed() each wrapping one pure call with a non-null assertion, beside a template that inlined the same kind of call directly. They are gone with the shared readouts. - Dropped a tautological test that compared a pure function to itself. Replaced with one that asserts the host star id the builder now carries. - Removed the orphaned doc comment left behind when formatParsecs/formatAu moved out. And one the review raised as out of scope but is worth taking: formatRadiusKm grouped thousands above its decimal threshold and not below it, so 69,911 km sat beside a bare 6371 km. Both are grouped now. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01WaySiNst4HhDXBHnMy8p5G
This commit is contained in:
@@ -43,13 +43,15 @@ describe('formatPeriod', () => {
|
||||
});
|
||||
|
||||
describe('formatRadiusKm', () => {
|
||||
it('groups thousands for large bodies', () => {
|
||||
it('groups thousands on both sides of the decimal threshold', () => {
|
||||
// Not just above it: 69,911 km beside a bare 6371 km reads as two different conventions.
|
||||
expect(formatRadiusKm(69_911)).toBe('69,911 km');
|
||||
expect(formatRadiusKm(6371)).toBe('6,371 km');
|
||||
});
|
||||
|
||||
it('keeps a decimal only for small ones', () => {
|
||||
expect(formatRadiusKm(6371)).toBe('6371 km');
|
||||
it('keeps a decimal only for small bodies', () => {
|
||||
expect(formatRadiusKm(11.3)).toBe('11.3 km');
|
||||
expect(formatRadiusKm(1737)).toBe('1,737 km');
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@@ -38,7 +38,10 @@ export function formatPeriod(days: number): string {
|
||||
|
||||
/** Radius in kilometres, or Earth radii once the number stops being legible in km. */
|
||||
export function formatRadiusKm(radiusKm: number): string {
|
||||
return radiusKm >= 10_000 ? `${Math.round(radiusKm).toLocaleString('en-GB')} km` : `${radiusKm.toFixed(radiusKm < 100 ? 1 : 0)} km`;
|
||||
// Grouped on both sides of the decimal threshold: 69,911 km beside a bare 6371 km reads as two
|
||||
// different conventions rather than one.
|
||||
const digits = radiusKm < 100 ? 1 : 0;
|
||||
return `${radiusKm.toLocaleString('en-GB', { minimumFractionDigits: digits, maximumFractionDigits: digits })} km`;
|
||||
}
|
||||
|
||||
/** Mass in Earth masses. */
|
||||
@@ -68,13 +71,6 @@ export function formatLuminosity(solar: number): string {
|
||||
return `${solar.toFixed(solar < 1 ? 3 : 2)} L☉`;
|
||||
}
|
||||
|
||||
const SUPERSCRIPTS = ['⁰', '¹', '²', '³', '⁴', '⁵', '⁶', '⁷', '⁸', '⁹'];
|
||||
|
||||
function superscript(value: number): string {
|
||||
const digits = Math.abs(value)
|
||||
.toString()
|
||||
.split('')
|
||||
.map((digit) => SUPERSCRIPTS[Number(digit)])
|
||||
.join('');
|
||||
return value < 0 ? `⁻${digits}` : digits;
|
||||
return `${value}`.replace('-', '⁻').replace(/\d/g, (digit) => '⁰¹²³⁴⁵⁶⁷⁸⁹'[Number(digit)]);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,5 @@
|
||||
/** A labelled quantity ready for display — the shape every panel in the app renders. */
|
||||
export interface Readout {
|
||||
readonly label: string;
|
||||
readonly value: string;
|
||||
}
|
||||
Reference in New Issue
Block a user