@heihei0299/matt-skills 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/.agents/skills/ask-matt/SKILL.md +78 -0
  2. package/.agents/skills/ask-matt/agents/openai.yaml +5 -0
  3. package/.agents/skills/code-review/SKILL.md +94 -0
  4. package/.agents/skills/code-review/agents/openai.yaml +3 -0
  5. package/.agents/skills/codebase-design/DEEPENING.md +37 -0
  6. package/.agents/skills/codebase-design/DESIGN-IT-TWICE.md +44 -0
  7. package/.agents/skills/codebase-design/SKILL.md +114 -0
  8. package/.agents/skills/codebase-design/agents/openai.yaml +3 -0
  9. package/.agents/skills/commit-check/SKILL.md +65 -0
  10. package/.agents/skills/commit-check/agents/openai.yaml +5 -0
  11. package/.agents/skills/commit-check/scripts/scan-sensitive.sh +36 -0
  12. package/.agents/skills/diagnose-fix/SKILL.md +66 -0
  13. package/.agents/skills/diagnose-fix/agents/openai.yaml +5 -0
  14. package/.agents/skills/diagnose-fix/references/anti-patterns.md +20 -0
  15. package/.agents/skills/diagnosing-bugs/SKILL.md +134 -0
  16. package/.agents/skills/diagnosing-bugs/agents/openai.yaml +3 -0
  17. package/.agents/skills/diagnosing-bugs/scripts/hitl-loop.template.sh +41 -0
  18. package/.agents/skills/domain-modeling/ADR-FORMAT.md +47 -0
  19. package/.agents/skills/domain-modeling/CONTEXT-FORMAT.md +60 -0
  20. package/.agents/skills/domain-modeling/SKILL.md +74 -0
  21. package/.agents/skills/domain-modeling/agents/openai.yaml +3 -0
  22. package/.agents/skills/grill-me/SKILL.md +7 -0
  23. package/.agents/skills/grill-me/agents/openai.yaml +5 -0
  24. package/.agents/skills/grill-to-spec/SKILL.md +83 -0
  25. package/.agents/skills/grill-to-spec/agents/openai.yaml +5 -0
  26. package/.agents/skills/grill-to-spec/references/rules.md +33 -0
  27. package/.agents/skills/grill-with-docs/SKILL.md +7 -0
  28. package/.agents/skills/grill-with-docs/agents/openai.yaml +5 -0
  29. package/.agents/skills/grilling/SKILL.md +12 -0
  30. package/.agents/skills/grilling/agents/openai.yaml +3 -0
  31. package/.agents/skills/handoff/SKILL.md +16 -0
  32. package/.agents/skills/handoff/agents/openai.yaml +5 -0
  33. package/.agents/skills/implement/SKILL.md +15 -0
  34. package/.agents/skills/implement/agents/openai.yaml +5 -0
  35. package/.agents/skills/improve-codebase-architecture/HTML-REPORT.md +123 -0
  36. package/.agents/skills/improve-codebase-architecture/SKILL.md +71 -0
  37. package/.agents/skills/improve-codebase-architecture/agents/openai.yaml +5 -0
  38. package/.agents/skills/prototype/LOGIC.md +79 -0
  39. package/.agents/skills/prototype/SKILL.md +26 -0
  40. package/.agents/skills/prototype/UI.md +112 -0
  41. package/.agents/skills/prototype/agents/openai.yaml +3 -0
  42. package/.agents/skills/research/SKILL.md +12 -0
  43. package/.agents/skills/research/agents/openai.yaml +3 -0
  44. package/.agents/skills/resolving-merge-conflicts/SKILL.md +14 -0
  45. package/.agents/skills/resolving-merge-conflicts/agents/openai.yaml +3 -0
  46. package/.agents/skills/setup-matt-pocock-skills/SKILL.md +116 -0
  47. package/.agents/skills/setup-matt-pocock-skills/agents/openai.yaml +5 -0
  48. package/.agents/skills/setup-matt-pocock-skills/domain.md +51 -0
  49. package/.agents/skills/setup-matt-pocock-skills/issue-tracker-github.md +45 -0
  50. package/.agents/skills/setup-matt-pocock-skills/issue-tracker-gitlab.md +46 -0
  51. package/.agents/skills/setup-matt-pocock-skills/issue-tracker-local.md +30 -0
  52. package/.agents/skills/setup-matt-pocock-skills/triage-labels.md +15 -0
  53. package/.agents/skills/tdd/SKILL.md +36 -0
  54. package/.agents/skills/tdd/agents/openai.yaml +3 -0
  55. package/.agents/skills/tdd/mocking.md +59 -0
  56. package/.agents/skills/tdd/tests.md +77 -0
  57. package/.agents/skills/tdd-implement/SKILL.md +143 -0
  58. package/.agents/skills/tdd-implement/agents/openai.yaml +5 -0
  59. package/.agents/skills/tdd-implement/references/stages.md +315 -0
  60. package/.agents/skills/teach/GLOSSARY-FORMAT.md +35 -0
  61. package/.agents/skills/teach/LEARNING-RECORD-FORMAT.md +46 -0
  62. package/.agents/skills/teach/MISSION-FORMAT.md +31 -0
  63. package/.agents/skills/teach/RESOURCES-FORMAT.md +32 -0
  64. package/.agents/skills/teach/SKILL.md +140 -0
  65. package/.agents/skills/teach/agents/openai.yaml +5 -0
  66. package/.agents/skills/to-spec/SKILL.md +75 -0
  67. package/.agents/skills/to-spec/agents/openai.yaml +5 -0
  68. package/.agents/skills/to-tickets/SKILL.md +105 -0
  69. package/.agents/skills/to-tickets/agents/openai.yaml +5 -0
  70. package/.agents/skills/triage/AGENT-BRIEF.md +207 -0
  71. package/.agents/skills/triage/OUT-OF-SCOPE.md +105 -0
  72. package/.agents/skills/triage/SKILL.md +112 -0
  73. package/.agents/skills/triage/agents/openai.yaml +5 -0
  74. package/.agents/skills/wayfinder/SKILL.md +128 -0
  75. package/.agents/skills/wayfinder/agents/openai.yaml +5 -0
  76. package/.agents/skills/writing-great-skills/GLOSSARY.md +201 -0
  77. package/.agents/skills/writing-great-skills/SKILL.md +83 -0
  78. package/.agents/skills/writing-great-skills/agents/openai.yaml +5 -0
  79. package/LICENSE +21 -0
  80. package/README.md +167 -0
  81. package/bin/cli.js +353 -0
  82. package/package.json +26 -0
  83. package/template/.opencode/CONTEXT.md +47 -0
  84. package/template/.opencode/agents/issue-audit.md +52 -0
  85. package/template/.opencode/commands/grill-to-spec.md +13 -0
  86. package/template/.opencode/commands/handoff.md +12 -0
  87. package/template/.opencode/commands/improve-codebase-architecture.md +13 -0
  88. package/template/.opencode/commands/issue-audit.md +115 -0
  89. package/template/.opencode/commands/teach.md +12 -0
  90. package/template/.opencode/commands/to-spec.md +13 -0
  91. package/template/.opencode/commands/to-tickets.md +12 -0
  92. package/template/.opencode/commands/triage.md +12 -0
  93. package/template/.opencode/commands/wayfinder.md +13 -0
  94. package/template/.opencode/commands/writing-great-skills.md +12 -0
  95. package/template/.opencode/docs/agents/domain.md +51 -0
  96. package/template/.opencode/docs/agents/issue-tracker.md +30 -0
  97. package/template/.opencode/docs/agents/runtime-discipline.md +36 -0
  98. package/template/.opencode/docs/agents/skill-design.md +32 -0
  99. package/template/.opencode/docs/agents/triage-labels.md +15 -0
  100. package/template/.opencode/skills/commit-check/SKILL.md +65 -0
  101. package/template/.opencode/skills/commit-check/agents/openai.yaml +5 -0
  102. package/template/.opencode/skills/commit-check/scripts/scan-sensitive.sh +36 -0
  103. package/template/.opencode/skills/diagnose-fix/SKILL.md +66 -0
  104. package/template/.opencode/skills/diagnose-fix/agents/openai.yaml +5 -0
  105. package/template/.opencode/skills/diagnose-fix/references/anti-patterns.md +20 -0
  106. package/template/.opencode/skills/grill-to-spec/SKILL.md +83 -0
  107. package/template/.opencode/skills/grill-to-spec/agents/openai.yaml +5 -0
  108. package/template/.opencode/skills/grill-to-spec/references/rules.md +33 -0
  109. package/template/.opencode/skills/tdd-implement/SKILL.md +143 -0
  110. package/template/.opencode/skills/tdd-implement/agents/openai.yaml +5 -0
  111. package/template/.opencode/skills/tdd-implement/references/stages.md +315 -0
  112. package/template/.pi/agents/issue-audit.md +52 -0
  113. package/template/.pi/docs/agents/domain.md +51 -0
  114. package/template/.pi/docs/agents/issue-tracker.md +30 -0
  115. package/template/.pi/docs/agents/runtime-discipline.md +36 -0
  116. package/template/.pi/docs/agents/skill-design.md +32 -0
  117. package/template/.pi/docs/agents/triage-labels.md +15 -0
  118. package/template/.pi/prompts/issue-audit.md +114 -0
  119. package/template/.pi/skills/commit-check/SKILL.md +65 -0
  120. package/template/.pi/skills/commit-check/agents/openai.yaml +5 -0
  121. package/template/.pi/skills/commit-check/scripts/scan-sensitive.sh +36 -0
  122. package/template/.pi/skills/diagnose-fix/SKILL.md +66 -0
  123. package/template/.pi/skills/diagnose-fix/agents/openai.yaml +5 -0
  124. package/template/.pi/skills/diagnose-fix/references/anti-patterns.md +20 -0
  125. package/template/.pi/skills/grill-to-spec/SKILL.md +83 -0
  126. package/template/.pi/skills/grill-to-spec/agents/openai.yaml +5 -0
  127. package/template/.pi/skills/grill-to-spec/references/rules.md +33 -0
  128. package/template/.pi/skills/tdd-implement/SKILL.md +143 -0
  129. package/template/.pi/skills/tdd-implement/agents/openai.yaml +5 -0
  130. package/template/.pi/skills/tdd-implement/references/stages.md +315 -0
  131. package/template/AGENTS.md +59 -0
