This guide covers how to extend FormCMS with new components and features.

To add a new component (e.g., a "Follow Button"), follow these steps:

Add a new file in formmate repo at packages/backend/resources/prompts/components/:

resources/prompts/components/follow-button.html

This file contains the Handlebars + Alpine.js template that the AI will inject.

Modify the relevant prompt (e.g., page-builder.md) to tell the AI:

• What the component does.
• Where to place it in the page structure.
• When to use it (e.g., on user profile pages).

If the component requires new orchestration logic:

1. Create a new agent file in formmate repo at packages/backend/src/models/agents/:

   follow-agent.ts
   

2. Define the agent's responsibilities (when it runs, what it outputs).

Existing agents:

• page-builder-agent.ts – Generates page HTML
• query-generator-agent.ts – Creates GraphQL queries
• entity-generator-agent.ts – Generates schema definitions

To allow users to trigger the agent:

1. Add a new command handler in the frontend.
2. Wire it to the backend's chat/agent router.

Example flow:

User Command → Frontend → Backend Router → Agent → AI → Output

Located in formmate repo at packages/backend/resources/prompts/components/:

• Adding new SDK services
• Creating new AI agents
• Backend API development
• Testing guidelines