SQL Editor MonacoEditor should invalidate when setSql on debounce called for new snippet (#41422)

apps/studio/components/interfaces/SQLEditor/MonacoEditor.tsx

@@ -205,7 +205,8 @@ const MonacoEditor = ({
 
   useEffect(() => {
     if (debouncedValue.length > 0 && snippet) {
-      snapV2.setSql(id, value)
+      const shouldInvalidate = snippet.snippet.isNotSavedInDatabaseYet
+      snapV2.setSql({ id, sql: value, shouldInvalidate })
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [debouncedValue])

apps/studio/components/interfaces/SQLEditor/SQLEditor.tsx

@@ -248,7 +248,7 @@ export const SQLEditor = () => {
             range: editorModel.getFullModelRange(),
           },
         ])
-        snapV2.setSql(id, formattedSql)
+        snapV2.setSql({ id, sql: formattedSql })
       }
     }
   }, [id, isDiffOpen, project, snapV2])

apps/studio/components/interfaces/SQLEditor/useAddDefinitions.ts

@@ -78,7 +78,7 @@ export const useAddDefinitions = (id: string, monaco: Monaco | null) => {
         async provideDocumentFormattingEdits(model) {
           const value = model.getValue()
           const formatted = formatSql(value)
-          if (id) snapV2.setSql(id, formatted)
+          if (id) snapV2.setSql({ id, sql: formatted })
           return [{ range: model.getFullModelRange(), text: formatted }]
         },
       })

apps/studio/state/sql-editor-v2.ts

@@ -115,11 +115,19 @@ export const sqlEditorState = proxy({
     }
   },
 
-  setSql: (id: string, sql: string) => {
+  setSql: ({
+    id,
+    sql,
+    shouldInvalidate = false,
+  }: {
+    id: string
+    sql: string
+    shouldInvalidate?: boolean
+  }) => {
     let snippet = sqlEditorState.snippets[id]?.snippet
     if (snippet?.content) {
       snippet.content.sql = sql
-      sqlEditorState.needsSaving.set(id, false)
+      sqlEditorState.needsSaving.set(id, shouldInvalidate)
     }
   },