@@ -0,0 +1,123 @@
1
+ # HTML Report Format
2
+
3
+ The architectural review is rendered as a single self-contained HTML file in the OS temp directory. Tailwind and Mermaid both come from CDNs. Mermaid handles graph-shaped diagrams reliably; hand-built divs and inline SVG handle the more editorial visuals (mass diagrams, cross-sections). Mix the two — don't lean on Mermaid for everything, it'll start to look generic.
4
+
5
+ ## Scaffold
6
+
7
+ ```html
8
+ <!doctype html>
9
+ <html lang="en">
10
+ <head>
11
+ <meta charset="utf-8" />
12
+ <title>Architecture review — {{repo name}}</title>
13
+ <script src="https://cdn.tailwindcss.com"></script>
14
+ <script type="module">
15
+ import mermaid from "https://cdn.jsdelivr.net/npm/mermaid@11/dist/mermaid.esm.min.mjs";
16
+ mermaid.initialize({ startOnLoad: true, theme: "neutral", securityLevel: "loose" });
17
+ </script>
18
+ <style>
19
+ /* small custom layer for things Tailwind doesn't cover cleanly:
20
+ dashed seam lines, hand-drawn-feeling arrow heads, etc. */
21
+ .seam { stroke-dasharray: 4 4; }
22
+ .leak { stroke: #dc2626; }
23
+ .deep { background: linear-gradient(135deg, #0f172a, #1e293b); }
24
+ </style>
25
+ </head>
26
+ <body class="bg-stone-50 text-slate-900 font-sans">
27
+ <main class="max-w-5xl mx-auto px-6 py-12 space-y-12">
28
+ <header>...</header>
29
+ <section id="candidates" class="space-y-10">...</section>
30
+ <section id="top-recommendation">...</section>
31
+ </main>
32
+ </body>
33
+ </html>
34
+ ```
35
+
36
+ ## Header
37
+
38
+ Repo name, date, and a compact legend: solid box = module, dashed line = seam, red arrow = leakage, thick dark box = deep module. No introduction paragraph — straight into the candidates.
39
+
40
+ ## Candidate card
41
+
42
+ The diagrams carry the weight. Prose is sparse, plain, and uses the glossary terms (from the `/codebase-design` skill) without ceremony.
43
+
44
+ Each candidate is one `<article>`:
45
+
46
+ - **Title** — short, names the deepening (e.g. "Collapse the Order intake pipeline").
47
+ - **Badge row** — recommendation strength (`Strong` = emerald, `Worth exploring` = amber, `Speculative` = slate), plus a tag for the dependency category (`in-process`, `local-substitutable`, `ports & adapters`, `mock`).
48
+ - **Files** — monospaced list, `font-mono text-sm`.
49
+ - **Before / After diagram** — the centrepiece. Two columns, side by side. See patterns below.
50
+ - **Problem** — one sentence. What hurts.
51
+ - **Solution** — one sentence. What changes.
52
+ - **Wins** — bullets, ≤6 words each. e.g. "Tests hit one interface", "Pricing logic stops leaking", "Delete 4 shallow wrappers".
53
+ - **ADR callout** (if applicable) — one line in an amber-tinted box.
54
+
55
+ No paragraphs of explanation. If the diagram needs a paragraph to be understood, redraw the diagram.
56
+
57
+ ## Diagram patterns
58
+
59
+ Pick the pattern that fits the candidate. Mix them. Don't make every diagram look the same — variety is part of the point.
60
+
61
+ ### Mermaid graph (the workhorse for dependencies / call flow)
62
+
63
+ Use a Mermaid `flowchart` or `graph` when the point is "X calls Y calls Z, and look at the mess." Wrap it in a Tailwind-styled card so it doesn't feel parachuted in. Style with classDef to colour leakage edges red and the deep module dark. Sequence diagrams work well for "before: 6 round-trips; after: 1."
64
+
65
+ ```html
66
+ <div class="rounded-lg border border-slate-200 bg-white p-4">
67
+ <pre class="mermaid">
68
+ flowchart LR
69
+ A[OrderHandler] --> B[OrderValidator]
70
+ B --> C[OrderRepo]
71
+ C -.leak.-> D[PricingClient]
72
+ classDef leak stroke:#dc2626,stroke-width:2px;
73
+ class C,D leak
74
+ </pre>
75
+ </div>
76
+ ```
77
+
78
+ ### Hand-built boxes-and-arrows (when Mermaid's layout fights you)
79
+
80
+ Modules as `<div>`s with borders and labels. Arrows as inline SVG `<line>` or `<path>` elements positioned absolutely over a relative container. Reach for this when you want the "after" diagram to feel like one thick-bordered deep module with greyed-out internals — Mermaid won't render that with the right weight.
81
+
82
+ ### Cross-section (good for layered shallowness)
83
+
84
+ Stack horizontal bands (`h-12 border-l-4`) to show layers a call passes through. Before: 6 thin layers each doing nothing. After: 1 thick band labelled with the consolidated responsibility.
85
+
86
+ ### Mass diagram (good for "interface as wide as implementation")
87
+
88
+ Two rectangles per module — one for interface surface area, one for implementation. Before: interface rectangle is nearly as tall as the implementation rectangle (shallow). After: interface rectangle is short, implementation rectangle is tall (deep).
89
+
90
+ ### Call-graph collapse
91
+
92
+ Before: a tree of function calls rendered as nested boxes. After: the same tree collapsed into one box, with the now-internal calls shown faded inside it.
93
+
94
+ ## Style guidance
95
+
96
+ - Lean editorial, not corporate-dashboard. Generous whitespace. Serif optional for headings (`font-serif` works well with stone/slate).
97
+ - Colour sparingly: one accent (emerald or indigo) plus red for leakage and amber for warnings.
98
+ - Keep diagrams ~320px tall so before/after sits comfortably side by side without scrolling.
99
+ - Use `text-xs uppercase tracking-wider` for module labels inside diagrams — they should read as schematic, not as UI.
100
+ - The only scripts are the Tailwind CDN and the Mermaid ESM import. The report is otherwise static — no app code, no interactivity beyond Mermaid's own rendering.
101
+
102
+ ## Top recommendation section
103
+
104
+ One larger card. Candidate name, one sentence on why, anchor link to its card. That's it.
105
+
106
+ ## Tone
107
+
108
+ Plain English, concise — but the architectural nouns and verbs come straight from the `/codebase-design` skill. Concision is not an excuse to drift.
109
+
110
+ **Use exactly:** module, interface, implementation, depth, deep, shallow, seam, adapter, leverage, locality.
111
+
112
+ **Never substitute:** component, service, unit (for module) · API, signature (for interface) · boundary (for seam) · layer, wrapper (for module, when you mean module).
113
+
114
+ **Phrasings that fit the style:**
115
+
116
+ - "Order intake module is shallow — interface nearly matches the implementation."
117
+ - "Pricing leaks across the seam."
118
+ - "Deepen: one interface, one place to test."
119
+ - "Two adapters justify the seam: HTTP in prod, in-memory in tests."
120
+
121
+ **Wins bullets** name the gain in glossary terms: *"locality: bugs concentrate in one module"*, *"leverage: one interface, N call sites"*, *"interface shrinks; implementation absorbs the wrappers"*. Don't write *"easier to maintain"* or *"cleaner code"* — those terms aren't in the glossary and don't earn their place.
122
+
123
+ No hedging, no throat-clearing, no "it's worth noting that…". If a sentence could be a bullet, make it a bullet. If a bullet could be cut, cut it. If a term isn't in the `/codebase-design` glossary, reach for one that is before inventing a new one.
@@ -0,0 +1,71 @@
1
+ ---
2
+ name: improve-codebase-architecture
3
+ description: Scan a codebase for deepening opportunities, present them as a visual HTML report, then grill through whichever one you pick.
4
+ disable-model-invocation: true
5
+ ---
6
+
7
+ # Improve Codebase Architecture
8
+
9
+ Surface architectural friction and propose **deepening opportunities** — refactors that turn shallow modules into deep ones. The aim is testability and AI-navigability.
10
+
11
+ This command is _informed_ by the project's domain model and built on a shared design vocabulary:
12
+
13
+ - Run the `/codebase-design` skill for the architecture vocabulary (**module**, **interface**, **depth**, **seam**, **adapter**, **leverage**, **locality**) and its principles (the deletion test, "the interface is the test surface", "one adapter = hypothetical seam, two = real"). Use these terms exactly in every suggestion — don't drift into "component," "service," "API," or "boundary."
14
+ - The domain language in `CONTEXT.md` gives names to good seams; ADRs in `docs/adr/` record decisions this command should not re-litigate.
15
+
16
+ ## Process
17
+
18
+ ### 1. Explore
19
+
20
+ **Scope before you scan — YAGNI.** Deepening a module pays off by making future changes to it easier, so put extra weight on the parts of the codebase that have recently changed. Decide *where* to look before you look:
21
+
22
+ - If the user named a direction — a module, a subsystem, a pain point — take it, and skip the inference below.
23
+ - Otherwise, walk back a good stretch of the commit history (`git log --oneline`) to find the codebase's hot spots — the files and areas that keep coming up — and let those paths pull your attention first. If the changes are scattered with no clear hot spot, widen the net.
24
+
25
+ Read the project's domain glossary (`CONTEXT.md`) and any ADRs in the area you're touching first.
26
+
27
+ Then use the Agent tool with `subagent_type=Explore` to walk the codebase. Don't follow rigid heuristics — explore organically and note where you experience friction:
28
+
29
+ - Where does understanding one concept require bouncing between many small modules?
30
+ - Where are modules **shallow** — interface nearly as complex as the implementation?
31
+ - Where have pure functions been extracted just for testability, but the real bugs hide in how they're called (no **locality**)?
32
+ - Where do tightly-coupled modules leak across their seams?
33
+ - Which parts of the codebase are untested, or hard to test through their current interface?
34
+
35
+ Apply the **deletion test** to anything you suspect is shallow: would deleting it concentrate complexity, or just move it? A "yes, concentrates" is the signal you want.
36
+
37
+ ### 2. Present candidates as an HTML report
38
+
39
+ Write a self-contained HTML file to the OS temp directory so nothing lands in the repo. Resolve the temp dir from `$TMPDIR`, falling back to `/tmp` (or `%TEMP%` on Windows), and write to `<tmpdir>/architecture-review-<timestamp>.html` so each run gets a fresh file. Open it for the user — `xdg-open <path>` on Linux, `open <path>` on macOS, `start <path>` on Windows — and tell them the absolute path.
40
+
41
+ The report uses **Tailwind via CDN** for layout and styling, and **Mermaid via CDN** for diagrams where a graph/flow/sequence reliably communicates the structure. Mix Mermaid with hand-crafted CSS/SVG visuals — use Mermaid when relationships are graph-shaped (call graphs, dependencies, sequences), and hand-built divs/SVG when you want something more editorial (mass diagrams, cross-sections, collapse animations). Each candidate gets a **before/after visualisation**. Be visual.
42
+
43
+ For each candidate, render a card with:
44
+
45
+ - **Files** — which files/modules are involved
46
+ - **Problem** — why the current architecture is causing friction
47
+ - **Solution** — plain English description of what would change
48
+ - **Benefits** — explained in terms of locality and leverage, and how tests would improve
49
+ - **Before / After diagram** — side-by-side, custom-drawn, illustrating the shallowness and the deepening
50
+ - **Recommendation strength** — one of `Strong`, `Worth exploring`, `Speculative`, rendered as a badge
51
+
52
+ End the report with a **Top recommendation** section: which candidate you'd tackle first and why.
53
+
54
+ **Use CONTEXT.md vocabulary for the domain, and the `/codebase-design` vocabulary for the architecture.** If `CONTEXT.md` defines "Order," talk about "the Order intake module" — not "the FooBarHandler," and not "the Order service."
55
+
56
+ **ADR conflicts**: if a candidate contradicts an existing ADR, only surface it when the friction is real enough to warrant revisiting the ADR. Mark it clearly in the card (e.g. a warning callout: _"contradicts ADR-0007 — but worth reopening because…"_). Don't list every theoretical refactor an ADR forbids.
57
+
58
+ See [HTML-REPORT.md](HTML-REPORT.md) for the full HTML scaffold, diagram patterns, and styling guidance.
59
+
60
+ Do NOT propose interfaces yet. After the file is written, ask the user: "Which of these would you like to explore?"
61
+
62
+ ### 3. Grilling loop
63
+
64
+ Once the user picks a candidate, run the `/grilling` skill to walk the decision tree with them — constraints, dependencies, the shape of the deepened module, what sits behind the seam, what tests survive.
65
+
66
+ Side effects happen inline as decisions crystallize — run the `/domain-modeling` skill to keep the domain model current as you go:
67
+
68
+ - **Naming a deepened module after a concept not in `CONTEXT.md`?** Add the term to `CONTEXT.md`. Create the file lazily if it doesn't exist.
69
+ - **Sharpening a fuzzy term during the conversation?** Update `CONTEXT.md` right there.
70
+ - **User rejects the candidate with a load-bearing reason?** Offer an ADR, framed as: _"Want me to record this as an ADR so future architecture reviews don't re-suggest it?"_ Only offer when the reason would actually be needed by a future explorer to avoid re-suggesting the same thing — skip ephemeral reasons ("not worth it right now") and self-evident ones.
71
+ - **Want to explore alternative interfaces for the deepened module?** Run the `/codebase-design` skill and use its design-it-twice parallel sub-agent pattern.
@@ -0,0 +1,5 @@
1
+ interface:
2
+ display_name: "Improve Codebase Architecture"
3
+ short_description: "Find and grill architecture improvements"
4
+ policy:
5
+ allow_implicit_invocation: false
@@ -0,0 +1,79 @@
1
+ # Logic Prototype
2
+
3
+ A tiny interactive terminal app that lets the user drive a state model by hand. Use this when the question is about **business logic, state transitions, or data shape** — the kind of thing that looks reasonable on paper but only feels wrong once you push it through real cases.
4
+
5
+ ## When this is the right shape
6
+
7
+ - "I'm not sure if this state machine handles the edge case where X then Y."
8
+ - "Does this data model actually let me represent the case where..."
9
+ - "I want to feel out what the API should look like before writing it."
10
+ - Anything where the user wants to **press buttons and watch state change**.
11
+
12
+ If the question is "what should this look like" — wrong branch. Use [UI.md](UI.md).
13
+
14
+ ## Process
15
+
16
+ ### 1. State the question
17
+
18
+ Before writing code, write down what state model and what question you're prototyping. One paragraph, in the prototype's README or a comment at the top of the file. A logic prototype that answers the wrong question is pure waste — make the question explicit so it can be checked later, whether the user is watching now or returning to it AFK.
19
+
20
+ ### 2. Pick the language
21
+
22
+ Use whatever the host project uses. If the project has no obvious runtime (e.g. a docs repo), ask.
23
+
24
+ Match the project's existing conventions for tooling — don't add a new package manager or runtime just for the prototype.
25
+
26
+ ### 3. Isolate the logic in a portable module
27
+
28
+ Put the actual logic — the bit that's answering the question — behind a small, pure interface that could be lifted out and dropped into the real codebase later. The TUI around it is throwaway; the logic module shouldn't be.
29
+
30
+ The right shape depends on the question:
31
+
32
+ - **A pure reducer** — `(state, action) => state`. Good when actions are discrete events and state is a single value.
33
+ - **A state machine** — explicit states and transitions. Good when "which actions are even legal right now" is part of the question.
34
+ - **A small set of pure functions** over a plain data type. Good when there's no implicit current state — just transformations.
35
+ - **A class or module with a clear method surface** when the logic genuinely owns ongoing internal state.
36
+
37
+ Pick whichever shape best fits the question being asked, *not* whichever is easiest to wire to a TUI. Keep it pure: no I/O, no terminal code, no `console.log` for control flow. The TUI imports it and calls into it; nothing flows the other direction.
38
+
39
+ This is what makes the prototype useful past its own lifetime: when the question's been answered, the validated reducer / machine / function set can be lifted into the real module on its own.
40
+
41
+ ### 4. Build the smallest TUI that exposes the state
42
+
43
+ Build it as a **lightweight TUI** — on every tick, clear the screen (`console.clear()` / `print("\033[2J\033[H")` / equivalent) and re-render the whole frame. The user should always see one stable view, not an ever-growing scrollback.
44
+
45
+ Each frame has two parts, in this order:
46
+
47
+ 1. **Current state**, pretty-printed and diff-friendly (one field per line, or formatted JSON). Use **bold** for field names or section headers and **dim** for less important context (timestamps, IDs, derived values). Native ANSI escape codes are fine — `\x1b[1m` bold, `\x1b[2m` dim, `\x1b[0m` reset. No need to pull in a styling library unless one is already in the project.
48
+ 2. **Keyboard shortcuts**, listed at the bottom: `[a] add user [d] delete user [t] tick clock [q] quit`. Bold the key, dim the description, or vice-versa — whatever reads cleanly.
49
+
50
+ Behaviour:
51
+
52
+ 1. **Initialise state** — a single in-memory object/struct. Render the first frame on start.
53
+ 2. **Read one keystroke (or one line)** at a time, dispatch to a handler that mutates state.
54
+ 3. **Re-render** the full frame after every action — don't append, replace.
55
+ 4. **Loop until quit.**
56
+
57
+ The whole frame should fit on one screen.
58
+
59
+ ### 5. Make it runnable in one command
60
+
61
+ Add a script to the project's existing task runner (`package.json` scripts, `Makefile`, `justfile`, `pyproject.toml`). The user should run `pnpm run <prototype-name>` or equivalent — never need to remember a path.
62
+
63
+ If the host project has no task runner, just put the command at the top of the prototype's README.
64
+
65
+ ### 6. Hand it over
66
+
67
+ Give the user the run command. They'll drive it themselves; the interesting moments are when they say "wait, that shouldn't be possible" or "huh, I assumed X would be different" — those are the bugs in the _idea_, which is the whole point. If they want new actions added, add them. Prototypes evolve.
68
+
69
+ ### 7. Capture the answer and the prototype
70
+
71
+ Once the prototype has answered its question, capture the answer, then capture the prototype the way the [SKILL](SKILL.md) describes. The logic-specific mapping: the validated reducer / machine / function set lifts into the real module (the decision, absorbed); the TUI shell rides along to the throwaway branch that keeps the prototype as a primary source.
72
+
73
+ ## Anti-patterns
74
+
75
+ - **Don't add tests.** A prototype that needs tests is no longer a prototype.
76
+ - **Don't wire it to the real database.** Use an in-memory store unless the question is specifically about persistence.
77
+ - **Don't generalise.** No "what if we wanted to support X later." The prototype answers one question.
78
+ - **Don't blur the logic and the TUI together.** If the reducer / state machine references `console.log`, prompts, or terminal escape codes, it's no longer portable. Keep the TUI as a thin shell over a pure module.
79
+ - **Don't ship the TUI shell into production.** The shell is optimised for being driven by hand from a terminal. The logic module behind it is the bit worth keeping.
@@ -0,0 +1,26 @@
1
+ ---
2
+ name: prototype
3
+ description: Build a throwaway prototype to answer a design question. Use when the user wants to sanity-check whether a state model or logic feels right, or explore what a UI should look like.
4
+ ---
5
+
6
+ # Prototype
7
+
8
+ A prototype is **throwaway code that answers a question**. The question decides the shape.
9
+
10
+ ## Pick a branch
11
+
12
+ Identify which question is being answered — from the user's prompt, the surrounding code, or by asking if the user is around:
13
+
14
+ - **"Does this logic / state model feel right?"** → [LOGIC.md](LOGIC.md). Build a tiny interactive terminal app that pushes the state machine through cases that are hard to reason about on paper.
15
+ - **"What should this look like?"** → [UI.md](UI.md). Generate several radically different UI variations on a single route, switchable via a URL search param and a floating bottom bar.
16
+
17
+ The two branches produce very different artifacts — getting this wrong wastes the whole prototype. If the question is genuinely ambiguous and the user isn't reachable, default to whichever branch better matches the surrounding code (a backend module → logic; a page or component → UI) and state the assumption at the top of the prototype.
18
+
19
+ ## Rules that apply to both
20
+
21
+ 1. **Throwaway from day one, and clearly marked as such.** Locate the prototype code close to where it will actually be used (next to the module or page it's prototyping for) so context is obvious — but name it so a casual reader can see it's a prototype, not production. For throwaway UI routes, obey whatever routing convention the project already uses; don't invent a new top-level structure.
22
+ 2. **One command to run.** Whatever the project's existing task runner supports — `pnpm <name>`, `python <path>`, `bun <path>`, etc. The user must be able to start it without thinking.
23
+ 3. **No persistence by default.** State lives in memory. Persistence is the thing the prototype is _checking_, not something it should depend on. If the question explicitly involves a database, hit a scratch DB or a local file with a clear "PROTOTYPE — wipe me" name.
24
+ 4. **Skip the polish.** No tests, no error handling beyond what makes the prototype _runnable_, no abstractions. The point is to learn something fast.
25
+ 5. **Surface the state.** After every action (logic) or on every variant switch (UI), print or render the full relevant state so the user can see what changed.
26
+ 6. **Capture it when done.** Fold any validated decision into the real code, then capture the prototype itself as a **primary source**: commit it to a throwaway branch, out of main, and leave a context pointer to that branch on the implementation issue. Capture the answer too — the verdict and the question it settled — in the issue or a commit. The main branch keeps only the validated decision.
@@ -0,0 +1,112 @@
1
+ # UI Prototype
2
+
3
+ Generate **several radically different UI variations** on a single route, switchable from a floating bottom bar. The user flips between variants in the browser, picks one (or steals bits from each), then throws the rest away.
4
+
5
+ If the question is about logic/state rather than what something looks like — wrong branch. Use [LOGIC.md](LOGIC.md).
6
+
7
+ ## When this is the right shape
8
+
9
+ - "What should this page look like?"
10
+ - "I want to see a few options for this dashboard before committing."
11
+ - "Try a different layout for the settings screen."
12
+ - Any time the user would otherwise spend a day picking between three vague mockups in their head.
13
+
14
+ ## Two sub-shapes — strongly prefer sub-shape A
15
+
16
+ A UI prototype is much easier to judge when it's **butting up against the rest of the app** — real header, real sidebar, real data, real density. A throwaway route on its own is a vacuum: every variant looks fine in isolation. Default to sub-shape A whenever there's a plausible existing page to host the variants. Only reach for sub-shape B if the prototype genuinely has no nearby home.
17
+
18
+ ### Sub-shape A — adjustment to an existing page (preferred)
19
+
20
+ The route already exists. Variants are rendered **on the same route**, gated by a `?variant=` URL search param. The existing data fetching, params, and auth all stay — only the rendering swaps. This is the default; pick it unless there's a specific reason not to.
21
+
22
+ If the prototype is for something that doesn't yet have a page but *would naturally live inside one* (a new section of the dashboard, a new card on the settings screen, a new step in an existing flow) — that's still sub-shape A. Mount the variants inside the host page.
23
+
24
+ ### Sub-shape B — a new page (last resort)
25
+
26
+ Only use this when the thing being prototyped genuinely has no existing page to live inside — e.g. an entirely new top-level surface, or a flow that can't be embedded anywhere sensible.
27
+
28
+ Create a **throwaway route** following whatever routing convention the project already uses — don't invent a new top-level structure. Name it so it's obviously a prototype (e.g. include the word `prototype` in the path or filename). Same `?variant=` pattern.
29
+
30
+ Before committing to sub-shape B, sanity-check: is there really no existing page this could be embedded in? An empty route hides design problems that a populated one would expose.
31
+
32
+ In both sub-shapes the floating bottom bar is identical.
33
+
34
+ ## Process
35
+
36
+ ### 1. State the question and pick N
37
+
38
+ Default to **3 variants**. More than 5 stops being radically different and starts being noise — cap there.
39
+
40
+ Write down the plan in one line, in the prototype's location or a top-of-file comment:
41
+
42
+ > "Three variants of the settings page, switchable via `?variant=`, on the existing `/settings` route."
43
+
44
+ This works whether the user is here to push back or not.
45
+
46
+ ### 2. Generate radically different variants
47
+
48
+ Draft each variant. Hold each one to:
49
+
50
+ - The page's purpose and the data it has access to.
51
+ - The project's component library / styling system (TailwindCSS, shadcn, MUI, plain CSS, whatever).
52
+ - A clear exported component name, e.g. `VariantA`, `VariantB`, `VariantC`.
53
+
54
+ Variants must be **structurally different** — different layout, different information hierarchy, different primary affordance, not just different colours. Three slightly-tweaked card grids isn't a UI prototype, it's wallpaper. If two drafts come out too similar, redo one with explicit "do not use a card grid" guidance.
55
+
56
+ ### 3. Wire them together
57
+
58
+ Create a single switcher component on the route:
59
+
60
+ ```tsx
61
+ // pseudo-code — adapt to the project's framework
62
+ const variant = searchParams.get('variant') ?? 'A';
63
+ return (
64
+ <>
65
+ {variant === 'A' && <VariantA {...data} />}
66
+ {variant === 'B' && <VariantB {...data} />}
67
+ {variant === 'C' && <VariantC {...data} />}
68
+ <PrototypeSwitcher variants={['A','B','C']} current={variant} />
69
+ </>
70
+ );
71
+ ```
72
+
73
+ For sub-shape A (existing page): keep all the existing data fetching above the switcher; only the rendered subtree changes per variant.
74
+
75
+ For sub-shape B (new page): the throwaway route under `/prototype/<name>` mounts the same switcher.
76
+
77
+ ### 4. Build the floating switcher
78
+
79
+ A small fixed-position bar at the bottom-centre of the screen with three pieces:
80
+
81
+ - **Left arrow** — cycles to the previous variant (wraps around).
82
+ - **Variant label** — shows the current variant key and, if the variant exports a name, that name too. e.g. `B — Sidebar layout`.
83
+ - **Right arrow** — cycles forward (wraps around).
84
+
85
+ Behaviour:
86
+
87
+ - Clicking an arrow updates the URL search param (use the framework's router — `router.replace` on Next, `navigate` on React Router, etc) so the variant is shareable and reload-stable.
88
+ - Keyboard: `←` and `→` arrow keys also cycle. Don't intercept arrow keys when an `<input>`, `<textarea>`, or `[contenteditable]` is focused.
89
+ - Visually distinct from the page (e.g. high-contrast pill, subtle shadow) so it's obviously not part of the design being evaluated.
90
+ - Hidden in production builds — gate on `process.env.NODE_ENV !== 'production'` or an equivalent check, so a stray prototype merge can't ship the bar to users.
91
+
92
+ Put the switcher in a single shared component so both sub-shapes can reuse it. Locate it wherever shared UI lives in the project.
93
+
94
+ ### 5. Hand it over
95
+
96
+ Surface the URL (and the `?variant=` keys). The user will flip through whenever they get to it. The interesting feedback is usually **"I want the header from B with the sidebar from C"** — that's the actual design they want.
97
+
98
+ ### 6. Capture the answer and clean up
99
+
100
+ Once a variant has won, capture the answer — which variant and why — then capture the prototype the way the [SKILL](SKILL.md) describes. Fold the winner into the real code and move the rest onto the throwaway branch, not into main:
101
+
102
+ - **Sub-shape A** — fold the winner into the existing page; drop the losing variants and the switcher from main.
103
+ - **Sub-shape B** — promote the winning variant to a real route; drop the throwaway route and the switcher from main.
104
+
105
+ The full set of variants is the primary source, so it lands on the throwaway branch, not the bin — variant components and the switcher left in the main branch rot fast and confuse the next reader.
106
+
107
+ ## Anti-patterns
108
+
109
+ - **Variants that differ only in colour or copy.** That's a tweak, not a prototype. Real variants disagree about structure.
110
+ - **Sharing too much code between variants.** A shared `<Header>` is fine; a shared `<Layout>` defeats the point. Each variant should be free to throw out the layout.
111
+ - **Wiring variants to real mutations.** Read-only prototypes are fine. If a variant needs to mutate, point it at a stub — the question is "what should this look like", not "does the backend work".
112
+ - **Promoting the prototype directly to production.** The variant code was written under prototype constraints (no tests, minimal error handling). Rewrite it properly when you fold it in.
@@ -0,0 +1,3 @@
1
+ interface:
2
+ display_name: "Prototype"
3
+ short_description: "Prototype to answer a design question"
@@ -0,0 +1,12 @@
1
+ ---
2
+ name: research
3
+ description: Investigate a question against high-trust primary sources and capture the findings as a Markdown file in the repo. Use when the user wants a topic researched, docs or API facts gathered, or reading legwork delegated to a background agent.
4
+ ---
5
+
6
+ Spin up a **background agent** to do the research, so you keep working while it reads.
7
+
8
+ Its job:
9
+
10
+ 1. Investigate the question against **primary sources** — official docs, source code, specs, first-party APIs — not a secondary write-up of them. Follow every claim back to the source that owns it.
11
+ 2. Write the findings to a single Markdown file, citing each claim's source.
12
+ 3. Save it where the repo already keeps such notes; match the existing convention, and if there is none, put it somewhere sensible and say where.
@@ -0,0 +1,3 @@
1
+ interface:
2
+ display_name: "Research"
3
+ short_description: "Research from high-trust sources"
@@ -0,0 +1,14 @@
1
+ ---
2
+ name: resolving-merge-conflicts
3
+ description: "Use when you need to resolve an in-progress git merge/rebase conflict."
4
+ ---
5
+
6
+ 1. **See the current state** of the merge/rebase. Check git history, and the conflicting files.
7
+
8
+ 2. **Find the primary sources** for each conflict. Understand deeply why each change was made, and what the original intent was. Read the commit messages, check the PRs, check original issues/tickets.
9
+
10
+ 3. **Resolve each hunk.** Preserve both intents where possible. Where incompatible, pick the one matching the merge's stated goal and note the trade-off. Do **not** invent new behaviour. Always resolve; never `--abort`.
11
+
12
+ 4. Discover the project's **automated checks** and run them — typically typecheck, then tests, then format. Fix anything the merge broke.
13
+
14
+ 5. **Finish the merge/rebase.** Stage everything and commit. If rebasing, continue the rebase process until all commits are rebased.
@@ -0,0 +1,3 @@
1
+ interface:
2
+ display_name: "Resolving Merge Conflicts"
3
+ short_description: "Resolve merge and rebase conflicts"
@@ -0,0 +1,116 @@
1
+ ---
2
+ name: setup-matt-pocock-skills
3
+ description: Configure this repo for the engineering skills — set up its issue tracker, triage label vocabulary, and domain doc layout. Run once before first use of the other engineering skills.
4
+ disable-model-invocation: true
5
+ ---
6
+
7
+ # Setup Matt Pocock's Skills
8
+
9
+ Scaffold the per-repo configuration that the engineering skills assume:
10
+
11
+ - **Issue tracker** — where issues live (GitHub by default; local markdown is also supported out of the box)
12
+ - **Triage labels** — the strings used for the five canonical triage roles
13
+ - **Domain docs** — where `CONTEXT.md` and ADRs live, and the consumer rules for reading them
14
+
15
+ This is a prompt-driven skill, not a deterministic script. Explore, present what you found, confirm with the user, then write.
16
+
17
+ ## Process
18
+
19
+ ### 1. Explore
20
+
21
+ Look at the current repo to understand its starting state. Read whatever exists; don't assume:
22
+
23
+ - `git remote -v` and `.git/config` — is this a GitHub repo? Which one?
24
+ - `AGENTS.md` and `CLAUDE.md` at the repo root — does either exist? Is there already an `## Agent skills` section in either?
25
+ - `CONTEXT.md` and `CONTEXT-MAP.md` at the repo root
26
+ - `docs/adr/` and any `src/*/docs/adr/` directories
27
+ - `docs/agents/` — does this skill's prior output already exist?
28
+ - `.scratch/` — sign that a local-markdown issue tracker convention is already in use
29
+ - Is the `triage` skill installed? (a `triage` skill folder alongside this one, or `triage` in your available skills.) This decides whether Section B runs at all.
30
+ - Monorepo signals — a `pnpm-workspace.yaml`, a `workspaces` field in `package.json`, or a populated `packages/*` with its own `src/`. Present only in a genuinely large multi-package repo; their absence means single-context, which is almost every repo.
31
+
32
+ ### 2. Present findings and ask
33
+
34
+ Summarise what's present and what's missing. Then take the sections in order — one section, one answer, then the next.
35
+
36
+ Lead each section with the recommended answer so the user can accept it in a word. Give a one-line explainer only when the choice genuinely branches; skip the section entirely when exploration already settled it (Section B when `triage` isn't installed, Section C when there's no monorepo).
37
+
38
+ **Section A — Issue tracker.**
39
+
40
+ > Explainer: The "issue tracker" is where issues live for this repo. Skills like `to-tickets`, `triage`, `to-spec`, and `qa` read from and write to it — they need to know whether to call `gh issue create`, write a markdown file under `.scratch/`, or follow some other workflow you describe. Pick the place you actually track work for this repo.
41
+
42
+ Default posture: these skills were designed for GitHub. If a `git remote` points at GitHub, propose that. If a `git remote` points at GitLab (`gitlab.com` or a self-hosted host), propose GitLab. Otherwise (or if the user prefers), offer:
43
+
44
+ - **GitHub** — issues live in the repo's GitHub Issues (uses the `gh` CLI)
45
+ - **GitLab** — issues live in the repo's GitLab Issues (uses the [`glab`](https://gitlab.com/gitlab-org/cli) CLI)
46
+ - **Local markdown** — issues live as files under `.scratch/<feature>/` in this repo (good for solo projects or repos without a remote)
47
+ - **Other** (Jira, Linear, etc.) — ask the user to describe the workflow in one paragraph; the skill will record it as freeform prose
48
+
49
+ Record the choice in `docs/agents/issue-tracker.md`. The GitHub and GitLab templates carry a "PRs as a request surface" flag, defaulted **off** — leave it off and don't raise it; a user who wants external PRs in the triage queue can flip the flag in the file later.
50
+
51
+ **Section B — Triage label vocabulary.** Skip this section entirely if the `triage` skill isn't installed (exploration told you) — an uninstalled skill needs no labels.
52
+
53
+ If it is installed, ask exactly one question:
54
+
55
+ > Do you want to keep the default triage labels? (recommended: **yes**)
56
+
57
+ The defaults are the five canonical roles, each label string equal to its name: `needs-triage`, `needs-info`, `ready-for-agent`, `ready-for-human`, `wontfix`. On **yes**, write them as-is. Only if the user says no — usually because their tracker already uses other names (e.g. `bug:triage` for `needs-triage`) — collect the overrides so `triage` applies existing labels instead of creating duplicates.
58
+
59
+ **Section C — Domain docs.** Default to **single-context** — one `CONTEXT.md` + `docs/adr/` at the repo root. This fits almost every repo; write it without asking.
60
+
61
+ Offer **multi-context** — a root `CONTEXT-MAP.md` pointing to per-context `CONTEXT.md` files — only when exploration found monorepo signals. Then confirm which layout they want.
62
+
63
+ ### 3. Confirm and edit
64
+
65
+ Show the user a draft of:
66
+
67
+ - The `## Agent skills` block to add to whichever of `CLAUDE.md` / `AGENTS.md` is being edited (see step 4 for selection rules)
68
+ - The contents of `docs/agents/issue-tracker.md`, `docs/agents/domain.md`, and `docs/agents/triage-labels.md` (the last only when `triage` is installed)
69
+
70
+ Let them edit before writing.
71
+
72
+ ### 4. Write
73
+
74
+ **Pick the file to edit:**
75
+
76
+ - If `CLAUDE.md` exists, edit it.
77
+ - Else if `AGENTS.md` exists, edit it.
78
+ - If neither exists, ask the user which one to create — don't pick for them.
79
+
80
+ Never create `AGENTS.md` when `CLAUDE.md` already exists (or vice versa) — always edit the one that's already there.
81
+
82
+ If an `## Agent skills` block already exists in the chosen file, update its contents in-place rather than appending a duplicate. Don't overwrite user edits to the surrounding sections.
83
+
84
+ The block:
85
+
86
+ ```markdown
87
+ ## Agent skills
88
+
89
+ ### Issue tracker
90
+
91
+ [one-line summary of where issues are tracked]. See `docs/agents/issue-tracker.md`.
92
+
93
+ ### Triage labels
94
+
95
+ [one-line summary of the label vocabulary]. See `docs/agents/triage-labels.md`.
96
+
97
+ ### Domain docs
98
+
99
+ [one-line summary of layout — "single-context" or "multi-context"]. See `docs/agents/domain.md`.
100
+ ```
101
+
102
+ Include the `### Triage labels` sub-block, and write `docs/agents/triage-labels.md`, only when `triage` is installed and Section B ran. When it isn't, both are omitted.
103
+
104
+ Then write the docs files using the seed templates in this skill folder as a starting point:
105
+
106
+ - [issue-tracker-github.md](./issue-tracker-github.md) — GitHub issue tracker
107
+ - [issue-tracker-gitlab.md](./issue-tracker-gitlab.md) — GitLab issue tracker
108
+ - [issue-tracker-local.md](./issue-tracker-local.md) — local-markdown issue tracker
109
+ - [triage-labels.md](./triage-labels.md) — label mapping (only if `triage` is installed)
110
+ - [domain.md](./domain.md) — domain doc consumer rules + layout
111
+
112
+ For "other" issue trackers, write `docs/agents/issue-tracker.md` from scratch using the user's description.
113
+
114
+ ### 5. Done
115
+
116
+ Tell the user the setup is complete and which engineering skills will now read from these files. Mention they can edit `docs/agents/*.md` directly later — re-running this skill is only necessary if they want to switch issue trackers or restart from scratch.
@@ -0,0 +1,5 @@
1
+ interface:
2
+ display_name: "Setup Matt Pocock Skills"
3
+ short_description: "Configure a repo for the skills"
4
+ policy:
5
+ allow_implicit_invocation: false