AI Chat & Context Pinning

The AI Chat Pane is where you collaborate with Bhai to build and refine your application.

Conversational IterationCopy Anchor Link

Build incrementally rather than trying to describe an entire system in one prompt:

1. Start with the core layout:

   Copy Text

   Build a cryptocurrency price dashboard with 4 stats cards and a chart using Recharts.

2. Refine specific components:

   Copy Text

   In the stats cards, show 24h price change percentage with a green (+ve) or red (-ve) badge.

3. Add interactivity:

   Copy Text

   Add a search bar and category filter to the coin list table.

Context Pinning with @fileCopy Anchor Link

Use Context Pinning to direct the agent’s focus:

• Reference Files: Type @ in the chat input to pick project files (e.g., @src/components/Header.tsx, @src/lib/db.ts).
• Targeted Edits: Referencing files ensures Bhai edits only the relevant code without touching unrelated files.
• Database Schema: Type @schema to inject your current D1 or Postgres schema into the prompt when building forms or queries.

Inline Diffs & UndoCopy Anchor Link

When Bhai modifies code:

• An inline Diff Card appears showing touched files and lines changed.
• Click Inspect Diff to view side-by-side changes.
• Click Undo in the message header to immediately revert that turn’s changes.