mirror of
https://github.com/supabase/supabase.git
synced 2026-09-06 09:59:03 +08:00
## What Adds an opt-in **SQL Editor manual save** feature preview that switches the SQL Editor from autosaving every edit to saving only on demand, and hardens the tab-close flow so unsaved edits are handled correctly. ## Changes **Feature preview** - New `sqlEditorManualSave` flag + `UI_PREVIEW_SQL_EDITOR_MANUAL_SAVE` local-storage toggle, wired into the Feature Preview modal with an explanatory panel. - `useIsSqlEditorManualSaveEnabled` gates behavior on both the flag and the user's preview opt-in. **Editor toolbar** - Save button (with `Cmd+S`) next to Run, plus an autosave status indicator showing dirty/saving/saved state and a shortcut to disable autosave (emits a `sql_editor_autosave_disable_clicked` telemetry event). **Discard on close** - Closing a snippet tab with unsaved edits prompts for confirmation and, on confirm, actually discards the local edits and evicts the cached server copy so the snippet reopens clean. **Decouple tab layout from SQL specifics** - Tabs store gains a generic per-type close-handler registry (`registerTabCloseHandler` / `getCloseConfirmation` / `closeTabs`). The SQL editor registers its discard + confirmation behavior from the save coordinator. - Low-level `removeTab`/`removeTabs` (rename/move re-keying, stale cleanup) intentionally do **not** trigger discard. - Adds `statusOnDiscard` lifecycle transition and `clearSnippetContent` store action. ## Testing - `pnpm --filter=studio typecheck` — clean. - Added unit tests for the close-handler registry (fires on single/multi close, skips re-keying/cleanup removals, respects tab type, selects confirmation copy, unregisters cleanly). <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Added a SQL editor manual-save preview with a “Save” button and `Cmd+S`, plus a modal option to disable manual-save/preview. * Added “unsaved changes” tab status indication when manual-save is enabled. * Introduced tab-type-specific close confirmations (shown only when needed). * **Bug Fixes** * In manual-save mode, closing a SQL tab with unsaved edits now clears local snippet content and refreshes it on reopen. * **Tests** * Added coverage for tab close handlers and confirmation behavior. * **Chores** * Added a persisted setting allowlist entry and tracked autosave-disable clicks via telemetry. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
104 lines
4.2 KiB
TypeScript
104 lines
4.2 KiB
TypeScript
import type { SnippetStatus } from '@/data/content/snippet-status'
|
|
|
|
/**
|
|
* True when the snippet has never been successfully written to the database.
|
|
* Gates content fetching and list invalidation, and marks locally-created
|
|
* snippets for the replication-lag 404 swallow in the `[id]` page.
|
|
*/
|
|
export function wasNeverPersisted(status: SnippetStatus | undefined): boolean {
|
|
return status === 'new' || status === 'new_saving' || status === 'new_save_failed'
|
|
}
|
|
|
|
/** True while a save request is in flight (whether first save or re-save). */
|
|
export function isSaving(status: SnippetStatus | undefined): boolean {
|
|
return status === 'new_saving' || status === 'saving'
|
|
}
|
|
|
|
/**
|
|
* True when the most recent save attempt failed (whether first save or
|
|
* re-save).
|
|
*/
|
|
export function isSaveFailed(status: SnippetStatus | undefined): boolean {
|
|
return status === 'new_save_failed' || status === 'save_failed'
|
|
}
|
|
|
|
/**
|
|
* True when the snippet holds changes that are not safely persisted: never
|
|
* saved ('new' family), a save in flight, a failed save, or pending local edits
|
|
* ('unsaved'). Used to warn before the tab is closed. Only 'saved' is clean.
|
|
*/
|
|
export function hasUnsavedChanges(status: SnippetStatus | undefined): boolean {
|
|
return status !== undefined && status !== 'saved'
|
|
}
|
|
|
|
/**
|
|
* Transition when a save request begins, preserving the never-persisted axis.
|
|
*/
|
|
export function statusOnSaveStart(status: SnippetStatus | undefined): SnippetStatus {
|
|
return wasNeverPersisted(status) ? 'new_saving' : 'saving'
|
|
}
|
|
|
|
/** Transition when a save succeeds — the snippet is now persisted and clean. */
|
|
export function statusOnSaveSuccess(): SnippetStatus {
|
|
return 'saved'
|
|
}
|
|
|
|
/** Transition when a save fails, preserving the never-persisted axis. */
|
|
export function statusOnSaveError(status: SnippetStatus | undefined): SnippetStatus {
|
|
return wasNeverPersisted(status) ? 'new_save_failed' : 'save_failed'
|
|
}
|
|
|
|
/**
|
|
* Transition when the snippet is edited locally. A persisted-and-clean snippet
|
|
* becomes 'unsaved' so its dirty state is durable immediately (rather than only
|
|
* once the debounced save begins). Every other status is already dirty or
|
|
* in-flight — the never-persisted family, a save in progress, or a failed
|
|
* save — and is left unchanged so the persistence and progress axes are
|
|
* preserved.
|
|
*/
|
|
export function statusOnEdit(status: SnippetStatus): SnippetStatus {
|
|
return status === 'saved' ? 'unsaved' : status
|
|
}
|
|
|
|
/** Transition when a snippet is discarded — the snippet is now either never persisted or clean. */
|
|
export function statusOnDiscard(status: SnippetStatus): SnippetStatus {
|
|
return wasNeverPersisted(status) ? 'new' : 'saved'
|
|
}
|
|
|
|
/**
|
|
* The lifecycle of a folder in the SQL editor nav, as a single set of
|
|
* mutually-exclusive states. Like SnippetStatus, this collapses two orthogonal
|
|
* axes — persistence (a locally-created placeholder vs a persisted folder) and
|
|
* progress (inline-name editing / save in flight / settled) — into one enum, so
|
|
* a folder can never be in a nonsensical combination (e.g. "new" yet "idle").
|
|
* The predicates below recover each axis.
|
|
*/
|
|
export type FolderStatus =
|
|
// Never persisted to the database (a locally-created placeholder):
|
|
| 'new_editing' // its name is being entered inline
|
|
| 'new_saving' // its create is in flight
|
|
// Persisted to the database:
|
|
| 'idle' // settled
|
|
| 'editing' // its name is being edited inline (rename)
|
|
| 'saving' // its rename is in flight
|
|
|
|
/** True for a locally-created placeholder folder that has not been persisted. */
|
|
export function isNewFolder(status: FolderStatus | undefined): boolean {
|
|
return status === 'new_editing' || status === 'new_saving'
|
|
}
|
|
|
|
/** True while the folder's name is being edited inline. */
|
|
export function isFolderEditing(status: FolderStatus | undefined): boolean {
|
|
return status === 'new_editing' || status === 'editing'
|
|
}
|
|
|
|
/** True while a folder create/rename is in flight. */
|
|
export function isFolderSaving(status: FolderStatus | undefined): boolean {
|
|
return status === 'new_saving' || status === 'saving'
|
|
}
|
|
|
|
/** Transition when a folder save begins, preserving the never-persisted axis. */
|
|
export function folderStatusOnSaveStart(status: FolderStatus): FolderStatus {
|
|
return isNewFolder(status) ? 'new_saving' : 'saving'
|
|
}
|