What is the Copilot component?
The Copilot is rendered with the<wy-copilot> component. You can embed it on any page of a Gainable app. Each instance is linked to one configured Copilot, so you can place several across the app, each connected to a different one.
For example, a sales Copilot on the deals page and a support Copilot on the tickets page. They share the underlying chat component but have different names, instructions, knowledge, and data access.
Adding a Copilot to a page
Describe where you want the Copilot and which one it should use:What users see
When a Copilot is placed on a page, users see:- Name and description in the chat header
- Conversation starters as clickable buttons to begin
- Message input for typing questions
- Chat responses with formatted text, lists, and data from MCP and knowledge
Capabilities
The embedded Copilot inherits all capabilities from its configuration:Placement patterns
Specific page placement
Place a Copilot on the page where it’s most relevant:Multiple pages, same Copilot
Use the same Copilot on several pages:Different Copilots per page
Match the Copilot to the page context:Copilot vs team chat
The Copilot and team chat serve different purposes:Copilot vs Autopilot
The Copilot is reactive. The user asks; it answers. Autopilot is the user-facing surface for Gaia Autopilot, which run on their own and draft work for approval. The two are designed to live side by side:- The Copilot answers a sales rep’s question in chat.
- Autopilot lands the same rep’s “stalled deal” follow-up draft in their inbox before they ask.
Full end-to-end example
Here’s a complete prompt that builds an app, configures a Copilot, and embeds it:Best practices
Place Copilots where users need help
Place Copilots where users need help
Put a Copilot on pages where users are likely to have questions or need to look up data. A deals page Copilot is more useful than one on a simple settings page.
Match Copilot to page context
Match Copilot to page context
If you have multiple Copilots, use ones that are relevant to each page. A sales Copilot on the deals page, a support Copilot on the tickets page.
Use conversation starters to guide discovery
Use conversation starters to guide discovery
Good conversation starters show users what the Copilot can do. Include starters that demonstrate its key capabilities.
Combine with other features
Combine with other features
Copilots work alongside team chat, kanban boards, dashboards, and other features. They add conversational AI without replacing existing collaboration tools.
Learn more
Configuring a Copilot
Set up the Copilot behind the chat
Data access
Connect to app data via MCP
Knowledge bases
Add document references
Collaboration
Team chat and other collaboration features
Autopilot
The proactive side, where Agents draft work for approval