메뉴
Review the current branch / PR diff for the glific-frontend codebase against its React 19 + TypeScript + Apollo conventions. Use before opening or merging a PR, or when asked to review frontend changes.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Diagnose and fix flaky/nondeterministic tests in the Glific frontend (Vitest + React Testing Library + Apollo MockedProvider, plus Cypress e2e). Reproduce intermittency, classify the root cause (real-timer/polling races, cross-file timer leakage, unflushed act() updates, global/localStorage state leakage, MockedProvider mock exhaustion, Cypress infra flakes), apply the smallest safe fix (usually fake timers or proper isolation), and verify with repeated isolated + one clean concurrent run. Use when the user reports flaky tests or shares CI logs for intermittent failures.
Make the current branch satisfy the Glific frontend Codecov gates (project + patch) by finding uncovered changed lines with Vitest/istanbul coverage and adding focused, behavior-asserting tests until green. Use when the user asks to improve coverage, fix a codecov/patch or codecov/project failure, or satisfy codecov.yml on the current branch.
Take the current Glific frontend branch from local changes through green CI and addressed bot/reviewer comments, ready for human review. Runs tsc + prettier + Vitest + coverage locally, fixes the PR title to the required format, pushes, then polls Unit Testing / Prettier / E2E / Codecov / CodeRabbit until green — handling the common gotchas (un-scheduled workflows, Cypress infra flakes). Use when the user asks to make a branch review-ready or get changes ready for review.
| name | code-review |
| description | Review the current branch / PR diff for the glific-frontend codebase against its React 19 + TypeScript + Apollo conventions. Use before opening or merging a PR, or when asked to review frontend changes. |
Review the changes on the current branch (default: diff against master) and report
findings grouped by severity. Be concrete: cite file:line, explain the impact, and give a
fix. Skip praise; focus on what should change.
git diff master...HEAD (or the PR's base). If a PR number is given, use
gh pr diff <n>.Component reuse — don't reinvent. Before flagging new UI, check src/components/UI/
(Button, Input, DialogBox, AutoComplete, Dropdown, etc.). New components that
duplicate an existing one are a finding. Likewise duplicated CSS classes/styles.
Apollo / data layer.
onCompleted / onError (deprecated here). Mutations must await + try/catch;
queries derive state from data/error via useEffect. Flag any new usage.setNotification /
setErrorMessage), not component state.TypeScript. No new any where a real type is feasible; props typed; no unused exports.
i18n. Every user-facing string uses t('...') and the key exists in src/i18n/en/en.json
(typed keys — a missing key fails tsc). Add to hi/hi.json too. American spelling
("Organization", not "Organisation") for consistency.
Multi-tenant / auth. Org/user context comes from the session, never trusted from client input. Don't leak one entity's data into another (e.g. state that should reset per route).
Tests. New logic/branches need tests (*.test.tsx with MockedProvider); reuse shared
mocks from src/mocks/ instead of redefining inline. Check codecov/patch won't drop — every
new branch (success, failure, empty, error) should be exercised.
Accessibility & UX. Interactive elements have data-testid where tested; loading/empty/
error states handled; nothing silently disabled without explanation.
Scope. Changes match the PR's stated purpose — unrelated edits belong in a separate PR.
## Review: <branch/PR>
### Blocking
- `path:line` — <issue> → <fix>
### Should fix
- ...
### Nits
- ...
### Looks good
- <brief notes on what's solid>
If nothing is blocking, say so explicitly.