datagrid menu refactor

packages/web/src/datagrid/DataGridCore.svelte

@@ -185,14 +185,6 @@
     onClick: () => getCurrentDataGrid().openChartFromSelection(),
   });
 
-  registerCommand({
-    id: 'dataGrid.openActiveChart',
-    category: 'Data grid',
-    name: 'Open active chart',
-    testEnabled: () => getCurrentDataGrid()?.openActiveChartEnabled(),
-    onClick: () => getCurrentDataGrid().openActiveChart(),
-  });
-
   function getRowCountInfo(selectedCells, grider, realColumnUniqueNames, selectedRowData, allRowCount) {
     if (selectedCells.length > 1 && selectedCells.every(x => _.isNumber(x[0]) && _.isNumber(x[1]))) {
       let sum = _.sumBy(selectedCells, cell => {
@@ -273,7 +265,6 @@
   export let focusOnVisible = false;
   export let onExportGrid = null;
   export let onOpenQuery = null;
-  export let onOpenActiveChart = null;
   export let formViewAvailable = false;
   export let jsonViewAvailable = false;
   export let errorMessage = undefined;
@@ -466,14 +457,6 @@
     return onOpenQuery != null;
   }
 
-  export function openActiveChart() {
-    if (onOpenActiveChart) onOpenActiveChart();
-  }
-
-  export function openActiveChartEnabled() {
-    return onOpenActiveChart != null;
-  }
-
   export function openFreeTable() {
     openNewTab(
       {
@@ -1037,9 +1020,9 @@
       { command: 'dataGrid.refresh' },
       { command: 'dataGrid.copyToClipboard' },
       { command: 'dataGrid.export' },
-      { command: 'dataGrid.switchToForm' },
+      { command: 'dataGrid.switchToForm', hideDisabled: true },
-      { command: 'dataGrid.switchToJson' },
+      { command: 'dataGrid.switchToJson', hideDisabled: true },
-      { command: 'dataGrid.editJsonDocument' },
+      { command: 'dataGrid.editJsonDocument', hideDisabled: true },
       { divider: true },
       { command: 'dataGrid.save' },
       { command: 'dataGrid.revertRowChanges' },
@@ -1056,7 +1039,7 @@
       { command: 'dataGrid.openQuery' },
       { command: 'dataGrid.openFreeTable' },
       { command: 'dataGrid.openChartFromSelection' },
-      { command: 'dataGrid.openActiveChart' },
+      { command: 'dataGrid.openActiveChart', hideDisabled: true },
     ];
   }
 </script>

packages/web/src/datagrid/SqlDataGridCore.svelte

@@ -1,4 +1,14 @@
 <script context="module" lang="ts">
+  const getCurrentEditor = () => getActiveComponent('SqlDataGridCore');
+
+  registerCommand({
+    id: 'dataGrid.openActiveChart',
+    category: 'Data grid',
+    name: 'Open active chart',
+    testEnabled: () => getCurrentEditor() != null,
+    onClick: () => getCurrentEditor().openActiveChart(),
+  });
+
   async function loadDataPage(props, offset, limit) {
     const { display, conid, database } = props;
 
@@ -46,12 +56,14 @@
 <script lang="ts">
   import { changeSetToSql, createChangeSet } from 'dbgate-datalib';
   import { scriptToSql } from 'dbgate-sqltree';
+  import registerCommand from '../commands/registerCommand';
   import ConfirmSqlModal from '../modals/ConfirmSqlModal.svelte';
   import ErrorMessageModal from '../modals/ErrorMessageModal.svelte';
   import ImportExportModal from '../modals/ImportExportModal.svelte';
   import { showModal } from '../modals/modalTools';
 
   import axiosInstance from '../utility/axiosInstance';
+  import createActivator, { getActiveComponent } from '../utility/createActivator';
   import openNewTab from '../utility/openNewTab';
   import ChangeSetGrider from './ChangeSetGrider';
 
@@ -72,6 +84,8 @@
 
   // export let onChangeGrider = undefined;
 
+  export const activator = createActivator('SqlDataGridCore', false);
+
   let loadedRows = [];
 
   // $: console.log('loadedRows BIND', loadedRows);
@@ -145,7 +159,7 @@
     );
   }
 
-  function openActiveChart() {
+  export function openActiveChart() {
     openNewTab(
       {
         title: 'Chart #',
@@ -175,7 +189,6 @@
   {loadRowCount}
   onExportGrid={exportGrid}
   onOpenQuery={openQuery}
-  onOpenActiveChart={openActiveChart}
   bind:loadedRows
   bind:selectedCellsPublished
   frameSelection={!!macroPreview}

packages/web/src/modals/DropDownMenu.svelte

@@ -34,6 +34,7 @@
           keyText: command.keyText || command.keyTextFromGroup,
           onClick: command.onClick,
           disabled: !command.enabled,
+          hideDisabled: item.hideDisabled,
         };
       }
       return null;
@@ -69,6 +70,8 @@
   });
 
   $: extracted = extractMenuItems(items);
+  $: compacted = _.compact(extracted.map(x => mapItem(x, $commands)));
+  $: filtered = compacted.filter(x => !x.disabled || !x.hideDisabled);
 </script>
 
 <ul
@@ -77,7 +80,7 @@
   on:clickOutside={() => dispatch('close')}
   bind:this={element}
 >
-  {#each _.compact(extracted.map(x => mapItem(x, $commands))) as item}
+  {#each filtered as item}
     {#if item.divider}
       <li class="divider" />
     {:else}