mongo update script preview

packages/web/src/modals/ConfirmNoSqlModal.svelte

@@ -3,11 +3,12 @@
   import FormProvider from '../forms/FormProvider.svelte';
   import FormSubmit from '../forms/FormSubmit.svelte';
   import JSONTree from '../jsontree/JSONTree.svelte';
+  import AceEditor from '../query/AceEditor.svelte';
 
   import ModalBase from './ModalBase.svelte';
   import { closeCurrentModal } from './modalTools';
 
-  export let json;
+  export let script;
   export let onConfirm;
 </script>
 
@@ -16,7 +17,7 @@
     <div slot="header">Save changes</div>
 
     <div class="editor">
-      <JSONTree value={json} />
+      <AceEditor mode="javascript" readOnly value={script} />
     </div>
 
     <div slot="footer">
@@ -37,6 +38,5 @@
     position: relative;
     height: 30vh;
     width: 40vw;
-    overflow: scroll;
   }
 </style>

packages/web/src/tabs/CollectionDataTab.svelte

@@ -118,11 +118,17 @@
 
   export function save() {
     const json = $changeSetStore?.value;
-    showModal(ConfirmNoSqlModal, {
-      json,
-      onConfirm: () => handleConfirmChange(json),
-      engine: display.engine,
-    });
+    const driver = findEngineDriver($connection, $extensions);
+    const script = driver.getCollectionUpdateScript ? driver.getCollectionUpdateScript(json) : null;
+    if (script) {
+      showModal(ConfirmNoSqlModal, {
+        script,
+        onConfirm: () => handleConfirmChange(json),
+        engine: display.engine,
+      });
+    } else {
+      handleConfirmChange(json);
+    }
   }
 
   export function addJsonDocument() {