vendor/skills/skilltrust-curated/codex-workflows/recipe-front-review/SKILL.md
Use when explicitly running a frontend review recipe against React or TypeScript UI work and the operator wants the vendored SkillTrust reference flow.
npx skillsauth add yangshu2087/Codex recipe-front-reviewInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Context: Post-implementation quality assurance for React/TypeScript frontend
coding-rules -- coding standardstesting -- test strategy and quality gatesai-development-guide -- AI development patternsOrchestrator spawns agents and passes structured data between them.
Design Doc (uses most recent if omitted): $ARGUMENTS
Identify the Design Doc in docs/design/ and check implementation files changed from the default branch (detect via git symbolic-ref refs/remotes/origin/HEAD or fall back to current branch diff).
[STOP -- BLOCKING] If no Design Doc or implementation files found, notify user and halt. CANNOT proceed without both a Design Doc and implementation files.
Spawn code-reviewer agent: "Validate Design Doc compliance for [design-doc-path]. Implementation files: [git diff file list]. Review mode: full. Return structured JSON report per your Output Format specification."
Store output as: $STEP_2_OUTPUT
Spawn security-reviewer agent: "Design Doc: [path]. Implementation files: [file list from git diff in Step 1]. Review security compliance."
Store output as: $STEP_3_OUTPUT and $STEP_1_FILES (the initial file list)
If security-reviewer returned blocked: Stop immediately. Report the blocked finding and escalate to user. Do not proceed to fix steps.
Code compliance criteria (considering project stage):
Security criteria:
approved or approved_with_notes -> Passneeds_revision -> FailReport both results independently using subagent output fields only (do not add fields that are not in the subagent response):
Code Compliance: [complianceRate from code-reviewer]
Verdict: [verdict from code-reviewer]
Identifier Match Rate: [identifierMatchRate from code-reviewer]
Acceptance Criteria:
- [fulfilled] [item] (confidence: [high/medium/low])
- [partially_fulfilled] [item]: [gap] — [suggestion]
- [unfulfilled] [item]: [gap] — [suggestion]
Identifier Mismatches (show only mismatches; write `None` if all identifiers match):
- None
- [identifier]: DD=[designDocValue] Code=[codeValue] at [location] (confidence: [high/medium/low])
Quality Findings:
- [category] [location]: [description] — [rationale]
Security Review: [status from security-reviewer]
Findings by category:
- [confirmed_risk] [location]: [description] — [rationale]
- [defense_gap] [location]: [description] — [rationale]
- [hardening] [location]: [description] — [rationale]
- [policy] [location]: [description] — [rationale]
Notes: [notes from security-reviewer, if present]
Execute fixes? (y/n):
[STOP -- BLOCKING] Wait for user response on whether to execute fixes. CANNOT proceed with auto-fixes without user approval.
If both pass and user selects n: Skip fix steps, proceed to Final Report.
If user selects y:
docs/plans/tasks/review-fixes-YYYYMMDD.md. Include both code compliance issues and security requiredFixes.ENFORCEMENT: Auto-fixes MUST go through quality-fixer-frontend before re-validation. Skipping quality checks invalidates fixes.
Code Compliance:
Initial: [X]%
Final: [Y]% (if fixes executed)
Security Review:
Initial: [status]
Final: [status] (if fixes executed)
Notes: [notes from approved_with_notes, if any]
Remaining issues:
- [items requiring manual intervention]
Scope: Design Doc compliance validation, security review, and auto-fixes.
development
Use when explicitly reviewing, generating, refactoring, or migrating Terraform/OpenTofu IaC and checking failure modes such as identity churn, secrets, blast radius, CI drift, or compliance gates.
development
Use when the user explicitly mentions Google Stitch and wants a structured Stitch-ready UI prompt or prompt refinement from rough product/design ideas.
development
Use when the user explicitly mentions Google Stitch and asks to convert Stitch designs into Vite, CRA, or generic React components.
development
Use when the user explicitly mentions Google Stitch and asks to convert Stitch designs into Next.js App Router components.