feat: implement database-agnostic SQL intellisense

- Add IntellisenseProvider base class with context-aware suggestions
- Create DatabaseSchemaCache for efficient metadata caching
- Implement SQLContextParser to understand cursor position context
- Add ClickHouse-specific intellisense adapter with custom functions/keywords
- Integrate intellisense with Monaco Editor in QueryEditor component
- Add IPC handlers for fetching connection metadata including database type
- Support keyword, table, column, and function suggestions based on context
- Cache schema information with configurable timeout (default 5 minutes)

This provides context-aware SQL intellisense that adapts to different databases

Author: sahithvibudhi

src/main/database/base.ts

@@ -289,14 +289,17 @@ export abstract class BaseDatabaseManager implements DatabaseManagerInterface {
     database?: string
   ): Promise<{ success: boolean; schema?: TableSchema; message: string }>
 
-  getConnectionInfo(connectionId: string): { host: string; port: number; database: string } | null {
+  getConnectionInfo(
+    connectionId: string
+  ): { host: string; port: number; database: string; type: string } | null {
     const connection = this.connections.get(connectionId)
     if (!connection) return null
 
     return {
       host: connection.config.host,
       port: connection.config.port,
-      database: connection.config.database
+      database: connection.config.database,
+      type: connection.config.type
     }
   }
 

src/main/database/clickhouse.ts

@@ -456,13 +456,16 @@ class ClickHouseManager extends BaseDatabaseManager {
     return connection?.isConnected || false
   }
 
-  getConnectionInfo(connectionId: string): { host: string; port: number; database: string } | null {
+  getConnectionInfo(
+    connectionId: string
+  ): { host: string; port: number; database: string; type: string } | null {
     const connection = this.connections.get(connectionId)
     if (connection) {
       return {
         host: connection.config.host,
         port: connection.config.port,
-        database: connection.config.database
+        database: connection.config.database,
+        type: connection.config.type
       }
     }
     return null

src/main/database/interface.ts

@@ -184,7 +184,9 @@ export interface DatabaseManagerInterface {
   ): Promise<{ success: boolean; schema?: TableSchema; message: string }>
 
   // Connection info
-  getConnectionInfo(connectionId: string): { host: string; port: number; database: string } | null
+  getConnectionInfo(
+    connectionId: string
+  ): { host: string; port: number; database: string; type: string } | null
   getAllConnections(): string[]
   getCapabilities(): DatabaseCapabilities
 

src/main/index.ts

@@ -381,6 +381,16 @@ ipcMain.handle('db:getAllConnections', async () => {
   }
 })
 
+ipcMain.handle('db:getConnectionInfo', async (_, connectionId: string) => {
+  try {
+    const info = databaseManager.getConnectionInfo(connectionId)
+    return { success: true, info }
+  } catch (error) {
+    console.error('Error getting connection info:', error)
+    return { success: false, info: null }
+  }
+})
+
 // IPC handler for AI processing
 ipcMain.handle('ai:process', async (_, request) => {
   try {

src/preload/index.ts

@@ -48,7 +48,9 @@ const api = {
     executeBulkOperations: (connectionId: string, operations: any[]) =>
       ipcRenderer.invoke('db:executeBulkOperations', connectionId, operations),
     getPrimaryKeys: (connectionId: string, table: string, database?: string) =>
-      ipcRenderer.invoke('db:getPrimaryKeys', connectionId, table, database)
+      ipcRenderer.invoke('db:getPrimaryKeys', connectionId, table, database),
+    getConnectionInfo: (connectionId: string) =>
+      ipcRenderer.invoke('db:getConnectionInfo', connectionId)
   },
   connections: {
     getAll: () => ipcRenderer.invoke('connections:getAll'),

src/renderer/components/DatabaseExplorer/DatabaseExplorer.tsx

@@ -2,12 +2,7 @@ import { useState, useEffect } from 'react'
 import { Box, Flex, ScrollArea, Text, Button } from '@radix-ui/themes'
 import { Badge, Skeleton } from '../ui'
 import './DatabaseExplorer.css'
-import { 
-  ReloadIcon, 
-  ChevronRightIcon, 
-  ChevronDownIcon,
-  TableIcon
-} from '@radix-ui/react-icons'
+import { ReloadIcon, ChevronRightIcon, ChevronDownIcon, TableIcon } from '@radix-ui/react-icons'
 
 interface DatabaseExplorerProps {
   connectionId: string
@@ -272,7 +267,7 @@ export function DatabaseExplorer({
                   className={`database-item ${db.expanded ? 'expanded' : ''}`}
                   p="2"
                 >
-                  <Box 
+                  <Box
                     className="expand-icon"
                     onClick={() => toggleDatabase(db.name)}
                     style={{ cursor: 'pointer', display: 'flex', alignItems: 'center' }}
@@ -347,7 +342,7 @@ export function DatabaseExplorer({
                           style={{ cursor: obj.type === 'table' ? 'pointer' : 'default' }}
                         >
                           {obj.type === 'table' && (
-                            <Box 
+                            <Box
                               className="expand-icon"
                               onClick={() => toggleTable(db.name, obj.name)}
                               style={{ cursor: 'pointer', display: 'flex', alignItems: 'center' }}

src/renderer/components/QueryEditor/QueryEditor.tsx

@@ -1,10 +1,12 @@
-import { useState, useRef } from 'react'
+import { useState, useRef, useEffect } from 'react'
 import { Button, Flex, Text, Card, Box } from '@radix-ui/themes'
 import Editor, { Monaco } from '@monaco-editor/react'
 import { Skeleton } from '../ui'
 import { useTheme } from '../../hooks/useTheme'
 import './QueryEditor.css'
 import { v4 as uuidv4 } from 'uuid'
+import { createIntellisenseProvider } from '../../lib/intellisense'
+import type { IntellisenseProvider } from '../../lib/intellisense'
 
 interface QueryEditorProps {
   connectionId: string
@@ -87,22 +89,73 @@ export function QueryEditor({ connectionId, connectionName }: QueryEditorProps)
   const [selectedText, setSelectedText] = useState('')
   const [currentQueryId, setCurrentQueryId] = useState<string | null>(null)
   const editorRef = useRef<any>(null)
+  const intellisenseProviderRef = useRef<IntellisenseProvider | null>(null)
+  const completionDisposableRef = useRef<any>(null)
+  const [databaseType, setDatabaseType] = useState<string>('clickhouse')
+
+  useEffect(() => {
+    const fetchDatabaseType = async () => {
+      try {
+        const connInfo = await window.api.database.getConnectionInfo(connectionId)
+        if (connInfo && connInfo.type) {
+          setDatabaseType(connInfo.type)
+        }
+      } catch (error) {
+        console.error('Error fetching database type:', error)
+      }
+    }
+    fetchDatabaseType()
+  }, [connectionId])
+
+  useEffect(() => {
+    return () => {
+      if (completionDisposableRef.current) {
+        completionDisposableRef.current.dispose()
+      }
+      if (intellisenseProviderRef.current) {
+        intellisenseProviderRef.current.dispose()
+      }
+    }
+  }, [])
 
   const handleEditorDidMount = (editor: any, monaco: Monaco) => {
     editorRef.current = editor
 
-    // Configure SQL language settings
-    monaco.languages.registerCompletionItemProvider('sql', {
-      provideCompletionItems: (model, position) => {
-        const suggestions = sqlKeywords.map((keyword) => ({
-          label: keyword,
-          kind: monaco.languages.CompletionItemKind.Keyword,
-          insertText: keyword,
-          documentation: `SQL keyword: ${keyword}`
-        }))
-        return { suggestions }
+    // Initialize intellisense provider
+    try {
+      if (completionDisposableRef.current) {
+        completionDisposableRef.current.dispose()
       }
-    })
+
+      intellisenseProviderRef.current = createIntellisenseProvider(monaco, {
+        connectionId,
+        databaseType,
+        currentDatabase: 'default'
+      })
+
+      completionDisposableRef.current = monaco.languages.registerCompletionItemProvider('sql', {
+        provideCompletionItems: async (model, position) => {
+          if (!intellisenseProviderRef.current) {
+            return { suggestions: [] }
+          }
+          return await intellisenseProviderRef.current.provideCompletionItems(model, position)
+        }
+      })
+    } catch (error) {
+      console.error('Error initializing intellisense:', error)
+      // Fallback to basic keyword completion
+      completionDisposableRef.current = monaco.languages.registerCompletionItemProvider('sql', {
+        provideCompletionItems: (model, position) => {
+          const suggestions = sqlKeywords.map((keyword) => ({
+            label: keyword,
+            kind: monaco.languages.CompletionItemKind.Keyword,
+            insertText: keyword,
+            documentation: `SQL keyword: ${keyword}`
+          }))
+          return { suggestions }
+        }
+      })
+    }
 
     // Add keyboard shortcuts
     editor.addAction({