export grid command refactor

packages/web/src/datagrid/CollectionDataGridCore.svelte

@@ -127,16 +127,6 @@
   );
   // $: console.log('GRIDER', grider);
   // $: if (onChangeGrider) onChangeGrider(grider);
-
-  function exportGrid() {
-    const initialValues: any = {};
-    initialValues.sourceStorageType = 'query';
-    initialValues.sourceConnectionId = conid;
-    initialValues.sourceDatabaseName = database;
-    initialValues.sourceSql = display.getExportQuery();
-    initialValues.sourceList = display.baseTable ? [display.baseTable.pureName] : [];
-    showModal(ImportExportModal, { initialValues });
-  }
 </script>
 
 <LoadingDataGridCore
@@ -144,7 +134,6 @@
   loadDataPage={loadCollectionDataPage}
   {dataPageAvailable}
   {loadRowCount}
-  onExportGrid={exportGrid}
   bind:loadedRows
   frameSelection={!!macroPreview}
   {grider}

packages/web/src/datagrid/DataGridCore.svelte

@@ -96,15 +96,6 @@
     onClick: () => getCurrentDataGrid().copyToClipboard(),
   });
 
-  registerCommand({
-    id: 'dataGrid.export',
-    category: 'Data grid',
-    name: 'Export',
-    keyText: 'Ctrl+E',
-    testEnabled: () => getCurrentDataGrid()?.exportEnabled(),
-    onClick: () => getCurrentDataGrid().exportGrid(),
-  });
-
   registerCommand({
     id: 'dataGrid.switchToForm',
     category: 'Data grid',
@@ -242,7 +233,6 @@
   export let onReferenceClick = undefined;
   // export let onSelectedCellsPublishedChanged = undefined;
   export let focusOnVisible = false;
-  export let onExportGrid = null;
   export let formViewAvailable = false;
   export let jsonViewAvailable = false;
   export let errorMessage = undefined;
@@ -293,14 +283,6 @@
     return display;
   }
 
-  export function exportGrid() {
-    if (onExportGrid) onExportGrid();
-  }
-
-  export function exportEnabled() {
-    return !!onExportGrid;
-  }
-
   export function revertRowChanges() {
     grider.beginUpdate();
     for (const index of getSelectedRowIndexes()) {

packages/web/src/datagrid/JslDataGridCore.svelte

@@ -1,4 +1,15 @@
 <script context="module" lang="ts">
+  const getCurrentEditor = () => getActiveComponent('JslDataGridCore');
+
+  registerCommand({
+    id: 'jslTableGrid.export',
+    category: 'Data grid',
+    name: 'Export',
+    keyText: 'Ctrl+E',
+    testEnabled: () => getCurrentEditor() != null,
+    onClick: () => getCurrentEditor().exportGrid(),
+  });
+
   async function loadDataPage(props, offset, limit) {
     const { jslid, display } = props;
 
@@ -32,10 +43,13 @@
 
 <script lang="ts">
   import _ from 'lodash';
+  import registerCommand from '../commands/registerCommand';
   import ImportExportModal from '../modals/ImportExportModal.svelte';
   import { showModal } from '../modals/modalTools';
 
   import axiosInstance from '../utility/axiosInstance';
+  import { registerMenu } from '../utility/contextMenu';
+  import createActivator, { getActiveComponent } from '../utility/createActivator';
   import socket from '../utility/socket';
   import useEffect from '../utility/useEffect';
 
@@ -44,6 +58,8 @@
 
   export let jslid;
 
+  export const activator = createActivator('JslDataGridCore', false);
+
   let loadedRows = [];
   let domGrid;
 
@@ -72,7 +88,7 @@
 
   $: grider = new RowsArrayGrider(loadedRows);
 
-  function exportGrid() {
+  export function exportGrid() {
     const initialValues = {} as any;
     const archiveMatch = jslid.match(/^archive:\/\/([^/]+)\/(.*)$/);
     if (archiveMatch) {
@@ -86,13 +102,14 @@
     }
     showModal(ImportExportModal, { initialValues });
   }
+
+  registerMenu({ command: 'jslTableGrid.export', tag: 'export' });
 </script>
 
 <LoadingDataGridCore
   bind:this={domGrid}
   {...$$props}
   bind:loadedRows
-  onExportGrid={exportGrid}
   {loadDataPage}
   {dataPageAvailable}
   {loadRowCount}

packages/web/src/datagrid/SqlDataGridCore.svelte

@@ -17,6 +17,15 @@
     onClick: () => getCurrentEditor().openQuery(),
   });
 
+  registerCommand({
+    id: 'sqlDataGrid.export',
+    category: 'Data grid',
+    name: 'Export',
+    keyText: 'Ctrl+E',
+    testEnabled: () => getCurrentEditor() != null,
+    onClick: () => getCurrentEditor().exportGrid(),
+  });
+
   async function loadDataPage(props, offset, limit) {
     const { display, conid, database } = props;
 
@@ -110,7 +119,7 @@
   // $: console.log('GRIDER', grider);
   // $: if (onChangeGrider) onChangeGrider(grider);
 
-  function exportGrid() {
+  export function exportGrid() {
     const initialValues: any = {};
     initialValues.sourceStorageType = 'query';
     initialValues.sourceConnectionId = conid;
@@ -163,7 +172,8 @@
 
   registerMenu(
     { command: 'sqlDataGrid.openActiveChart', tag: 'chart' },
-    { command: 'sqlDataGrid.openQuery', tag: 'export' }
+    { command: 'sqlDataGrid.openQuery', tag: 'export' },
+    { command: 'sqlDataGrid.export', tag: 'export' }
   );
 </script>
 
@@ -172,7 +182,6 @@
   {loadDataPage}
   {dataPageAvailable}
   {loadRowCount}
-  onExportGrid={exportGrid}
   bind:loadedRows
   bind:selectedCellsPublished
   frameSelection={!!macroPreview}

packages/web/src/freetable/FreeTableGridCore.svelte

@@ -1,12 +1,28 @@
+<script context="module" lang="ts">
+  const getCurrentEditor = () => getActiveComponent('FreeTableGridCore');
+
+  registerCommand({
+    id: 'freeTableGrid.export',
+    category: 'Data grid',
+    name: 'Export',
+    keyText: 'Ctrl+E',
+    testEnabled: () => getCurrentEditor() != null,
+    onClick: () => getCurrentEditor().exportGrid(),
+  });
+</script>
+
 <script lang="ts">
   import { createGridCache, FreeTableGridDisplay } from 'dbgate-datalib';
   import { writable } from 'svelte/store';
   import uuidv1 from 'uuid/v1';
+  import registerCommand from '../commands/registerCommand';
 
   import DataGridCore from '../datagrid/DataGridCore.svelte';
   import ImportExportModal from '../modals/ImportExportModal.svelte';
   import { showModal } from '../modals/modalTools';
   import axiosInstance from '../utility/axiosInstance';
+import { registerMenu } from '../utility/contextMenu';
+  import createActivator, { getActiveComponent } from '../utility/createActivator';
   import FreeTableGrider from './FreeTableGrider';
   import MacroPreviewGrider from './MacroPreviewGrider';
 
@@ -18,6 +34,8 @@
   export let setConfig;
   export let selectedCellsPublished;
 
+  export const activator = createActivator('FreeTableGridCore', false);
+
   const cache = writable(createGridCache());
 
   $: grider = macroPreview
@@ -25,7 +43,7 @@
     : new FreeTableGrider(modelState, dispatchModel);
   $: display = new FreeTableGridDisplay(grider.model || modelState.value, config, setConfig, $cache, cache.update);
 
-  async function exportGrid() {
+  export async function exportGrid() {
     const jslid = uuidv1();
     await axiosInstance.post('jsldata/save-free-table', { jslid, data: modelState.value });
     const initialValues: any = {};
@@ -34,14 +52,8 @@
     initialValues.sourceList = ['editor-data'];
     showModal(ImportExportModal, { initialValues: initialValues });
   }
+
+  registerMenu({ command: 'freeTableGrid.export', tag: 'export' });
 </script>
 
-<DataGridCore
-  {...$$props}
-  {grider}
-  {display}
-  frameSelection={!!macroPreview}
-  {exportGrid}
-  onExportGrid={exportGrid}
-  bind:selectedCellsPublished
-/>
+<DataGridCore {...$$props} {grider} {display} frameSelection={!!macroPreview} bind:selectedCellsPublished />