Agent-Skills.md

Agent Skills: bbl-senior-frontend

Use for THB-BBL UI-first Next.js App Router implementation, accessibility, rendering/state behavior, and frontend performance when backend contracts are stable. Do not use when backend/API/schema contracts need to move.

UncategorizedID: therealityreport/THB-BBL/bbl-senior-frontend

Repository

therealityreport/THB-BBL
therealityreport

Install this agent skill to your local

pnpm dlx add-skill https://github.com/therealityreport/THB-BBL/tree/HEAD/skills/bbl-senior-frontend

Skill Files

Browse the full folder contents for bbl-senior-frontend.

Download Skill

Loading file tree…

skills/bbl-senior-frontend/SKILL.md

Skill Metadata

Name
bbl-senior-frontend
Description
Use for THB-BBL UI-first Next.js App Router implementation, accessibility, rendering/state behavior, and frontend performance when backend contracts are stable. Do not use when backend/API/schema contracts need to move.

Use this skill for THB-BBL UI-primary work without backend contract drift.

When to use

  1. UI work in src/app/** and src/components/**.
  2. Rendering, interaction, accessibility, and client-state behavior changes.
  3. Frontend performance and UX state handling improvements.

When not to use

  1. Backend/API/schema contract changes in src/app/api/**/route.ts, src/server/services/**, prisma/schema.prisma, or backend/**.
  2. Cross-layer contract coordination as the primary task.
  3. Non-UI operational tasks.

Preflight

  1. Read touched repo guidance (agents.md and relevant docs).
  2. Confirm backend contracts are stable for the requested UI changes.
  3. Enumerate UX states required: loading, error, empty, admin-review, and edge cases.
  4. Confirm affected routes/components and API dependencies.

Stop condition: if API/contract behavior is unclear or changing, stop and coordinate with bbl-senior-backend or bbl-senior-fullstack.

Execution checklist

  1. Implement responsive, accessible UI in src/app/** and src/components/**.
  2. Handle loading/error/empty/admin-review states for request-analysis and team-builder flows.
  3. Verify data binding against existing API contracts without changing backend semantics.
  4. Add/update frontend tests where applicable.
  5. Run npm run lint, npm run typecheck, and npm run test.
  6. Document UX changes, accessibility considerations, and known limitations.

Fallbacks

  1. If contract risk appears, escalate to bbl-senior-backend or bbl-senior-fullstack.
  2. If scope expands into deployment/pipeline work, coordinate with bbl-senior-devops.
  3. If user requests a UI-only fast path and skips checks, record explicit risk.

Completion contract

Return:

  1. scope_statement
  2. ui_surfaces_changed
  3. contract_dependencies
  4. files_changed
  5. validations_run
  6. blocked_checks
  7. residual_risks
  8. rollback_notes