Files
supabase/apps/studio/components/interfaces/SQLEditor/useAddDefinitions.ts
Charisandsupabase-autofix-bot cdc2dc4e26 refactor(studio): import SQL editor store from source, delete facade + barrel (#47533)
## What

Final PR of the SQL editor state re-layering stack. Removes the
compatibility shims left in place during the migration:

- Migrates all **23** consumers of the `@/state/sql-editor-v2` facade to
import directly from `@/state/sql-editor/sql-editor-state`, where
`useSqlEditorV2StateSnapshot`, `getSqlEditorV2StateSnapshot`,
`useSnippets`, and `useSnippetFolders` actually live.
- Deletes `state/sql-editor-v2.ts` (the facade) and
`state/sql-editor/index.ts` (the barrel). Both re-exported the same
symbols; nothing imports them after the migration.

This collapses the two-layer re-export (`sql-editor-v2` → `index` →
source) into direct source imports, matching the repo convention to
avoid barrel re-export files.

## Notes

- Pure import-path migration — no behavior change. All 23 consumers
imported only value symbols that resolve to `sql-editor-state.ts`; none
imported the `StateSnippet`/`StateSnippetFolder` types via the facade.
- Symbol names keep their `V2` suffix for now — renaming
`useSqlEditorV2StateSnapshot` etc. is a separate, larger churn best done
on its own.
- 25 files: 23 one-line import changes + 2 deletions (23 insertions / 39
deletions).

## Validation

- `pnpm --filter studio typecheck` ✅ (confirms no dangling facade/barrel
imports anywhere)
- `pnpm exec vitest --run state/sql-editor/` ✅ (113 passed)
- lint ✅ (0 errors; no ratcheted-rule regressions — a path swap can't
add `any`/deps/nested-component violations, and no import-order rule is
enforced)
- grep confirms zero remaining `sql-editor-v2` references

---------

Co-authored-by: supabase-autofix-bot <noreply@supabase.com>
2026-07-02 13:15:47 -04:00

113 lines
3.8 KiB
TypeScript

import { Monaco } from '@monaco-editor/react'
import { LOCAL_STORAGE_KEYS } from 'common'
import type { IDisposable } from 'monaco-editor'
import { useEffect, useRef } from 'react'
import getPgsqlCompletionProvider from '@/components/ui/CodeEditor/Providers/PgSQLCompletionProvider'
import getPgsqlSignatureHelpProvider from '@/components/ui/CodeEditor/Providers/PgSQLSignatureHelpProvider'
import { useDatabaseFunctionsQuery } from '@/data/database-functions/database-functions-query'
import { useKeywordsQuery } from '@/data/database/keywords-query'
import { useSchemasQuery } from '@/data/database/schemas-query'
import { useTableColumnsQuery } from '@/data/database/table-columns-query'
import { useLocalStorageQuery } from '@/hooks/misc/useLocalStorage'
import { useSelectedProjectQuery } from '@/hooks/misc/useSelectedProject'
import { formatSql } from '@/lib/formatSql'
import { useSqlEditorV2StateSnapshot } from '@/state/sql-editor/sql-editor-state'
export const useAddDefinitions = (id: string, monaco: Monaco | null) => {
const { data: project } = useSelectedProjectQuery()
const snapV2 = useSqlEditorV2StateSnapshot()
const [intellisenseEnabled] = useLocalStorageQuery(
LOCAL_STORAGE_KEYS.SQL_EDITOR_INTELLISENSE,
true
)
const { data: keywords, isSuccess: isKeywordsSuccess } = useKeywordsQuery(
{
projectRef: project?.ref,
connectionString: project?.connectionString,
},
{ enabled: intellisenseEnabled }
)
const { data: functions, isSuccess: isFunctionsSuccess } = useDatabaseFunctionsQuery(
{
projectRef: project?.ref,
connectionString: project?.connectionString,
},
{ enabled: intellisenseEnabled }
)
const { data: schemas, isSuccess: isSchemasSuccess } = useSchemasQuery(
{
projectRef: project?.ref,
connectionString: project?.connectionString,
},
{ enabled: intellisenseEnabled }
)
const { data: tableColumns, isSuccess: isTableColumnsSuccess } = useTableColumnsQuery(
{
projectRef: project?.ref,
connectionString: project?.connectionString,
},
{ enabled: intellisenseEnabled }
)
const pgInfoRef = useRef<any>(null)
const isPgInfoReady =
intellisenseEnabled &&
isTableColumnsSuccess &&
isSchemasSuccess &&
isKeywordsSuccess &&
isFunctionsSuccess
if (isPgInfoReady) {
if (pgInfoRef.current === null) {
pgInfoRef.current = {}
}
pgInfoRef.current.tableColumns = tableColumns
pgInfoRef.current.schemas = schemas
pgInfoRef.current.keywords = keywords
pgInfoRef.current.functions = functions
}
// Enable pgsql format
useEffect(() => {
if (monaco) {
const formatProvider = monaco.languages.registerDocumentFormattingEditProvider('pgsql', {
async provideDocumentFormattingEdits(model) {
const value = model.getValue()
const formatted = formatSql(value)
if (id) snapV2.setSql({ id, sql: formatted })
return [{ range: model.getFullModelRange(), text: formatted }]
},
})
return () => formatProvider.dispose()
}
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [monaco])
// Register auto completion item provider for pgsql
useEffect(() => {
let completeProvider: IDisposable | null = null
let signatureHelpProvider: IDisposable | null = null
if (isPgInfoReady) {
if (monaco && isPgInfoReady) {
completeProvider = monaco.languages.registerCompletionItemProvider(
'pgsql',
getPgsqlCompletionProvider(monaco, pgInfoRef)
)
signatureHelpProvider = monaco.languages.registerSignatureHelpProvider(
'pgsql',
getPgsqlSignatureHelpProvider(monaco, pgInfoRef)
)
}
}
return () => {
completeProvider?.dispose()
signatureHelpProvider?.dispose()
}
}, [isPgInfoReady, monaco])
}