The Claude Code post-tool-use format/lint hook was hardcoded to only run
on `apps/studio/` files. This updates it to work across the whole repo.
**Changed:**
- Prettier now runs on any supported file type in the repo (not just
Studio)
- ESLint runs for any workspace that has it configured, using a simple
lookup table
- Unsupported file types (e.g. `.sh`) are skipped to avoid "no parser"
errors
## To test
- Edit a file in `apps/studio/` with bad formatting — should get
auto-formatted and linted
- Edit a file in `packages/common/` — should get auto-formatted (no
ESLint since it's not configured there)
- Edit a `.sh` file — should be skipped with no errors
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Adds a Claude Code `PostToolUse` hook that automatically runs prettier
and ESLint `--fix` on `apps/studio/` files after every Write or Edit.
**Added:**
- `.claude/scripts/format_and_lint.sh` — standalone script that receives
hook JSON on stdin, extracts the file path, and runs prettier + ESLint
- `PostToolUse` hook in `.claude/settings.json` pointing to the script
## Approaches considered
**`if` field with path globs (didn't work):** Claude Code hooks support
an `if` field that uses permission rule syntax to filter when a hook
fires. We tried `"if": "Edit(/apps/studio/**)|Write(/apps/studio/**)"`
and variants (`/apps/studio/**`, `apps/studio/**`, single patterns
without `|`) to scope the hook to studio files without spawning a
process. None of these matched – the `if` field works for tool-name-only
matching (`"Edit"`) and Bash command patterns (`"Bash(git *)"`) but does
**not** support file path globs for Write/Edit tools.
**`$CLAUDE_TOOL_INPUT_FILE_PATH` env var (doesn't exist):** We also
tried using `$CLAUDE_TOOL_INPUT_FILE_PATH` to avoid jq parsing of stdin.
This env var is not provided by Claude Code – hook input comes
exclusively via stdin JSON. The only project-related env var available
is `$CLAUDE_PROJECT_DIR`.
**Inline shell pipeline (worked but hard to maintain):** The first
working version had the full jq + case pipeline inline in settings.json.
Copilot review flagged this for readability, error suppression, and the
jq dependency – so we extracted it to a script.
**Final approach — script with jq stdin parsing + shell `case`:**
`.claude/scripts/format_and_lint.sh` extracts the file path from stdin
JSON with `jq`, gates on `*apps/studio/*` via `case`, runs prettier on
all matched files, then ESLint `--fix` on `.ts/.tsx/.js/.jsx` only. Uses
`set -euo pipefail` so prettier/eslint errors surface instead of being
swallowed.
## To test
- Open a Claude Code session in this repo
- Edit any file under `apps/studio/` – should see "Formatting &
linting..." spinner
- Verify prettier formatting is applied (e.g. introduce extra blank
lines, they get collapsed)
- Verify ESLint autofixes run on `.ts`/`.tsx`/`.js`/`.jsx` files
- Editing files outside `apps/studio/` should not trigger formatting
---------
Co-authored-by: Alaister Young <10985857+alaister@users.noreply.github.com>
Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
To use Claude Code on web, we need the LLM to have access to
dependencies. This creates a install_pkgs.sh script that runs `pnpm
install` only in the Claude Code remove environment.