Enhancer API Endpoint
Relevant source files
The following files were used as context for generating this wiki page:
The Enhancer API Endpoint is a specialized service within the Bolt application designed to refine and optimize user-provided prompts before they are submitted to the primary Large Language Model (LLM). It serves as a pre-processing layer that leverages AI to expand brief instructions into detailed, technical descriptions, ensuring the generation of higher-quality code and project structures.
This system is integrated directly into the chat interface, allowing users to "enhance" their initial ideas with a single click. By improving the clarity and specificity of the input, the endpoint helps the assistant better understand the user's intent, stack preferences, and functional requirements.
Sources: README.md, app/lib/hooks/usePromptEnhancer.ts:14-25, app/components/chat/BaseChat.tsx:142-168
System Architecture and Data Flow
The enhancement process involves a client-side hook that communicates with a server-side route. The flow begins when a user clicks the "Enhance prompt" button in the BaseChat component.
Frontend Integration
The frontend utilizes the usePromptEnhancer custom hook to manage the state and execution of the enhancement request. It tracks whether a prompt is currently being enhanced and whether the process has successfully completed.
The diagram shows the lifecycle of a prompt enhancement from user interaction to the final UI update.
Sources: app/lib/hooks/usePromptEnhancer.ts:8-12, app/components/chat/BaseChat.tsx:160-175
Request/Response Cycle
The communication between the client and the endpoint is handled via a standard HTTP POST request. Notably, the response is streamed back to the client using a ReadableStream, allowing the UI to update the input field in real-time as the enhanced prompt is generated.
| Component | Role | Data Format |
|---|---|---|
| Client Hook | Initiates request and decodes stream | JSON Body / UTF-8 Stream |
| API Endpoint | Processes prompt via LLM | Server-Sent Events / Stream |
| Textarea | Displays result | Plain Text |
Sources: app/lib/hooks/usePromptEnhancer.ts:21-50
Implementation Details
API Consumption
The enhancePrompt function sends the current user input to the /api/enhancer route. It uses a TextDecoder to process the incoming stream and incrementally updates the chat input via a callback function.
// app/lib/hooks/usePromptEnhancer.ts:21-25
const response = await fetch('/api/enhancer', {
method: 'POST',
body: JSON.stringify({
message: input,
}),
});
Sources: app/lib/hooks/usePromptEnhancer.ts:21-25
UI State Management
The BaseChat component reflects the status of the enhancement through visual indicators:
- Loading State: Displays a spinner and the text "Enhancing prompt..." when
enhancingPromptis true. - Success State: Displays a star icon and "Prompt enhanced" when
promptEnhancedis true. - Interaction: The button is disabled if the input is empty or if an enhancement is already in progress.
Sources: app/components/chat/BaseChat.tsx:142-168
Sequence of Operations
The following sequence diagram illustrates the interaction between the user, the UI components, and the backend service during an enhancement task.
The sequence demonstrates the asynchronous streaming nature of the enhancement API.
Sources: app/lib/hooks/usePromptEnhancer.ts:27-64, app/components/chat/BaseChat.tsx:142-168
Technical Specifications
Endpoint Configuration
The endpoint is part of the Remix server-side routes and is typically deployed on Cloudflare Workers or similar edge environments as part of the Bolt architecture. It leverages the AI SDK to interface with models like Claude 3.5 Sonnet to perform the actual text expansion.
Sources: README.md, app/routes/api.enhancer.ts
Parameter Summary
The API expects a JSON payload in the request body.
| Parameter | Type | Description |
|---|---|---|
message | string | The raw, unoptimized user prompt to be enhanced. |
Sources: app/lib/hooks/usePromptEnhancer.ts:24
Conclusion
The Enhancer API Endpoint is a critical utility for bridging the gap between vague user intent and the specific technical requirements needed for AI-driven software development. By providing a streaming interface for prompt optimization, it maintains a responsive user experience while significantly improving the quality of the generated codebase.
Sources: README.md, app/components/chat/Chat.client.tsx:165-170