D619: the archetype card page's three sections, from the owner's canvas (#1006)

[guillaumelauzier]

Objective

Your #1006 canvas, built. You sent it for #1006's needs-design (https://claude.ai/artifact/6yTsUgRHkkiCwBpfZpwshh). It draws three sections under the archetype card on /studio/archetype:

• Skills: your skills, two ways;
• History: how your archetype has changed;
• Matches: who you match with, with the members who published.

D602 put their routes, client methods and data on main. This draws them.

Closes #1006.

Implementation

The canvas

The artifact is a board and the component its last seven artboards import. Both go into design/canvases/integrated/, since the route runs (81 → 83):

• Studio · Archetype card.dc.html, the board:
  • A1–A4 and A10: the compact /studio card;
  • A5–A23: the page top, one artboard per archetype;
  • A9: the phone;
  • A24–A30: the three sections.
• Archetype Full Sections.dc.html, the component.

The board is its own canvas, so it sits beside Studio · Archetype preview and does not replace it.

The export left out a script. The component loads its sample data from archetype-full.js, which the export did not include, so the canvas opens with its sections empty. Its markup, copy and states are complete, and the build follows them.

Skills: "Your skills, two ways" (GET /api/skills/me/evidence)

• One radar, two layers.
  • Self is a violet shape out to your own 0–5 rating. It joins rated axes only, so an axis you have not rated is a gap, never a point at 0. A rated axis with no rated neighbour is a dot.
  • Evidence is an amber dot per axis, out by how much you have done there. The outer ring is the "corroborated" threshold, read from the reply.
  • Evidence only shows its count of activities, not a level.
  • Not recorded is written on the axis.
• The table names every axis, its state, your rating ("4 / 5") and the activity count. A missing value is "—".
• The legend says what the five states mean.
• Nothing recorded at all: no shape, one "Not recorded" in the middle, and "Answer a few skill questions with Eadwyn to fill this in." with Open Eadwyn.

History: "How your archetype has changed" (GET /api/profile/history)

• One point per change of the displayed archetype, oldest first, each with its date and what triggered it.
• "Current" sits on the last point when it is the archetype the card shows.
• One point: "This is your first archetype. Changes appear here as your answers and activity build up."
• The layout is horizontal on a desktop and stacked on a phone.

Matches: "Who you match with" (GET /api/profile/published-members, GET/PUT /api/profile/archetype-published)

• The publish banner shows whether yours is published, with a switch. Changing it re-reads the list.
• Every match type shows, with its reason. Under it are the members who published that archetype:
  • each with a name, role, archetype and D605's values line;
  • three, then "and N more", which shows the rest.
• A type nobody has published says so.
• Locked by plan: "Matches are not included in your plan." with See plans.

On the page

• Each section reads its own source and has its own Try again.
  • Loading is a skeleton.
  • A failed read says what could not be read, never an empty radar or list.
• The card's static "Who you match with" list is now the Matches section.

Where the build departs from the canvas, and why

• The radar uses short labels (Eng, GTM, Brand…), as the platform's other radar does, so eight fit a phone. The table names each axis in full.
• The evidence scale is the reply's own threshold. The canvas's sample data, which would have shown its scale, was not in the export.
• Evidence dots are amber-500 in dark mode. The canvas's #92400e is about 2.5:1 on the dark card, under the 3:1 a graphic needs.
• A failed read also says what it is not, for example "This is not a claim that none are recorded.", as the repo's other failed reads do.
• The values line is D605's.
  • The canvas, drawn before D605, shows a chip reading "coming soon".
  • With no comparison (you have not published), there is no chip, and the reason shows once above the list.
  • The privacy line now names the comparison.
• "and N more" is a button, where the canvas draws plain text.
• "Current" can be absent. The card reads the v1 archetype (best-fit/me), and the history reads the v2 snapshots, which change only after hysteresis.
  • When the two differ, the last point is unmarked, and a line says the card shows another archetype.
  • Moving the card to v2 is part of Archetype card: the board's compact card and page top (A1–A23), from the #1006 canvas (D620) #1323.
• States the canvas does not draw:
  • the matches loading;
  • a history with nothing saved yet, or cut at the route's 200 snapshots;
  • a publish state that could not be read, or a change that did not save.
• A locked archetype shows Skills (never locked) and the matches' lock, and no History, since its points are the archetype the plan withholds.
• Per-axis provenance, asked for in Profiling v2: archetype card page v2 (D602), runs last #1006's request, is not shown: the canvas draws none.

Not built here

A1–A23 draw the compact /studio card and the page top differently from main. Your prompt asked to keep the card's top as it was. They are #1323 (D620), filed with S1's recommendations:

• keep the 50/50 split for "both";
• keep the copy later decisions set;
• keep the XP bar.

Files changed

• Frontend:
  • components/profile/ArchetypeSections.jsx (new)
  • lib/archetypeCardV2.js
  • pages/ArchetypeCardPage.jsx
• Design:
  • design/canvases/integrated/Studio · Archetype card.dc.html (new)
  • design/canvases/integrated/Archetype Full Sections.dc.html (new)
  • both canvas READMEs
• Docs:
  • decisions/D619.md (new)
  • ROUTE_MAP.md: one row, and the archetype preview row's note
  • PROFILE_ROUTING.md and PAGE_INVENTORY.md, regenerated
• Tests:
  • frontend/test/archetype_sections_d619.test.mjs (new)
  • studio_archetype_card.test.mjs
  • profile_routing_fresh.test.mjs

Testing

The full suite. npm run build, then npm run test:drift, gave EXIT=0 on this PR's head (9977dce4b, on main at 44b7b22c3):

• frontend: 5,107 pass;
• Worker: 5,919 pass, 3 skipped;
• retention: 127 pass;
• the guards, both type checks, lint:undef and the dark-mode check all pass.

New tests (24):

• The radar: the self shape over rated axes only, the evidence scale and its cap, evidence only, Not recorded, and the table's absent values.
• The timeline: order, persona, the four triggers, "Current" only on the card's archetype, a cut history, and dates read as UTC in two time zones.
• A member row: a name, role, archetype and values line, and nothing else.
• Every rendered state of the three sections and the publish banner.
• The page's wiring: each source, each retry, and a malformed reply read as unreadable.
• The committed canvas.

Mutation checks: 35 of 35 caught. Each undid one behaviour, and every file was restored and checked by sha256.

Rendered check. The built bundle was served with stubbed /api replies, at 1280 and 390 wide, in light and dark:

• One axis of each state:
  • 3 evidence dots, 2 Not recorded gaps, and the lone rated axis as a dot;
  • five timeline points, "Current" on the last;
  • five match types, and members with their values lines.
• Nothing recorded: the middle label and the Eadwyn prompt, a first archetype, and an unpublished banner.
• Every read failing: three failure cards, each with its own Try again.
• Locked: Skills and the matches' lock.
• Publishing toggled: the switch flips, and the list is read again.
• No page errors, and nothing scrolls sideways.

Risks

• What ships: the frontend only. There is no Worker change and no migration.
• Who notices: every member who opens /studio/archetype sees the three sections under the card.
• Roll back by reverting the merge.

Dependencies

• D602 (D602: archetype card v2 data half — published-member matches, radar and timeline shapes, assessment fallback retired #1288) and D605 (Profiling v2 §6: values compatibility across roles on the card's matches, Worker first (D605) #1296) are on main.
• D606 (D606: the Eadwyn Tickets canvas, built: the review queue and the Eadwyn chat's Tasks and My tickets (closes #1107, #1108) #1319) merged first. This branch is rebased onto it, and the counts follow it: integrated/ 81 → 83, and ROUTE_MAP's rows 137 → 138.

Agent

S01 · Claude Code

Review requested

The owner.

🤖 Generated with Claude Code

https://claude.ai/code/session_018jkNYLq29UXAvcqYxGCSB3

---

Generated by Claude Code

[github-actions]

Preview: https://studioos-pr-1326.guillaumelauzier.workers.dev (built from 9977dce)

The pull request's SPA build on a Worker with no bindings: pages and deep links work, /api/* is a 404, and nothing here can reach production data. Redeployed on every push; deleted when the PR closes.