Brief an agent on your frontend's unwritten conventions

Vibe codingMedium16 minAnthropic style

Your task

An agent added a transaction dispute flow to your large React and TypeScript frontend. It worked in the browser but broke every house convention: it called fetch directly, threw raw errors, used plain HTML inputs and shipped without a feature flag. None of those conventions are written down anywhere.

Write the brief you would give the agent for its second attempt.

What you know:

  • network calls go through the useApi hook in src/lib/api.ts
  • code that can fail returns a Result type from src/lib/result.ts instead of throwing
  • UI comes from the design system in src/ds, and new UI sits inside <FeatureFlag name="...">
  • the refunds flow in src/features/refunds/ shipped last month

Then, briefly: why did the agent ignore conventions like these?