Editor panel fix save snippet (#50262)

## Context

Currently hitting "Save snippet" in the Editor panel doesn't actually do
anything - happening because it's using the legacy `needSaving` queue
logic that we had before manual saving became the default. Tiny fix to
just call `requestSave` instead
<img width="469" height="484" alt="image"
src="https://github.com/user-attachments/assets/66c8fd41-9e7c-44ad-8bb0-cdea8de68bd2"
/>


<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **Improvements**
- Saving a snippet now updates the SQL editor with the latest content
automatically.
- New snippets created from the expanded editor or save dialog are saved
through the standard save flow.

- **Accessibility**
- Added an accessible label to the snippet name field for improved
screen reader support.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
Joshen Lim authored and GitHub committed 2026-09-15 15:35:31 +08:00
1 parent 17280319f0
commit 1caeb92122
1 file changed
+14 -2
@@ -56,6 +56,7 @@ import { useContentIdQuery } from '@/data/content/content-id-query'
import { useContentQuery, type Content } from '@/data/content/content-query'
import { useContentUpsertMutation } from '@/data/content/content-upsert-mutation'
import { contentKeys } from '@/data/content/keys'
import type { Snippet } from '@/data/content/sql-folders-query'
import { useExecuteSqlMutation } from '@/data/sql/execute-sql-mutation'
import { applyAutoLimit } from '@/data/sql/utils'
import { useSelectedOrganizationQuery } from '@/hooks/misc/useSelectedOrganization'
@@ -66,6 +67,7 @@ import { editorPanelState, useEditorPanelStateSnapshot } from '@/state/editor-pa
import { SHORTCUT_IDS } from '@/state/shortcuts/registry'
import { useIsShortcutEnabled } from '@/state/shortcuts/useIsShortcutEnabled'
import { useSidebarManagerSnapshot } from '@/state/sidebar-manager-state'
import { useSqlEditorSaveCoordinator } from '@/state/sql-editor/sql-editor-save-coordinator'
import { useSqlEditorV2StateSnapshot } from '@/state/sql-editor/sql-editor-state'
export const EditorPanel = () => {
@@ -86,6 +88,7 @@ export const EditorPanel = () => {
const { profile } = useProfile()
const { closeSidebar } = useSidebarManagerSnapshot()
const sqlEditorSnap = useSqlEditorV2StateSnapshot()
const { requestSave } = useSqlEditorSaveCoordinator()
const isExplorerEnabled = useIsExplorerEnabled()
const { createQuery } = useCreateQuery()
const queryClient = useQueryClient()
@@ -194,6 +197,14 @@ export const EditorPanel = () => {
if (vars.payload.id && ref) {
queryClient.invalidateQueries({ queryKey: contentKeys.resource(ref, vars.payload.id) })
}
if (activeSnippet) {
const updatedSnippet = { ...activeSnippet, content: vars.payload.content }
sqlEditorSnap.updateSnippet({
id: activeSnippet.id,
snippet: updatedSnippet as unknown as Snippet,
skipSave: true,
})
}
originalSnippetRef.current = { sql: currentValue, name: vars.payload.name }
showSaveSuccess()
},
@@ -301,7 +312,7 @@ export const EditorPanel = () => {
})
sqlEditorSnap.addSnippet({ projectRef: ref, snippet })
sqlEditorSnap.addNeedsSaving(snippet.id)
requestSave(snippet.id)
router.push(`/project/${ref}/sql/${snippet.id}`)
handleClosePanel()
@@ -313,6 +324,7 @@ export const EditorPanel = () => {
{isEditingTitle ? (
<input
ref={titleInputRef}
aria-label="Snippet name"
value={titleInput}
onChange={(e) => setTitleInput(e.target.value)}
onBlur={commitRename}
@@ -674,7 +686,7 @@ export const EditorPanel = () => {
project_id: project.id,
})
sqlEditorSnap.addSnippet({ projectRef: ref, snippet })
sqlEditorSnap.addNeedsSaving(snippet.id)
requestSave(snippet.id)
setActiveSnippet(snippet as unknown as Extract<Content, { type: 'sql' }>)
originalSnippetRef.current = { sql: currentValue, name }
showSaveSuccess()