|
| 1 | +--- |
| 2 | +description: Take a triaged bug or feature request through to a verified change on a branch, ready for /commit and /pr — using this session's investigation plus the Jira ticket |
| 3 | +--- |
| 4 | + |
| 5 | +Implement a fix or feature that's already been triaged (typically by `/slack-triage` earlier in this |
| 6 | +same session) and land it as a **verified change on a branch**, stopping before commit. This is the |
| 7 | +bridge between a Jira ticket and `/commit` → `/pr`. Works for both bugs and feature requests — it's |
| 8 | +not always a "fix". |
| 9 | + |
| 10 | +Usage: `/implement [INSTUI-1234]` — pass a ticket key if you have one. If `$ARGUMENTS` is empty, use |
| 11 | +the ticket and investigation from this session. |
| 12 | + |
| 13 | +**Confirm direction at every decision point.** Don't assume the diagnosis or the fix and charge |
| 14 | +ahead — a wrong assumption here means a wasted branch. At each step below, state your read and your |
| 15 | +proposed next move, then pause for the user to confirm or redirect before investing effort. |
| 16 | + |
| 17 | +## Step 1 — Establish context: WHAT is happening (prefer this session over the ticket) |
| 18 | + |
| 19 | +Triage (and the ticket) deliberately captured **WHAT** is happening and **WHAT SHOULD** happen — the |
| 20 | +confirmed repro, observed-vs-expected behavior, affected component, version/v1-v2 notes — and |
| 21 | +deliberately **did not** investigate the cause. So your starting spec is that confirmed behavior, and |
| 22 | +your first real job (Step 2) is the WHY. |
| 23 | + |
| 24 | +Source the WHAT in this priority order: |
| 25 | + |
| 26 | +1. **This session's triage** (primary). If `/slack-triage` ran earlier in this conversation, carry |
| 27 | + forward the confirmed reproduction and the agreed expected behavior. Treat these as the working spec. |
| 28 | +2. **The Jira ticket** (durable anchor). Read it (Jira MCP / `$ARGUMENTS` key) to pin the scope, |
| 29 | + acceptance criteria, and the Slack-thread link — but as a *reference point*, not a replacement for |
| 30 | + the session's detail. If the ticket and your session findings conflict, prefer the verified session |
| 31 | + findings and note the discrepancy to the user. |
| 32 | +3. **Cold start fallback.** If there's *no* prior triage in this session (fresh conversation, or you |
| 33 | + only have a ticket key), reconstruct the WHAT before coding: read the ticket, then re-establish the |
| 34 | + observed/expected behavior — read the README/`props.ts`/`theme.ts`, cross-check the published docs, |
| 35 | + and rebuild the repro. Don't start off a one-paragraph ticket. |
| 36 | + |
| 37 | +State briefly which sources you're working from, and confirm the WHAT with the user, before moving on. |
| 38 | + |
| 39 | +## Step 2 — Diagnose the cause (the WHY) and confirm the approach |
| 40 | + |
| 41 | +This is the investigation triage skipped — and it's where most wrong turns happen, so **confirm before |
| 42 | +you code**. |
| 43 | + |
| 44 | +- **Find the root cause.** Trace the confirmed repro to the responsible code path; cite the exact |
| 45 | + `file:line`. Use the Chrome DevTools MCP against the live app (`pnpm run dev` → http://localhost:9090) |
| 46 | + to inspect state/DOM/console where that helps pin it down. |
| 47 | +- **For a regression, trace the introducing commit/PR.** Did this used to work and break? Use |
| 48 | + `git log -p`/`git blame`/`git log -S'<symbol>'` on the relevant path, or bisect against dated |
| 49 | + `CHANGELOG.md` entries / release tags. Capture the short SHA + subject, the author/date |
| 50 | + (`git show -s --format='%an <%ae>, %ad' <sha>`), and the merging PR |
| 51 | + (`gh pr list --search <sha> --state merged --json number,title,url`). **Verify the suspect code is |
| 52 | + actually on `master`/the released tag** — a commit on an unmerged branch is not the shipped |
| 53 | + regression. Skip the archaeology only when it's clearly an original defect (never worked); say so. |
| 54 | +- **Propose the fix approach and get sign-off.** State the root cause and the change you intend to |
| 55 | + make (which file(s), v1 vs v2, prop vs theme vs logic), and any alternatives, in a few lines. **Wait |
| 56 | + for the user to confirm the direction** before editing. If there are real options with trade-offs, |
| 57 | + lay them out rather than silently picking one. |
| 58 | + |
| 59 | +## Step 3 — Branch (confirm first) |
| 60 | + |
| 61 | +The change goes on a **new branch off `master`** — not the current branch (CLAUDE.md: branch from |
| 62 | +master, integrate by **rebasing**, never merge). Before creating it, **sanity-check with the user**: |
| 63 | + |
| 64 | +- Show the current branch and the branch you propose to create (a descriptive name; include the |
| 65 | + ticket key if there is one), and wait for confirmation before running `git switch -c`. |
| 66 | +- Call out anything off: if you're already on a feature branch (especially one with unrelated WIP, or |
| 67 | + the very session that ran `/slack-triage`), say so — the user may want to branch off `master` |
| 68 | + rather than stack on it, or may intend to keep working on the current branch. |
| 69 | + |
| 70 | +Only branch once the user confirms the name and starting point. |
| 71 | + |
| 72 | +## Step 4 — Implement, honoring InstUI conventions |
| 73 | + |
| 74 | +Make the change at the location and via the approach confirmed in Step 2. Enforce the rules the |
| 75 | +commit/PR skills don't: |
| 76 | + |
| 77 | +- **No hardcoded user-facing strings** — all UI text comes from props for i18n (the most common review |
| 78 | + comment). |
| 79 | +- **New components: functional + hooks only.** Styling via the co-located Emotion `theme.ts`. |
| 80 | +- **No breaking changes unless the user explicitly asked** — removing/renaming a prop, component, theme |
| 81 | + variable, or exported util; changing a prop type or a behavior-altering default. Adding optional |
| 82 | + props / new components / new theme variables is fine. If a break is genuinely required, flag it and |
| 83 | + get explicit sign-off; it must carry `BREAKING CHANGE:` in the commit. |
| 84 | +- **v1/v2:** if the component has both, change the right version (default to v2 for new work; confirm |
| 85 | + before touching deprecated v1). |
| 86 | +- **Docs & tests in the same change:** if you add/change a prop, update the component **README**. Add or |
| 87 | + extend co-located **unit tests** (`*.test.tsx`), a **regression-test page** under |
| 88 | + `/regression-test/src/app/<name>/page.tsx`, and a **Cypress entry** in |
| 89 | + `/regression-test/cypress/e2e/spec.cy.ts`. Maintain WCAG 2.1 AA and RTL support. |
| 90 | + |
| 91 | +## Step 5 — Verify against the original repro |
| 92 | + |
| 93 | +A change isn't done until it's shown to work: |
| 94 | + |
| 95 | +- Run the package's unit tests: `pnpm run test:vitest <pkg>`. |
| 96 | +- Re-run the **confirmed reproduction from triage** and show it now behaves as expected. Drive it live |
| 97 | + with the **Chrome DevTools MCP** against `pnpm run dev` (or the `verify` skill) — open the exact spot, |
| 98 | + exercise the repro, and capture the now-correct behavior (snapshot/console/screenshot). For a bug, |
| 99 | + the exact repro that demonstrated the failure should now pass; for a feature, the use case from the |
| 100 | + ticket should work. Report what you observed. |
| 101 | + |
| 102 | +## Step 6 — Hand off (stop before commit) |
| 103 | + |
| 104 | +Stop at a **verified diff on the branch** and summarize: what changed and why (now you *can* state the |
| 105 | +cause — it's confirmed), files touched, test/repro results, and any follow-ups. **Do not commit or open |
| 106 | +a PR automatically** — the diff needs human review. Tell the user to run `/commit` then `/pr` (the PR |
| 107 | +body should reference the `INSTUI-` ticket) once they're happy. |
| 108 | + |
| 109 | +If the change is non-trivial and you only got partway, **say so plainly** — leave a documented WIP branch |
| 110 | +and list what's left, rather than forcing a wrong or incomplete change to look finished. |
0 commit comments