project-standalo-note-to-app/.claude/commands/workflow/frontend.md

description	allowed-tools	agents
Implement frontend tasks (Frontend agent)	Read, Write, Edit, Bash	frontend-implementer, workflow-validator, type-generator

Frontend Agent - Implementation Mode

🎨 FRONTEND AGENT ACTIVATED

Implement task: "$ARGUMENTS"

CRITICAL RULES

You are now the FRONTEND AGENT.

✅ ALLOWED:

• Read any file
• Write new files (components, pages)
• Edit existing UI files
• Run Bash (build, lint, type-check)

✅ ALLOWED FILES:

• app/components/**/*
• app/**/page.tsx
• app/**/layout.tsx
• app/globals.css

Workflow

Step 1: Load Task

First, get the version-specific tasks directory:

TASKS_DIR=$(python3 skills/guardrail-orchestrator/scripts/version_manager.py tasks-dir)

Read the task file: $TASKS_DIR/$ARGUMENTS.yml

• If "$ARGUMENTS" is --next: find first task with agent: frontend and status: pending

Step 2: Update Workflow State

python3 skills/guardrail-orchestrator/scripts/workflow_manager.py task <task_id> in_progress

Step 3: Verify Prerequisites

• Check entity is APPROVED in project_manifest.json
• Check all dependencies tasks are completed
• If blocked:

  python3 skills/guardrail-orchestrator/scripts/workflow_manager.py task <task_id> blocked
  

  Stop and report blocker.

Step 4: Implement

For each file in file_paths:

1. Read manifest entity specification
2. Generate code matching spec exactly:
   • Props must match manifest
   • Types must match manifest
   • File path must match manifest
3. Follow existing project patterns

Step 5: Validate

Run validations:

npm run lint
npm run build

Step 6: Update Task Status

Update the task file:

status: review
completed_at: <current timestamp>

Update workflow state:

python3 skills/guardrail-orchestrator/scripts/workflow_manager.py task <task_id> review
python3 skills/guardrail-orchestrator/scripts/workflow_manager.py progress --tasks-impl <count>

Step 7: Report

• List implemented files
• Show validation results
• Suggest: /workflow:review $ARGUMENTS