Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file modified assets/ai_builder/features/knowledge_dark.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified assets/ai_builder/features/knowledge_light.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified assets/ai_builder/features/shortcut_dark.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file modified assets/ai_builder/features/shortcut_light.webp
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
28 changes: 15 additions & 13 deletions docs/ai_builder/features/integration_shortcut.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,9 @@

Reflex Build supports powerful integrations like databases, OpenAI, and Databricks, allowing you to connect external services to your app without complex setup. These integrations help you add advanced functionality—like AI-powered features, data analytics, or persistent storage—while speeding up development.

The **@** feature makes it easy to reference integrations directly while chatting with the AI Builder. By typing **@**, you can quickly insert integrations into your prompts without needing to configure them manually first.
The **Add Integrations** button makes it easy to connect external services to your app while chatting with the AI Builder. A panel with a list of available integrations will appear, you can quickly add integrations that your app can reference and connect to.

Once in your app, you can access your integrations by clicking the flow or cog icon in the bottom left inside the chat area.

```python exec
import reflex as rx
Expand All @@ -28,22 +30,22 @@ rx.el.div(

## How to Use

1. In the AI Builder chat, type **@**.
2. A **popover list** of available integrations will appear (e.g. Database, Databricks, OpenAI).
3. Select an integration from the list.
4. The integration will be inserted into your message as **@IntegrationName**.
5. Continue typing your request, and the AI Builder will use that integration context when generating.
1. In the AI Builder home, click the **Add Integrations** button. And if you're already in an app, click the flow or cog icon in the bottom left inside the chat area.
2. A list of available integrations will appear (e.g. Database, Databricks, OpenAI, etc.).
3. Click the Add button next to an integration to select it.
4. The integration will be added to your app and becomes available for connection. Then you can fill the required fields for the integration.
5. The AI Builder now knows your app has access to this integration and can generate code that uses it.

## What It Does

- **Quick Access** – No need to remember integration names.
- **Context-Aware** – The AI Builder understands that `@Database` or `@OpenAI` refers to the actual integration.
- **Faster Building** – Jump directly into using integrations in your prompts.
- **Quick Access** – Easily browse and select from available integrations.
- **Automatic Connection** – Integrations are added to your app and become available for the AI to use in generated code.
- **No Manual Setup** – Skip complex configuration—the AI Builder handles the integration setup for you.

## Common Use Cases

- **Query Data**
"Show me the top 10 users from **@Database** ordered by signup date."
- **Database Queries**
Show me the top 10 users ordered by signup date from my database.

- **Generate with AI**
"Use **@OpenAI** to summarize the user feedback table."
- **AI Features**
Create a chat application that uses OpenAI to generate responses.
75 changes: 0 additions & 75 deletions docs/ai_builder/features/interaction_modes.md

This file was deleted.

2 changes: 1 addition & 1 deletion docs/ai_builder/features/knowledge.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ rx.el.div(render_image())

## How to Add Knowledge

1. In the AI Builder workspace, go to the **Knowledge** section by clicking the **`@`** symbol in the bottom-left corner inside the chat area, and selecting the **Knowledge** tab. If you haven't submitted a prompt yet, you can click the **`@ Integrations`** button in the prompt area.
1. In the AI Builder workspace, go to the **Knowledge** section by clicking the **`Context`** button in the bottom bar, and then on the top bar click the **`Knowledge`** tab.
2. Enter your rule, guideline, or context description.
3. Save the entry. The AI Builder will automatically use it when generating apps.

Expand Down
1 change: 0 additions & 1 deletion pcweb/components/docpage/sidebar/sidebar_items/ai.py
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,6 @@ def get_sidebar_items_ai_builder_overview():
ai_builder.features.connect_to_github,
ai_builder.features.knowledge,
ai_builder.features.image_as_prompt,
ai_builder.features.interaction_modes,
ai_builder.features.automated_testing,
ai_builder.features.customization,
],
Expand Down