mirror of
https://github.com/bitsocialnet/5chan.git
synced 2026-08-03 07:41:04 +02:00
docs(agent playbooks): fix stale CI references and index committed skills
Corrects the react-doctor PR-check command and workflow filename, marks the superseded hooks-tarball surprises now that bitsocial-react-hooks comes from npm, rewrites hooks-setup.md around the real per-harness entry points and drops its drifted inline script copies, points the Task Router translations row at the translate skill, and adds a committed skills/subagents index so agents can discover the tooling that already exists.
This commit is contained in:
@@ -55,7 +55,7 @@ When CodeGraph MCP tools are available and `.codegraph/` exists, prefer them for
|
||||
| React UI logic changed (`src/components`, `src/views`, `src/hooks`, UI stores) | Follow React architecture rules below, review the diff with `vercel-react-best-practices` and `vercel:react-best-practices` when available, fix valid findings, then run `yarn doctor` |
|
||||
| `package.json` changed | Run `corepack yarn install` to keep `yarn.lock` in sync |
|
||||
| Dependencies or import graph changed | Run `yarn knip` as an advisory manifest/import audit |
|
||||
| Translation key/value changed | Use `docs/agent-playbooks/translations.md` |
|
||||
| Translation key/value changed | Use the `translate` skill (spawns parallel `translator` subagents); for manual script operations see `docs/agent-playbooks/translations.md` |
|
||||
| Public-facing English content or AI context changed (`README.md`, `index.html`, `AGENTS.md`, `PRODUCT.md`, `DESIGN.md`, docs pages, or `scripts/generate-llms-files.mjs`) | Run `yarn llms:generate`; inspect and commit any resulting changes to `public/llms*.txt` so LLM indexes stay current |
|
||||
| Bug report in a specific file/line | Start with git history scan from `docs/agent-playbooks/bug-investigation.md` before editing |
|
||||
| `CHANGELOG.md` or package version changed | Run `yarn blotter:check`; if needed add a concise release one-liner |
|
||||
@@ -156,7 +156,7 @@ src/
|
||||
- After adding or changing tests, run `yarn test`.
|
||||
- Do not commit or force-add local rebuild output. `build/` is the main generated build output in this repo; remove or restore generated output directories after local verification before committing.
|
||||
- After React UI logic changes, run: `yarn doctor`.
|
||||
- Treat React Doctor output as guidance for *newly introduced* issues (the CI `yarn doctor --diff` PR check flags those), not as an aggregate score to grind up: many `error`-level diagnostics flag intentional patterns or current React-Compiler limitations, not bugs. See `docs/agent-playbooks/known-surprises.md`.
|
||||
- Treat React Doctor output as guidance for *newly introduced* issues (the CI PR check in `.github/workflows/react-doctor.yml` runs `yarn doctor --scope changed --base <base branch>` to flag those), not as an aggregate score to grind up: many `error`-level diagnostics flag intentional patterns or current React-Compiler limitations, not bugs. See `docs/agent-playbooks/known-surprises.md`.
|
||||
- For UI/visual changes, verify with `playwright-cli` across Chrome/Blink, Firefox/Gecko, and WebKit/Safari.
|
||||
- Cover desktop and a mobile viewport flow in each browser engine when the change affects layout, touch behavior, or responsiveness.
|
||||
- When loading, navigation, or interaction speed matters (or you cannot tell whether perf is real or just a fast dev machine), run a low-spec pass: `./scripts/pw-throttle.sh <session> mid` (or `low`) applies CPU + network throttling to a Chromium `playwright-cli` session before you measure. Throttling is Chromium-only; keep the Firefox/WebKit checks unthrottled. See `docs/agent-playbooks/low-spec-verification.md`.
|
||||
@@ -182,9 +182,9 @@ src/
|
||||
- Keep shared behavior equivalent while preserving harness-specific models, config formats, hook entry points, and tool invocation syntax.
|
||||
- Do not configure `.claude` agents to use `composer-2`; that model is Cursor-only in this repo. Keep `.claude` agent models on Claude-supported options.
|
||||
- Do not configure `.codex/agents/*.toml` with `gpt-5.3-codex` or `gpt-5.3-codex-spark`; standardize Codex agents on `gpt-5.4` unless the user explicitly requests a different model.
|
||||
- When changing shared agent behavior, update the relevant files in `.codex/skills/`, `.cursor/skills/`, `.claude/skills/`, `.codex/agents/`, `.cursor/agents/`, `.claude/agents/`, `.codex/hooks/`, `.cursor/hooks/`, `.claude/hooks/`, and their `hooks.json` or config entry points as needed.
|
||||
- When changing shared agent behavior, update the relevant files in `.codex/skills/`, `.cursor/skills/`, `.claude/skills/`, `.codex/agents/`, `.cursor/agents/`, `.claude/agents/`, `.codex/hooks/`, `.cursor/hooks/`, `.claude/hooks/`, and the hook entry points as needed. Hook entry points are harness-specific: the `hooks` key in `.claude/settings.json` (Claude Code does not read a standalone hooks.json), `.cursor/hooks.json` (Cursor schema), and `.codex/hooks.json` (Codex schema, intentionally Claude-compatible).
|
||||
- If `AGENTS.md` references a skill, agent, or hook, prefer a tracked file under `.codex/`, `.cursor/`, or `.claude/` rather than an untracked local-only instruction.
|
||||
- Review `.codex/config.toml`, `.cursor/hooks.json`, and `.claude/hooks.json` before changing agent orchestration or hook behavior, because they are the entry points contributors will actually load.
|
||||
- Review `.codex/config.toml`, `.codex/hooks.json`, `.cursor/hooks.json`, and `.claude/settings.json` before changing agent orchestration or hook behavior, because they are the entry points contributors will actually load.
|
||||
- Before finishing any React UI logic change under `src/components`, `src/views`, `src/hooks`, or UI stores, review the changed diff with `vercel-react-best-practices` and, in Codex/Vercel-plugin sessions, `vercel:react-best-practices`. Fix valid findings before final verification; do not limit this review to diffs that add new hooks or memoization.
|
||||
- When a diff adds new `useEffect`, `useLayoutEffect`, `useInsertionEffect`, `useMemo`, `useCallback`, or `memo(...)` usage under `src/`, treat the repo hook reminder as mandatory and also reconsider the change with `you-might-not-need-an-effect` before finishing.
|
||||
- Directory-specific auto-loaded rules live under `src/AGENTS.md` and `scripts/AGENTS.md`; read them before editing files in those trees.
|
||||
@@ -256,7 +256,7 @@ Use these only when relevant to the active task:
|
||||
- Long-running agent workflow: `docs/agent-playbooks/long-running-agent-workflow.md`
|
||||
- Translations workflow: `docs/agent-playbooks/translations.md`
|
||||
- Commit/issue output format: `docs/agent-playbooks/commit-issue-format.md`
|
||||
- Skills/tools setup and MCP rationale: `docs/agent-playbooks/skills-and-tools.md`
|
||||
- Skills/tools setup, MCP rationale, and the index of all committed skills/subagents: `docs/agent-playbooks/skills-and-tools.md`
|
||||
- Bug investigation workflow: `docs/agent-playbooks/bug-investigation.md`
|
||||
- Known surprises log: `docs/agent-playbooks/known-surprises.md`
|
||||
- Low-spec device verification (CPU/network throttling): `docs/agent-playbooks/low-spec-verification.md`
|
||||
|
||||
@@ -2,15 +2,17 @@
|
||||
|
||||
Use this when proposing or implementing meaningful code changes.
|
||||
|
||||
The committed `commit-format` and `issue-format` skills are the canonical, stricter templates (with self-checks); prefer them when the harness loads skills. This playbook is the short fallback summary — keep the two in sync.
|
||||
|
||||
## Commit Suggestion Format
|
||||
|
||||
- **Title:** Conventional Commits style, short, wrapped in backticks.
|
||||
- **Title:** Conventional Commits style with a required scope (`type(scope): description`), short, wrapped in backticks. The scope is a short human-readable area name, matching how this repo commits (see the `commit` skill).
|
||||
- Use `perf` (not `fix`) for performance optimizations.
|
||||
- **Description:** Optional 2-3 informal sentences describing the solution. Concise, technical, no bullet points.
|
||||
|
||||
Example:
|
||||
|
||||
> **Commit title:** `fix: correct date formatting in timezone conversion`
|
||||
> **Commit title:** `fix(timestamps): correct date formatting in timezone conversion`
|
||||
>
|
||||
> Updated `formatDate()` in `date-utils.ts` to properly handle timezone offsets.
|
||||
|
||||
|
||||
@@ -1,89 +1,39 @@
|
||||
# Agent Hooks Setup
|
||||
|
||||
If your AI coding assistant supports lifecycle hooks, configure these for this repo.
|
||||
This repo ships lifecycle hooks shared across Claude Code, Cursor, and Codex. The implementations live in `scripts/agent-hooks/`; each harness has thin wrappers in `.claude/hooks/`, `.cursor/hooks/`, `.codex/hooks/` plus its own entry-point config. Run `yarn ai-workflow:check` after changing any of this.
|
||||
|
||||
## Recommended Hooks
|
||||
## Hooks
|
||||
|
||||
| Hook | Command | Purpose |
|
||||
| Edit-time / stop | Script | Purpose |
|
||||
|---|---|---|
|
||||
| `afterFileEdit` | `scripts/agent-hooks/format.sh` | Auto-format files after AI edits |
|
||||
| `afterFileEdit` | `scripts/agent-hooks/yarn-install.sh` | Run `corepack yarn install` when `package.json` changes |
|
||||
| `afterFileEdit` | `scripts/agent-hooks/react-pattern-review.sh` | When React UI source changes, remind the agent to run the React best-practice review skills; also flag new `useEffect`/memo primitives |
|
||||
| `stop` | `scripts/agent-hooks/sync-git-branches.sh` | Prune stale refs and delete integrated temporary task branches |
|
||||
| `stop` | `scripts/agent-hooks/react-pattern-review.sh` | Re-scan the current diff for React UI source changes and new React effects/memos before the final verify gate |
|
||||
| `stop` | `scripts/agent-hooks/verify.sh` | Hard-gate build, lint, and type-check; keep `yarn audit` informational |
|
||||
| edit-time | `scripts/agent-hooks/format.sh` | Auto-format JS/TS files after AI edits (`npx oxfmt`) |
|
||||
| edit-time | `scripts/agent-hooks/yarn-install.sh` | Run `corepack yarn install` when the root `package.json` changes |
|
||||
| edit-time + stop | `scripts/agent-hooks/react-pattern-review.sh` | When React UI source changes, remind the agent to run the React best-practice review skills; also flag new `useEffect`/memo primitives |
|
||||
| stop | `scripts/agent-hooks/sync-git-branches.sh` | Prune stale refs and delete integrated temporary task branches |
|
||||
| stop | `scripts/agent-hooks/code-quality-review-reminder.sh` | Remind the agent to run the advisory `code-quality-review` skill when the diff is non-trivial |
|
||||
| stop | `scripts/agent-hooks/verify.sh` | Gate build, lint, and type-check; keep `yarn npm audit` informational |
|
||||
| session start (Claude only) | `.claude/hooks/session-start.sh` | `corepack yarn install` when `node_modules` is missing (fresh worktrees) |
|
||||
|
||||
## Why
|
||||
## Entry points (harness-specific formats)
|
||||
|
||||
- Consistent formatting
|
||||
- Lockfile stays in sync
|
||||
- React UI source changes get an explicit best-practices review reminder before the agent finishes
|
||||
- New `useEffect`/memo additions get an additional effect-specific second look before the agent finishes
|
||||
- Build/lint/type issues caught early
|
||||
- Security visibility via `corepack yarn npm audit`
|
||||
- One shared hook implementation for Codex, Cursor, and Claude
|
||||
- Temporary task branches stay aligned with the repo's worktree workflow
|
||||
The three harnesses wire the same scripts but use different config files and schemas. Do not copy one harness's schema to another.
|
||||
|
||||
## Example Hook Scripts
|
||||
| Harness | Entry point | Schema | Edit event | Stop event |
|
||||
|---|---|---|---|---|
|
||||
| Claude Code | `hooks` key in `.claude/settings.json` | Claude hooks schema; a standalone `.claude/hooks.json` is **not** read | `PostToolUse` matcher `Edit\|Write\|MultiEdit\|NotebookEdit` | `Stop` |
|
||||
| Cursor | `.cursor/hooks.json` | `{"version": 1, "hooks": {...}}` with Cursor event names | `afterFileEdit` | `stop` |
|
||||
| Codex | `.codex/hooks.json` | Codex hooks schema (intentionally Claude-compatible: `matcher`, `type: "command"`) | `PostToolUse` matcher includes `apply_patch` | `Stop` |
|
||||
|
||||
### Format Hook
|
||||
## How the scripts handle harness differences
|
||||
|
||||
```bash
|
||||
#!/bin/bash
|
||||
# Auto-format JS/TS files after AI edits
|
||||
# Hook receives JSON via stdin with file_path
|
||||
|
||||
input=$(cat)
|
||||
file_path=$(echo "$input" | grep -o '"file_path"[[:space:]]*:[[:space:]]*"[^"]*"' | sed 's/.*:.*"\([^"]*\)"/\1/')
|
||||
|
||||
case "$file_path" in
|
||||
*.js|*.ts|*.tsx|*.mjs) npx oxfmt "$file_path" 2>/dev/null ;;
|
||||
esac
|
||||
exit 0
|
||||
```
|
||||
|
||||
### Verify Hook
|
||||
|
||||
```bash
|
||||
#!/bin/bash
|
||||
# Run build, lint, type-check, and security audit when agent finishes
|
||||
|
||||
cat > /dev/null # consume stdin
|
||||
status=0
|
||||
corepack yarn build || status=1
|
||||
corepack yarn lint || status=1
|
||||
corepack yarn type-check || status=1
|
||||
echo "=== corepack yarn npm audit ===" && (corepack yarn npm audit || true) # informational
|
||||
exit $status
|
||||
```
|
||||
|
||||
By default, `scripts/agent-hooks/verify.sh` exits non-zero when `corepack yarn build`, `corepack yarn lint`, or `corepack yarn type-check` fails. Set `AGENT_VERIFY_MODE=advisory` only when you intentionally need signal from a broken tree without blocking the hook.
|
||||
- **Stdin shape**: Cursor sends `{"file_path": ...}`; Claude/Codex send `{"tool_input": {"file_path": ...}, "hook_event_name": ...}` with absolute paths. The shared scripts parse both and normalize absolute paths to repo-relative.
|
||||
- **Surfacing output to the model**: in Claude/Codex, plain stdout from `PostToolUse`/`Stop` hooks with exit 0 is transcript-only and never reaches the model. `react-pattern-review.sh` therefore emits `hookSpecificOutput.additionalContext` JSON on `PostToolUse`. The stop-time reminders (`react-pattern-review.sh`, `code-quality-review-reminder.sh`) stay advisory: their output is visible to the contributor, not injected into the model.
|
||||
- **Blocking**: `verify.sh` in strict mode exits **2** with a short reason on stderr — the only exit code that blocks the stop and feeds the failure back to the agent in Claude/Codex. It checks `stop_hook_active` to avoid infinite stop loops, and skips entirely when the working tree is clean (read-only sessions). Set `AGENT_VERIFY_MODE=advisory` only when you intentionally need signal from a broken tree without blocking the session.
|
||||
|
||||
Lifecycle hooks do not replace manual browser verification. For UI or visual changes, still run `playwright-cli` checks across `chrome`, `firefox`, and `webkit`, plus a mobile viewport flow in each engine when responsiveness or touch behavior changed.
|
||||
|
||||
### Yarn Install Hook
|
||||
## Editing rules
|
||||
|
||||
```bash
|
||||
#!/bin/bash
|
||||
# Run Corepack-managed Yarn install when package.json is changed
|
||||
# Hook receives JSON via stdin with file_path
|
||||
|
||||
input=$(cat)
|
||||
file_path=$(echo "$input" | grep -o '"file_path"[[:space:]]*:[[:space:]]*"[^"]*"' | sed 's/.*:.*"\([^"]*\)"/\1/')
|
||||
|
||||
if [ -z "$file_path" ]; then
|
||||
exit 0
|
||||
fi
|
||||
|
||||
if [ "$file_path" = "package.json" ]; then
|
||||
cd "$(dirname "$0")/../.." || exit 0
|
||||
echo "package.json changed - running corepack yarn install to update yarn.lock..."
|
||||
corepack yarn install
|
||||
fi
|
||||
|
||||
exit 0
|
||||
```
|
||||
|
||||
Configure hook wiring according to your agent tool docs (`hooks.json`, equivalent, etc.).
|
||||
|
||||
In this repo, `.codex/hooks/*.sh`, `.cursor/hooks/*.sh`, and `.claude/hooks/*.sh` should stay as thin wrappers that delegate to the shared implementations under `scripts/agent-hooks/`. Harness-specific startup hooks such as Claude's `SessionStart` can live alongside those wrappers when the other harnesses do not have an equivalent entry point.
|
||||
- Change behavior in `scripts/agent-hooks/*.sh`; keep the per-harness wrappers as thin `exec` delegates (they pass harness-appropriate `--skill-dir`/`--scope-prefix` args).
|
||||
- When adding a hook, wire it in **all three** entry points (or add a documented exemption in `scripts/validate-ai-workflow.mjs`, like Claude's `session-start.sh`). The validator checks that every entry point references the same set of `hooks/<name>.sh` scripts.
|
||||
- Do not paste "example" hook implementations into docs — link the real scripts so they cannot drift.
|
||||
|
||||
@@ -35,7 +35,7 @@ If uncertain, ask the developer before adding an entry.
|
||||
- **Context:** Trying to raise the `yarn doctor` (react-doctor) score to 90 (PR #1155).
|
||||
- **What was surprising:** The score is overwhelmingly driven by React-Compiler *optimizability* diagnostics, not code quality. Most of the ~92 "errors" are the `react-hooks-js` plugin flagging valid, idiomatic code the React Compiler (v1.0) cannot optimize *yet* — `refs` (the deliberate latest-ref idiom for a stable callback) and `todo` (`try/finally` and throw-in-`try/catch` the compiler can't lower). The score also saturates on the *fraction of files with zero diagnostics*: removing 150 warnings moved it +1; suppressing all 76 compiler-bailout errors reached only 63; only suppressing essentially every rule reaches 90.
|
||||
- **Impact:** Agents/contributors can burn large effort (and risk real regressions) "fixing" the score by rewriting correct code into compiler-friendly-but-worse shapes, or by suppressing rules until the badge is meaningless. ~63 is the honest, no-regression ceiling.
|
||||
- **Mitigation:** Do NOT treat the aggregate react-doctor score as a target to grind up (the README badge was removed for this reason). Use react-doctor as a PR-diff reviewer — `yarn doctor --diff <base> --annotations`, already wired in `.github/workflows/ci.yml` — to catch *newly introduced* issues. `doctor.config.jsonc` deliberately does not enforce the `react-hooks-js` rules or `react-compiler-no-manual-memoization` (intentional patterns / current compiler limits). Only fix genuine bugs (e.g. clean `no-adjust-state-on-prop-change` cases). Full reasoning: `docs/agent-runs/react-doctor-score/`.
|
||||
- **Mitigation:** Do NOT treat the aggregate react-doctor score as a target to grind up (the README badge was removed for this reason). Use react-doctor as a PR-diff reviewer — `yarn doctor --scope changed --base <base> --annotations`, already wired in `.github/workflows/react-doctor.yml` (releases use `yarn doctor --diff <previous tag>` in `release.yml`) — to catch *newly introduced* issues. `doctor.config.jsonc` deliberately does not enforce the `react-hooks-js` rules or `react-compiler-no-manual-memoization` (intentional patterns / current compiler limits). Only fix genuine bugs (e.g. clean `no-adjust-state-on-prop-change` cases). Full reasoning: `docs/agent-runs/react-doctor-score/`.
|
||||
- **Status:** confirmed
|
||||
|
||||
### Portless 0.11 reuses legacy proxy state unless the launcher forces HTTPS
|
||||
@@ -66,7 +66,7 @@ If uncertain, ask the developer before adding an entry.
|
||||
- **What was surprising:** 5chan does not consume the nearby `/Users/Tommaso/Desktop/bitsocial/bitsocial-react-hooks` checkout by default; `package.json` installs a pinned GitHub tarball of `@bitsocialnet/bitsocial-react-hooks`.
|
||||
- **Impact:** Agents can wrongly assume local hooks source changes are already active in 5chan, or debug the wrong package build when the app is really running a tarball revision from GitHub.
|
||||
- **Mitigation:** Before debugging hooks behavior from 5chan, check `package.json` to see whether the app points at a tarball commit or a local path. If you need fresh hooks behavior, update the tarball commit or temporarily switch 5chan to a local path intentionally.
|
||||
- **Status:** confirmed
|
||||
- **Status:** superseded — `package.json` now installs `@bitsocial/bitsocial-react-hooks` from npm (e.g. `0.1.26`), not a GitHub tarball. The general advice (check `package.json` before assuming local hooks changes are active) still applies.
|
||||
|
||||
### Hooks source commits can land before the generated tarball payload
|
||||
|
||||
@@ -76,7 +76,7 @@ If uncertain, ask the developer before adding an entry.
|
||||
- **What was surprising:** `bitsocial-react-hooks` uses `dist/` as its published entrypoint, and the repo's CI writes that generated payload in a follow-up `chore(ci): update dist and coverage badge` commit after the source commit lands on `master`.
|
||||
- **Impact:** Pinning 5chan to the feature source SHA can install a tarball whose runtime and typings still omit the new API, causing downstream type errors even though the hooks repo's source and CI look green.
|
||||
- **Mitigation:** When updating 5chan to a new hooks change, verify whether hooks `master` has a newer follow-up `chore(ci): update dist and coverage badge` commit and pin 5chan to that dist-synced SHA rather than the source-only SHA.
|
||||
- **Status:** confirmed
|
||||
- **Status:** superseded — 5chan now consumes `@bitsocial/bitsocial-react-hooks` as a published npm version, so tarball-SHA pinning mechanics no longer apply.
|
||||
|
||||
### Portless breaks Windows installs
|
||||
|
||||
|
||||
@@ -1,6 +1,38 @@
|
||||
# Skills and Tools
|
||||
|
||||
Use this playbook when setting up/adjusting skills and external tooling.
|
||||
Use this playbook when setting up/adjusting skills and external tooling, or to discover what is already committed.
|
||||
|
||||
## Committed Skills Index
|
||||
|
||||
These live in `.claude/skills/`, `.cursor/skills/`, and `.codex/skills/` (mirrored; run `yarn ai-workflow:check` after edits). No install needed — prefer them over re-implementing the flow by hand.
|
||||
|
||||
| Skill | Use when |
|
||||
|---|---|
|
||||
| `commit` | Committing current work (splits into logical scoped commits) |
|
||||
| `commit-format` / `issue-format` | Formatting commit/issue *suggestions* in chat output |
|
||||
| `make-closed-issue` | Creating an issue + branch + PR into `master` for already-done work |
|
||||
| `review-and-merge-pr` | Triaging bot/human PR feedback, fixing, merging, finalizing issues |
|
||||
| `fix-merge-conflicts` | Resolving merge conflicts non-interactively and validating the build |
|
||||
| `release` / `release-description` | Cutting a release / updating the release one-liner |
|
||||
| `code-quality-review` | Advisory pre-push/pre-PR quality pass on the current diff |
|
||||
| `refactor-pass` | Simplicity-focused refactor of recent changes |
|
||||
| `deslop` | Removing AI-generated slop from the branch diff |
|
||||
| `debug-agent` | Evidence-based debugging with runtime NDJSON logs |
|
||||
| `you-might-not-need-an-effect` | Auditing/refactoring `useEffect` anti-patterns |
|
||||
| `vercel-react-best-practices` | React performance review rules (vendored from Vercel) |
|
||||
| `translate` | i18next key changes across all 35 languages (spawns `translator` subagents) |
|
||||
| `playwright-cli` | Browser automation and cross-engine UI verification |
|
||||
| `inspect-elements` | Mapping a live DOM node to its React source file/component stack |
|
||||
| `profile-browsing` | Web Vitals + react-scan rerender profiling (spawns `profiler` subagents) |
|
||||
| `test-apk` | Android emulator APK testing (spawns the `test-apk` subagent) |
|
||||
| `implement-plan` | Executing a multi-task plan via parallel `plan-implementer` subagents |
|
||||
| `readme` | Creating/updating README.md |
|
||||
| `context7` | Fetching up-to-date library docs |
|
||||
| `find-skills` | Discovering/installing ecosystem skills |
|
||||
|
||||
## Committed Subagents
|
||||
|
||||
Defined in `.claude/agents/*.md`, `.cursor/agents/*.md`, `.codex/agents/*.toml` (+ `.codex/config.toml` entries): `browser-check`, `code-quality`, `plan-implementer`, `profiler`, `react-doctor-fixer`, `react-patterns-enforcer`, `test-apk`, `translator`. Most are driven by the skills above; read the agent file before spawning one directly.
|
||||
|
||||
## Recommended Skills
|
||||
|
||||
|
||||
+41
-9
@@ -235,7 +235,7 @@ When CodeGraph MCP tools are available and `.codegraph/` exists, prefer them for
|
||||
| React UI logic changed (`src/components`, `src/views`, `src/hooks`, UI stores) | Follow React architecture rules below, review the diff with `vercel-react-best-practices` and `vercel:react-best-practices` when available, fix valid findings, then run `yarn doctor` |
|
||||
| `package.json` changed | Run `corepack yarn install` to keep `yarn.lock` in sync |
|
||||
| Dependencies or import graph changed | Run `yarn knip` as an advisory manifest/import audit |
|
||||
| Translation key/value changed | Use `docs/agent-playbooks/translations.md` |
|
||||
| Translation key/value changed | Use the `translate` skill (spawns parallel `translator` subagents); for manual script operations see `docs/agent-playbooks/translations.md` |
|
||||
| Public-facing English content or AI context changed (`README.md`, `index.html`, `AGENTS.md`, `PRODUCT.md`, `DESIGN.md`, docs pages, or `scripts/generate-llms-files.mjs`) | Run `yarn llms:generate`; inspect and commit any resulting changes to `public/llms*.txt` so LLM indexes stay current |
|
||||
| Bug report in a specific file/line | Start with git history scan from `docs/agent-playbooks/bug-investigation.md` before editing |
|
||||
| `CHANGELOG.md` or package version changed | Run `yarn blotter:check`; if needed add a concise release one-liner |
|
||||
@@ -336,7 +336,7 @@ src/
|
||||
- After adding or changing tests, run `yarn test`.
|
||||
- Do not commit or force-add local rebuild output. `build/` is the main generated build output in this repo; remove or restore generated output directories after local verification before committing.
|
||||
- After React UI logic changes, run: `yarn doctor`.
|
||||
- Treat React Doctor output as guidance for *newly introduced* issues (the CI `yarn doctor --diff` PR check flags those), not as an aggregate score to grind up: many `error`-level diagnostics flag intentional patterns or current React-Compiler limitations, not bugs. See `docs/agent-playbooks/known-surprises.md`.
|
||||
- Treat React Doctor output as guidance for *newly introduced* issues (the CI PR check in `.github/workflows/react-doctor.yml` runs `yarn doctor --scope changed --base <base branch>` to flag those), not as an aggregate score to grind up: many `error`-level diagnostics flag intentional patterns or current React-Compiler limitations, not bugs. See `docs/agent-playbooks/known-surprises.md`.
|
||||
- For UI/visual changes, verify with `playwright-cli` across Chrome/Blink, Firefox/Gecko, and WebKit/Safari.
|
||||
- Cover desktop and a mobile viewport flow in each browser engine when the change affects layout, touch behavior, or responsiveness.
|
||||
- When loading, navigation, or interaction speed matters (or you cannot tell whether perf is real or just a fast dev machine), run a low-spec pass: `./scripts/pw-throttle.sh <session> mid` (or `low`) applies CPU + network throttling to a Chromium `playwright-cli` session before you measure. Throttling is Chromium-only; keep the Firefox/WebKit checks unthrottled. See `docs/agent-playbooks/low-spec-verification.md`.
|
||||
@@ -362,9 +362,9 @@ src/
|
||||
- Keep shared behavior equivalent while preserving harness-specific models, config formats, hook entry points, and tool invocation syntax.
|
||||
- Do not configure `.claude` agents to use `composer-2`; that model is Cursor-only in this repo. Keep `.claude` agent models on Claude-supported options.
|
||||
- Do not configure `.codex/agents/*.toml` with `gpt-5.3-codex` or `gpt-5.3-codex-spark`; standardize Codex agents on `gpt-5.4` unless the user explicitly requests a different model.
|
||||
- When changing shared agent behavior, update the relevant files in `.codex/skills/`, `.cursor/skills/`, `.claude/skills/`, `.codex/agents/`, `.cursor/agents/`, `.claude/agents/`, `.codex/hooks/`, `.cursor/hooks/`, `.claude/hooks/`, and their `hooks.json` or config entry points as needed.
|
||||
- When changing shared agent behavior, update the relevant files in `.codex/skills/`, `.cursor/skills/`, `.claude/skills/`, `.codex/agents/`, `.cursor/agents/`, `.claude/agents/`, `.codex/hooks/`, `.cursor/hooks/`, `.claude/hooks/`, and the hook entry points as needed. Hook entry points are harness-specific: the `hooks` key in `.claude/settings.json` (Claude Code does not read a standalone hooks.json), `.cursor/hooks.json` (Cursor schema), and `.codex/hooks.json` (Codex schema, intentionally Claude-compatible).
|
||||
- If `AGENTS.md` references a skill, agent, or hook, prefer a tracked file under `.codex/`, `.cursor/`, or `.claude/` rather than an untracked local-only instruction.
|
||||
- Review `.codex/config.toml`, `.cursor/hooks.json`, and `.claude/hooks.json` before changing agent orchestration or hook behavior, because they are the entry points contributors will actually load.
|
||||
- Review `.codex/config.toml`, `.codex/hooks.json`, `.cursor/hooks.json`, and `.claude/settings.json` before changing agent orchestration or hook behavior, because they are the entry points contributors will actually load.
|
||||
- Before finishing any React UI logic change under `src/components`, `src/views`, `src/hooks`, or UI stores, review the changed diff with `vercel-react-best-practices` and, in Codex/Vercel-plugin sessions, `vercel:react-best-practices`. Fix valid findings before final verification; do not limit this review to diffs that add new hooks or memoization.
|
||||
- When a diff adds new `useEffect`, `useLayoutEffect`, `useInsertionEffect`, `useMemo`, `useCallback`, or `memo(...)` usage under `src/`, treat the repo hook reminder as mandatory and also reconsider the change with `you-might-not-need-an-effect` before finishing.
|
||||
- Directory-specific auto-loaded rules live under `src/AGENTS.md` and `scripts/AGENTS.md`; read them before editing files in those trees.
|
||||
@@ -436,7 +436,7 @@ Use these only when relevant to the active task:
|
||||
- Long-running agent workflow: `docs/agent-playbooks/long-running-agent-workflow.md`
|
||||
- Translations workflow: `docs/agent-playbooks/translations.md`
|
||||
- Commit/issue output format: `docs/agent-playbooks/commit-issue-format.md`
|
||||
- Skills/tools setup and MCP rationale: `docs/agent-playbooks/skills-and-tools.md`
|
||||
- Skills/tools setup, MCP rationale, and the index of all committed skills/subagents: `docs/agent-playbooks/skills-and-tools.md`
|
||||
- Bug investigation workflow: `docs/agent-playbooks/bug-investigation.md`
|
||||
- Known surprises log: `docs/agent-playbooks/known-surprises.md`
|
||||
- Low-spec device verification (CPU/network throttling): `docs/agent-playbooks/low-spec-verification.md`
|
||||
@@ -851,7 +851,7 @@ If uncertain, ask the developer before adding an entry.
|
||||
- **Context:** Trying to raise the `yarn doctor` (react-doctor) score to 90 (PR #1155).
|
||||
- **What was surprising:** The score is overwhelmingly driven by React-Compiler *optimizability* diagnostics, not code quality. Most of the ~92 "errors" are the `react-hooks-js` plugin flagging valid, idiomatic code the React Compiler (v1.0) cannot optimize *yet* — `refs` (the deliberate latest-ref idiom for a stable callback) and `todo` (`try/finally` and throw-in-`try/catch` the compiler can't lower). The score also saturates on the *fraction of files with zero diagnostics*: removing 150 warnings moved it +1; suppressing all 76 compiler-bailout errors reached only 63; only suppressing essentially every rule reaches 90.
|
||||
- **Impact:** Agents/contributors can burn large effort (and risk real regressions) "fixing" the score by rewriting correct code into compiler-friendly-but-worse shapes, or by suppressing rules until the badge is meaningless. ~63 is the honest, no-regression ceiling.
|
||||
- **Mitigation:** Do NOT treat the aggregate react-doctor score as a target to grind up (the README badge was removed for this reason). Use react-doctor as a PR-diff reviewer — `yarn doctor --diff <base> --annotations`, already wired in `.github/workflows/ci.yml` — to catch *newly introduced* issues. `doctor.config.jsonc` deliberately does not enforce the `react-hooks-js` rules or `react-compiler-no-manual-memoization` (intentional patterns / current compiler limits). Only fix genuine bugs (e.g. clean `no-adjust-state-on-prop-change` cases). Full reasoning: `docs/agent-runs/react-doctor-score/`.
|
||||
- **Mitigation:** Do NOT treat the aggregate react-doctor score as a target to grind up (the README badge was removed for this reason). Use react-doctor as a PR-diff reviewer — `yarn doctor --scope changed --base <base> --annotations`, already wired in `.github/workflows/react-doctor.yml` (releases use `yarn doctor --diff <previous tag>` in `release.yml`) — to catch *newly introduced* issues. `doctor.config.jsonc` deliberately does not enforce the `react-hooks-js` rules or `react-compiler-no-manual-memoization` (intentional patterns / current compiler limits). Only fix genuine bugs (e.g. clean `no-adjust-state-on-prop-change` cases). Full reasoning: `docs/agent-runs/react-doctor-score/`.
|
||||
- **Status:** confirmed
|
||||
|
||||
### Portless 0.11 reuses legacy proxy state unless the launcher forces HTTPS
|
||||
@@ -882,7 +882,7 @@ If uncertain, ask the developer before adding an entry.
|
||||
- **What was surprising:** 5chan does not consume the nearby `/Users/Tommaso/Desktop/bitsocial/bitsocial-react-hooks` checkout by default; `package.json` installs a pinned GitHub tarball of `@bitsocialnet/bitsocial-react-hooks`.
|
||||
- **Impact:** Agents can wrongly assume local hooks source changes are already active in 5chan, or debug the wrong package build when the app is really running a tarball revision from GitHub.
|
||||
- **Mitigation:** Before debugging hooks behavior from 5chan, check `package.json` to see whether the app points at a tarball commit or a local path. If you need fresh hooks behavior, update the tarball commit or temporarily switch 5chan to a local path intentionally.
|
||||
- **Status:** confirmed
|
||||
- **Status:** superseded — `package.json` now installs `@bitsocial/bitsocial-react-hooks` from npm (e.g. `0.1.26`), not a GitHub tarball. The general advice (check `package.json` before assuming local hooks changes are active) still applies.
|
||||
|
||||
### Hooks source commits can land before the generated tarball payload
|
||||
|
||||
@@ -892,7 +892,7 @@ If uncertain, ask the developer before adding an entry.
|
||||
- **What was surprising:** `bitsocial-react-hooks` uses `dist/` as its published entrypoint, and the repo's CI writes that generated payload in a follow-up `chore(ci): update dist and coverage badge` commit after the source commit lands on `master`.
|
||||
- **Impact:** Pinning 5chan to the feature source SHA can install a tarball whose runtime and typings still omit the new API, causing downstream type errors even though the hooks repo's source and CI look green.
|
||||
- **Mitigation:** When updating 5chan to a new hooks change, verify whether hooks `master` has a newer follow-up `chore(ci): update dist and coverage badge` commit and pin 5chan to that dist-synced SHA rather than the source-only SHA.
|
||||
- **Status:** confirmed
|
||||
- **Status:** superseded — 5chan now consumes `@bitsocial/bitsocial-react-hooks` as a published npm version, so tarball-SHA pinning mechanics no longer apply.
|
||||
|
||||
### Portless breaks Windows installs
|
||||
|
||||
@@ -1143,7 +1143,39 @@ Source: https://github.com/bitsocialnet/5chan/blob/master/docs/agent-playbooks/s
|
||||
```markdown
|
||||
# Skills and Tools
|
||||
|
||||
Use this playbook when setting up/adjusting skills and external tooling.
|
||||
Use this playbook when setting up/adjusting skills and external tooling, or to discover what is already committed.
|
||||
|
||||
## Committed Skills Index
|
||||
|
||||
These live in `.claude/skills/`, `.cursor/skills/`, and `.codex/skills/` (mirrored; run `yarn ai-workflow:check` after edits). No install needed — prefer them over re-implementing the flow by hand.
|
||||
|
||||
| Skill | Use when |
|
||||
|---|---|
|
||||
| `commit` | Committing current work (splits into logical scoped commits) |
|
||||
| `commit-format` / `issue-format` | Formatting commit/issue *suggestions* in chat output |
|
||||
| `make-closed-issue` | Creating an issue + branch + PR into `master` for already-done work |
|
||||
| `review-and-merge-pr` | Triaging bot/human PR feedback, fixing, merging, finalizing issues |
|
||||
| `fix-merge-conflicts` | Resolving merge conflicts non-interactively and validating the build |
|
||||
| `release` / `release-description` | Cutting a release / updating the release one-liner |
|
||||
| `code-quality-review` | Advisory pre-push/pre-PR quality pass on the current diff |
|
||||
| `refactor-pass` | Simplicity-focused refactor of recent changes |
|
||||
| `deslop` | Removing AI-generated slop from the branch diff |
|
||||
| `debug-agent` | Evidence-based debugging with runtime NDJSON logs |
|
||||
| `you-might-not-need-an-effect` | Auditing/refactoring `useEffect` anti-patterns |
|
||||
| `vercel-react-best-practices` | React performance review rules (vendored from Vercel) |
|
||||
| `translate` | i18next key changes across all 35 languages (spawns `translator` subagents) |
|
||||
| `playwright-cli` | Browser automation and cross-engine UI verification |
|
||||
| `inspect-elements` | Mapping a live DOM node to its React source file/component stack |
|
||||
| `profile-browsing` | Web Vitals + react-scan rerender profiling (spawns `profiler` subagents) |
|
||||
| `test-apk` | Android emulator APK testing (spawns the `test-apk` subagent) |
|
||||
| `implement-plan` | Executing a multi-task plan via parallel `plan-implementer` subagents |
|
||||
| `readme` | Creating/updating README.md |
|
||||
| `context7` | Fetching up-to-date library docs |
|
||||
| `find-skills` | Discovering/installing ecosystem skills |
|
||||
|
||||
## Committed Subagents
|
||||
|
||||
Defined in `.claude/agents/*.md`, `.cursor/agents/*.md`, `.codex/agents/*.toml` (+ `.codex/config.toml` entries): `browser-check`, `code-quality`, `plan-implementer`, `profiler`, `react-doctor-fixer`, `react-patterns-enforcer`, `test-apk`, `translator`. Most are driven by the skills above; read the agent file before spawning one directly.
|
||||
|
||||
## Recommended Skills
|
||||
|
||||
|
||||
+1
-1
@@ -43,7 +43,7 @@ This file is generated by `scripts/generate-llms-files.mjs`. Do not hand-edit it
|
||||
- [Long-Running Agent Workflow](https://github.com/bitsocialnet/5chan/blob/master/docs/agent-playbooks/long-running-agent-workflow.md): Use this playbook when a task is likely to span multiple sessions, handoffs, or spawned agents.
|
||||
- [Bug Investigation Workflow](https://github.com/bitsocialnet/5chan/blob/master/docs/agent-playbooks/bug-investigation.md): Use this when a bug is reported in a specific file/line/code block.
|
||||
- [Translations Workflow](https://github.com/bitsocialnet/5chan/blob/master/docs/agent-playbooks/translations.md): This project uses i18next translation files in `public/translations/{lang}/default.json`.
|
||||
- [Skills and Tools](https://github.com/bitsocialnet/5chan/blob/master/docs/agent-playbooks/skills-and-tools.md): Use this playbook when setting up/adjusting skills and external tooling.
|
||||
- [Skills and Tools](https://github.com/bitsocialnet/5chan/blob/master/docs/agent-playbooks/skills-and-tools.md): Use this playbook when setting up/adjusting skills and external tooling, or to discover what is already committed.
|
||||
|
||||
## Optional
|
||||
|
||||
|
||||
Reference in New Issue
Block a user