mirror of
https://github.com/supabase/supabase.git
synced 2026-10-09 19:35:06 +03:00
Charis
d5653f1f92
## What PR 3 of a stacked refactor of the SQL editor snippet state. Replaces the two overlapping pieces of snippet lifecycle state — the `savingStates` map (`IDLE|UPDATING|UPDATING_FAILED`) and the `isNotSavedInDatabaseYet` boolean — with a single `SnippetStatus` enum. ## Status is attached at the data layer (never absent) - `SnippetStatus` + `SnippetWithContent` now live in `data/content`. The snippet queries attach `status: 'saved'` via a typed `withSavedStatus()` helper, and `upsertContent` returns `SnippetWithContent` so move/rename responses carry status too. - A SQL-typed `getSqlSnippetById`/`useSqlSnippetByIdQuery` returns `SnippetWithContent` (the generic `useContentIdQuery` stays for Reports, which use it). `[id].tsx` loads content with **no casting**. - `'new'` is attached on local creation (`createSqlSnippetSkeletonV2`). ## Behavior Behavior-preserving for the existing auto-save flow (faithful mapping of both old fields, including the replication-lag swallow). One incidental fix: the read-only/saving indicator now also covers a brand-new snippet's first save (previously only re-saves of persisted snippets had distinct saving/failed states in some paths). ## Tests New `sql-editor-lifecycle.test.ts` (29 tests) covering every predicate and transition; existing rules tests updated. `pnpm --filter studio typecheck` clean; 52 state/sql-editor unit tests pass. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Release Notes * **Refactor** * Restructured SQL snippet persistence tracking, replacing boolean flags with a comprehensive status system for clearer visibility into save progress. * Enhanced saving indicator UI to reflect accurate snippet save states. * **Tests** * Added test coverage for snippet persistence state transitions and lifecycle scenarios. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
84 lines
3.2 KiB
TypeScript
84 lines
3.2 KiB
TypeScript
import { useQuery } from '@tanstack/react-query'
|
|
import { components } from 'api-types'
|
|
|
|
import type { Content } from './content-query'
|
|
import { remapSqlContentField } from './content-remap'
|
|
import { contentKeys } from './keys'
|
|
import type { SnippetWithContent } from './sql-folders-query'
|
|
import { get, handleError } from '@/data/fetchers'
|
|
import type { ResponseError, UseCustomQueryOptions } from '@/types'
|
|
|
|
export type GetUserContentByIdResponse = Omit<
|
|
components['schemas']['GetUserContentByIdResponse'],
|
|
'content'
|
|
> & {
|
|
content: Content['content']
|
|
}
|
|
|
|
export async function getContentById(
|
|
{ projectRef, id }: { projectRef?: string; id?: string },
|
|
signal?: AbortSignal
|
|
) {
|
|
if (typeof projectRef === 'undefined') throw new Error('projectRef is required')
|
|
if (typeof id === 'undefined') throw new Error('Content ID is required')
|
|
|
|
const { data, error } = await get('/platform/projects/{ref}/content/item/{id}', {
|
|
params: { path: { ref: projectRef, id } },
|
|
signal,
|
|
})
|
|
|
|
if (error) throw handleError(error)
|
|
return remapSqlContentField(data as unknown as GetUserContentByIdResponse)
|
|
}
|
|
|
|
export type ContentIdData = Awaited<ReturnType<typeof getContentById>>
|
|
export type ContentIdError = ResponseError
|
|
|
|
// SQL-editor-specific fetch: the editor only ever loads SQL snippets, so the
|
|
// content body is typed as SQL content and the result is a SnippetWithContent
|
|
// (status 'saved') ready to drop into the store — no narrowing/casting at the
|
|
// call site. Reports etc. keep using the generic getContentById above.
|
|
export async function getSqlSnippetById(
|
|
{ projectRef, id }: { projectRef?: string; id?: string },
|
|
signal?: AbortSignal
|
|
): Promise<SnippetWithContent> {
|
|
if (typeof projectRef === 'undefined') throw new Error('projectRef is required')
|
|
if (typeof id === 'undefined') throw new Error('Content ID is required')
|
|
|
|
const { data, error } = await get('/platform/projects/{ref}/content/item/{id}', {
|
|
params: { path: { ref: projectRef, id } },
|
|
signal,
|
|
})
|
|
|
|
if (error) throw handleError(error)
|
|
const snippet = remapSqlContentField(data as unknown as Omit<SnippetWithContent, 'status'>)
|
|
return { ...snippet, status: 'saved' }
|
|
}
|
|
|
|
export type SqlSnippetByIdData = Awaited<ReturnType<typeof getSqlSnippetById>>
|
|
|
|
export const useSqlSnippetByIdQuery = <TData = SqlSnippetByIdData>(
|
|
{ projectRef, id }: { projectRef?: string; id?: string },
|
|
{
|
|
enabled = true,
|
|
...options
|
|
}: UseCustomQueryOptions<SqlSnippetByIdData, ContentIdError, TData> = {}
|
|
) =>
|
|
useQuery<SqlSnippetByIdData, ContentIdError, TData>({
|
|
queryKey: contentKeys.resource(projectRef, id),
|
|
queryFn: ({ signal }) => getSqlSnippetById({ projectRef, id }, signal),
|
|
enabled: enabled && typeof projectRef !== 'undefined' && typeof id !== 'undefined',
|
|
...options,
|
|
})
|
|
|
|
export const useContentIdQuery = <TData = ContentIdData>(
|
|
{ projectRef, id }: { projectRef?: string; id?: string },
|
|
{ enabled = true, ...options }: UseCustomQueryOptions<ContentIdData, ContentIdError, TData> = {}
|
|
) =>
|
|
useQuery<ContentIdData, ContentIdError, TData>({
|
|
queryKey: contentKeys.resource(projectRef, id),
|
|
queryFn: ({ signal }) => getContentById({ projectRef, id }, signal),
|
|
enabled: enabled && typeof projectRef !== 'undefined' && typeof id !== 'undefined',
|
|
...options,
|
|
})
|