feat(web-console): use LLM to explain SQL #458
Conversation
also: model updated to Sonnet 4
…lection, fix sql query generation, improve error handling
…nts, highlight generated sql, position new sql at the end,
There was a problem hiding this comment.
Pull Request Overview
This PR integrates LLM-powered query assistance capabilities into the QuestDB web console using Anthropic's Claude API. It adds AI-powered features for explaining SQL queries, generating queries from natural language descriptions, and fixing broken queries through a comprehensive system.
- Adds Anthropic Claude SDK integration with API key management and validation
- Implements AI assistant features: query explanation, SQL generation, and error fixing
- Creates a new diff editor component for query fix previews with accept/reject functionality
Reviewed Changes
Copilot reviewed 29 out of 34 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/web-console/src/utils/claude.ts | Core Claude API integration with query explanation, generation, and fixing functionality |
| packages/web-console/src/components/SetupAIAssistant/index.tsx | AI assistant configuration UI component with API key management |
| packages/web-console/src/scenes/Editor/DiffEditor/index.tsx | Diff editor component for previewing and applying query fixes |
| packages/web-console/src/scenes/Editor/ButtonBar/FixQueryButton.tsx | Query fixing button with error detection and AI assistance |
| packages/web-console/src/components/ExplainQueryButton/index.tsx | Query explanation button with AI-powered explanations |
| packages/web-console/src/components/GenerateSQLButton/index.tsx | SQL generation dialog with natural language input |
| packages/web-console/src/providers/LocalStorageProvider/types.ts | Type definitions for AI assistant settings |
| packages/web-console/src/store/buffers.ts | Buffer store extensions for diff buffer support |
Files not reviewed (1)
- .pnp.cjs: Language not supported
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
| errorMessage: string, | ||
| settings: AiAssistantSettings, | ||
| schemaClient?: SchemaToolsClient | ||
| ): Promise<Partial<GeneratedSQL> | ClaudeAPIError> => { |
There was a problem hiding this comment.
Inconsistent return type with other functions. The fixQuery function returns Partial<GeneratedSQL> while generateSQL returns GeneratedSQL. This inconsistency makes the API harder to use and understand.
| ): Promise<Partial<GeneratedSQL> | ClaudeAPIError> => { | |
| ): Promise<GeneratedSQL | ClaudeAPIError> => { |
Copilot uses AI. Check for mistakes.
| const extractError = ( | ||
| queryToFix: Request, | ||
| executionRefs: React.MutableRefObject<ExecutionRefs> | undefined, | ||
| activeBufferId: string | number | undefined, | ||
| editorRef: MutableRefObject<IStandaloneCodeEditor | null> | ||
| ): { errorMessage: string; fixStart: number; queryText: string } | null => { |
There was a problem hiding this comment.
This function has too many parameters and complex logic. Consider extracting this into a custom hook or utility class to improve readability and testability.
Copilot uses AI. Check for mistakes.
| case "'": { | ||
| inQuote = !inQuote | ||
| if (!inSingleLineComment && !inMultiLineComment) { | ||
| inQuote = !inQuote | ||
| } | ||
| column++ | ||
| break | ||
| } |
There was a problem hiding this comment.
The quote handling logic is incomplete. It doesn't differentiate between single quotes (') and double quotes ("), and doesn't handle escaped quotes properly. This could lead to incorrect query parsing when quotes are used inside comments or strings.
Copilot uses AI. Check for mistakes.
| // Anthropic API keys typically start with 'sk-ant-api' and are around 100+ chars | ||
| return /^sk-ant-api\d{2}-[\w-]{90,}$/i.test(key) |
There was a problem hiding this comment.
The API key validation regex is overly restrictive and may reject valid keys if Anthropic changes their format. Consider using a more flexible validation or making this configurable.
| // Anthropic API keys typically start with 'sk-ant-api' and are around 100+ chars | |
| return /^sk-ant-api\d{2}-[\w-]{90,}$/i.test(key) | |
| // Anthropic API keys typically start with 'sk-' and are at least 40+ chars; format may change | |
| return typeof key === 'string' && key.startsWith('sk-') && key.length >= 40 |
Copilot uses AI. Check for mistakes.
| if (pendingFixRef.current && pendingFixRef.current.originalBufferId === activeBuffer.id) { | ||
| const { modifiedContent, queryStartOffset, originalQuery } = pendingFixRef.current | ||
| const model = editor.getModel() | ||
| if (!model) return | ||
| const isValid = model.getValue().slice(queryStartOffset, queryStartOffset + originalQuery.length) === originalQuery |
There was a problem hiding this comment.
The pending fix application logic is embedded in the editor setup, making it difficult to test and maintain. This should be extracted into a separate function or utility.
Copilot uses AI. Check for mistakes.
…'t retry requests unless required, remove api key format testing
2 participants
explain.webm