add json improved

packages/web/src/datagrid/DataGridCore.svelte

@@ -102,6 +102,7 @@
   registerCommand({
     id: 'dataGrid.editJsonDocument',
     category: 'Data grid',
+    keyText: 'Ctrl+J',
     name: 'Edit row as JSON document',
     testEnabled: () => getCurrentDataGrid()?.editJsonEnabled(),
     onClick: () => getCurrentDataGrid().editJsonDocument(),
@@ -200,6 +201,14 @@
     onClick: () => getCurrentDataGrid().openChartFromSelection(),
   });
 
+  registerCommand({
+    id: 'dataGrid.newJson',
+    category: 'Data grid',
+    name: 'Add JSON document',
+    testEnabled: () => getCurrentDataGrid()?.addJsonDocumentEnabled(),
+    onClick: () => getCurrentDataGrid().addJsonDocument(),
+  });
+
   function getSelectedCellsInfo(selectedCells, grider, realColumnUniqueNames, selectedRowData) {
     if (selectedCells.length > 1 && selectedCells.every(x => _.isNumber(x[0]) && _.isNumber(x[1]))) {
       let sum = _.sumBy(selectedCells, cell => {
@@ -275,6 +284,7 @@
   import StatusBarTabItem from '../widgets/StatusBarTabItem.svelte';
   import { findCommand } from '../commands/runCommand';
   import { openJsonDocument } from '../tabs/JsonTab.svelte';
+  import EditJsonModal from '../modals/EditJsonModal.svelte';
 
   export let onLoadNextData = undefined;
   export let grider = undefined;
@@ -531,7 +541,7 @@
   }
 
   export function editJsonEnabled() {
-    return grider.editable && isDynamicStructure && _.uniq(selectedCells.map(x => x[0])).length == 1;
+    return grider.editable && _.uniq(selectedCells.map(x => x[0])).length == 1;
   }
 
   export function editJsonDocument() {
@@ -539,6 +549,20 @@
     editJsonRowDocument(grider, rowIndex);
   }
 
+  export function addJsonDocumentEnabled() {
+    return grider.editable;
+  }
+
+  export function addJsonDocument() {
+    showModal(EditJsonModal, {
+      showPasteInfo: true,
+      onSave: value => {
+        grider.insertDocuments(_.isArray(value) ? value : [value]);
+        return true;
+      },
+    });
+  }
+
   export function copyJsonEnabled() {
     return isDynamicStructure && _.uniq(selectedCells.map(x => x[0])).length == 1;
   }
@@ -1277,6 +1301,7 @@
     { command: 'dataGrid.clearFilter' },
     { command: 'dataGrid.undo', hideDisabled: true },
     { command: 'dataGrid.redo', hideDisabled: true },
+    { command: 'dataGrid.newJson', hideDisabled: true },
     { command: 'dataGrid.editJsonDocument', hideDisabled: true },
     { command: 'dataGrid.viewJsonDocument', hideDisabled: true },
     { command: 'dataGrid.viewJsonValue', hideDisabled: true },
@@ -1328,12 +1353,7 @@
     {#if display.filterCount > 0}
       <FormStyledButton value="Reset filter" on:click={() => display.clearFilters()} />
     {/if}
-    <FormStyledButton
+    <FormStyledButton value="Add document" on:click={addJsonDocument} />
-      value="Add document"
-      on:click={() => {
-        findCommand('collectionTable.newJson')?.onClick();
-      }}
-    />
   </div>
 {:else if grider.errors && grider.errors.length > 0}
   <div>

packages/web/src/modals/EditJsonModal.svelte

@@ -12,20 +12,32 @@
 
   export let onSave;
   export let json;
+  export let showPasteInfo;
 
   let value;
+  let editor;
 
   onMount(() => {
-    value = JSON.stringify(json, undefined, 2);
+    if (json) {
+      value = JSON.stringify(json, undefined, 2);
+    } else {
+      // editor.getEditor().execCommand('paste');
+    }
   });
 </script>
 
 <FormProvider>
   <ModalBase {...$$restProps}>
     <div slot="header">Edit JSON value</div>
+    {#if showPasteInfo}
+      <div class="m-2">
+        Edit JSON object or array. You can paste JSON array or object directly into data grid, new row(s) will be added
+        to recordset.
+      </div>
+    {/if}
 
     <div class="editor">
-      <AceEditor mode="json" bind:value />
+      <AceEditor mode="json" bind:value bind:this={editor} />
     </div>
 
     <div slot="footer">

packages/web/src/tabs/CollectionDataTab.svelte

@@ -16,14 +16,6 @@
     testEnabled: () => getCurrentEditor()?.canSave(),
     onClick: () => getCurrentEditor().save(),
   });
-
-  registerCommand({
-    id: 'collectionTable.newJson',
-    category: 'Collection data',
-    name: 'Add JSON document',
-    testEnabled: () => getCurrentEditor() != null,
-    onClick: () => getCurrentEditor().addJsonDocument(),
-  });
 </script>
 
 <script lang="ts">
@@ -135,18 +127,7 @@
     }
   }
 
-  export function addJsonDocument() {
+  registerMenu({ command: 'collectionTable.save', tag: 'save' });
-    showModal(EditJsonModal, {
-      json: {},
-      onSave: value => {
-        const grider = new ChangeSetGrider(loadedRows, $changeSetStore, dispatchChangeSet, display);
-        grider.insertDocuments(_.isArray(value) ? value : [value]);
-        return true;
-      },
-    });
-  }
-
-  registerMenu({ command: 'collectionTable.save', tag: 'save' }, { command: 'collectionTable.newJson', tag: 'edit' });
 
   const collapsedLeftColumnStore = writable(false);
   setContext('collapsedLeftColumnStore', collapsedLeftColumnStore);