7969a4971a
Frontend + wiring only. Wires existing backend into the pages users see. - VYNDR Original archetype rename (41) across archetypeService.js + lib/ archetypes.js + ArchetypeBadge, each keeping legacyName (resolves stale data). Judge -> BOMBER. Old POWER PULL slot -> WHIFF strikeout-artist pitcher. - BACKEND_HANDOFF.md: canonical frontend<->backend data contract. - Grade card intel: scan/page.tsx now forwards the engine's intel fields (season_avg/form/usage/matchup_grade/archetype/...) into mapScanToGradeResult -> STAT CONTEXT + VYNDR INTELLIGENCE sections populate. The chain already preserved them (tierGating + /api/scan spread); the page was dropping them. - Schedule freshness: slateAdapter.isRelevantGame drops completed games >24h old; Slate.filteredGames applies it. (TTL already 60s.) - Landing: Features.tsx rewritten to user-facing copy (no Point-biserial/Zone 14/ABS/Phi-coefficient). - Depth chart Next proxies added (/api/stats/lineup|depth|cascade) - were 404. - GameCard swap DEFERRED (Kev): legacy on-demand card stays as a bridge until the snapshot pipeline populates the grades cache; vyndr/GameCard swaps in then. Backend 2045 -> 2061 tests (+16), 167 suites. Web build clean (exit 0). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
76 lines
2.7 KiB
JavaScript
76 lines
2.7 KiB
JavaScript
// Session 42 — ArchetypeBadge + ArchetypeBlend (frontend). Logic runs via the
|
||
// CommonJS lib; the .tsx is asserted as text (Phase-D–H pattern).
|
||
|
||
const fs = require('fs');
|
||
const path = require('path');
|
||
const WEB = path.join(__dirname, '..', '..', 'web', 'src');
|
||
const read = (rel) => fs.readFileSync(path.join(WEB, rel), 'utf8');
|
||
const arch = require('../../web/src/lib/archetypes');
|
||
const svc = require('../../src/services/archetypeService');
|
||
|
||
describe('archetypes lib — badge styling', () => {
|
||
it('full variant fills with the archetype color + white text', () => {
|
||
const s = arch.badgeStyle('BOMBER', 'full', 'md');
|
||
expect(s.bg).toBe('#FF6B4A');
|
||
expect(s.textColor).toBe('#FFFFFF');
|
||
expect(s.borderColor).toBe('#FF6B4A');
|
||
});
|
||
|
||
it('ghost variant is transparent with a colored border', () => {
|
||
const s = arch.badgeStyle('CONDUCTOR', 'ghost', 'sm');
|
||
expect(s.bg).toBe('transparent');
|
||
expect(s.textColor).toBe('#4A9EFF');
|
||
expect(s.borderColor).toBe('#4A9EFFCC');
|
||
});
|
||
|
||
it('tint variant (default) uses a low-alpha tinted background', () => {
|
||
const s = arch.badgeStyle('ALPHA');
|
||
expect(s.bg).toBe('#A78BFA1F');
|
||
expect(s.borderColor).toBe('#A78BFA52');
|
||
});
|
||
|
||
it('archetypeColor matches and is case-insensitive', () => {
|
||
expect(arch.archetypeColor('ace')).toBe('#A78BFA');
|
||
expect(arch.archetypeColor('Two-Way Anchor')).toBe('#A78BFA');
|
||
});
|
||
|
||
it('glyphSvg returns a 16x16 svg wrapper', () => {
|
||
const svg = arch.glyphSvg('star');
|
||
expect(svg).toContain('viewBox="0 0 16 16"');
|
||
expect(svg).toContain('<path');
|
||
});
|
||
|
||
it('unknown archetype degrades to a neutral grey', () => {
|
||
expect(arch.archetypeColor('NOT REAL')).toBe('#9499A8');
|
||
});
|
||
});
|
||
|
||
describe('archetypes lib — colors agree with the backend service', () => {
|
||
it('every backend archetype color equals the frontend map color', () => {
|
||
for (const [name, a] of Object.entries(svc.ARCHETYPES)) {
|
||
expect(arch.archetypeColor(name)).toBe(a.color);
|
||
}
|
||
});
|
||
});
|
||
|
||
describe('ArchetypeBadge.tsx', () => {
|
||
const src = read('components/vyndr/ArchetypeBadge.tsx');
|
||
it('renders the glyph via dangerouslySetInnerHTML and uses mono', () => {
|
||
expect(src).toContain('dangerouslySetInnerHTML');
|
||
expect(src).toContain('badgeStyle');
|
||
expect(src).toContain('className="mono"');
|
||
});
|
||
it('supports full / ghost / tint variants', () => {
|
||
expect(src).toContain("'full' | 'ghost' | 'tint'");
|
||
});
|
||
});
|
||
|
||
describe('ArchetypeBlend.tsx', () => {
|
||
const src = read('components/vyndr/ArchetypeBlend.tsx');
|
||
it('colors segments via archetypeColor and renders a PRIMARY legend', () => {
|
||
expect(src).toContain('archetypeColor');
|
||
expect(src).toContain('PRIMARY');
|
||
expect(src).toContain('ArchetypeBadge');
|
||
});
|
||
});
|