mongo conditions support

packages/web/src/datagrid/CollectionDataGridCore.svelte

@@ -1,6 +1,26 @@
 <script context="module" lang="ts">
   async function loadDataPage(props, offset, limit) {
-    const { conid, database } = props;
+    const { conid, database, display } = props;
+
+    const filters = display?.config?.filters;
+
+    const conditions = [];
+    for (const uniqueName in filters) {
+      if (!filters[uniqueName]) continue;
+      try {
+        const ast = parseFilter(filters[uniqueName], 'mongo');
+        const cond = _.cloneDeepWith(ast, expr => {
+          if (expr.__placeholder__) {
+            return {
+              [uniqueName]: expr.__placeholder__,
+            };
+          }
+        });
+        conditions.push(cond);
+      } catch (err) {
+        // error in filter
+      }
+    }
 
     const response = await axiosInstance.request({
       url: 'database-connections/collection-data',
@@ -14,6 +34,12 @@
           pureName: props.pureName,
           limit,
           skip: offset,
+          condition:
+            conditions.length > 0
+              ? {
+                  $and: conditions,
+                }
+              : undefined,
         },
       },
     });
@@ -53,7 +79,9 @@
 
 <script lang="ts">
   import { changeSetToSql, createChangeSet } from 'dbgate-datalib';
+  import { parseFilter } from 'dbgate-filterparser';
   import { scriptToSql } from 'dbgate-sqltree';
+  import _ from 'lodash';
   import ConfirmSqlModal from '../modals/ConfirmSqlModal.svelte';
   import ErrorMessageModal from '../modals/ErrorMessageModal.svelte';
   import ImportExportModal from '../modals/ImportExportModal.svelte';

packages/web/src/datagrid/DataFilterControl.svelte

@@ -124,6 +124,29 @@
           { onClick: () => openFilterWindow('$'), text: 'Ends With...' },
           { onClick: () => openFilterWindow('!$'), text: 'Does Not End With...' },
         ];
+      case 'mongo':
+        return [
+          { onClick: () => setFilter(''), text: 'Clear Filter' },
+          { onClick: () => filterMultipleValues(), text: 'Filter multiple values' },
+          { onClick: () => openFilterWindow('='), text: 'Equals...' },
+          { onClick: () => openFilterWindow('['), text: 'Does Not Equal...' },
+          { onClick: () => setFilter('EXISTS'), text: 'Field exists' },
+          { onClick: () => setFilter('NOT EXISTS'), text: 'Field does not exist' },
+          { onClick: () => openFilterWindow('>'), text: 'Greater Than...' },
+          { onClick: () => openFilterWindow('>='), text: 'Greater Than Or Equal To...' },
+          { onClick: () => openFilterWindow('<'), text: 'Less Than...' },
+          { onClick: () => openFilterWindow('<='), text: 'Less Than Or Equal To...' },
+          { divider: true },
+          { onClick: () => openFilterWindow('+'), text: 'Contains...' },
+          { onClick: () => openFilterWindow('~'), text: 'Does Not Contain...' },
+          { onClick: () => openFilterWindow('^'), text: 'Begins With...' },
+          { onClick: () => openFilterWindow('!^'), text: 'Does Not Begin With...' },
+          { onClick: () => openFilterWindow('$'), text: 'Ends With...' },
+          { onClick: () => openFilterWindow('!$'), text: 'Does Not End With...' },
+          { divider: true },
+          { onClick: () => setFilter('TRUE'), text: 'Is True' },
+          { onClick: () => setFilter('FALSE'), text: 'Is False' },
+        ];
     }
 
     // return [
@@ -178,6 +201,7 @@
         isOk = true;
       }
     } catch (err) {
+      // console.error(err);
       isError = true;
     }
   }

packages/web/src/datagrid/DataGridCell.svelte

@@ -38,6 +38,7 @@
   export let domCell = undefined;
   export let hideContent = false;
   export let onSetFormView;
+  export let isDynamicStructure = false;
 
   $: value = col.isStructured ? _.get(rowData || {}, col.uniquePath) : (rowData || {})[col.uniqueName];
 </script>
@@ -66,12 +67,26 @@
     {:else if _.isDate(value)}
       {moment(value).format('YYYY-MM-DD HH:mm:ss')}
     {:else if value === true}
-      1
+      {#if isDynamicStructure}
+        <span class="value">true</span>
+      {:else}
+        1
+      {/if}
     {:else if value === false}
-      0
+      {#if isDynamicStructure}
+        <span class="value">false</span>
+      {:else}
+        0
+      {/if}
     {:else if _.isNumber(value)}
       {#if value >= 10000 || value <= -10000}
-        {value.toLocaleString()}
+        {#if isDynamicStructure}
+          <span class="value">{value.toLocaleString()}</span>
+        {:else}
+          {value.toLocaleString()}
+        {/if}
+      {:else if isDynamicStructure}
+        <span class="value">{value.toString()}</span>
       {:else}
         {value.toString()}
       {/if}
@@ -157,4 +172,7 @@
     color: var(--theme-font-3);
     font-style: italic;
   }
+  .value {
+    color: var(--theme-icon-green);
+  }
 </style>

packages/web/src/datagrid/DataGridCore.svelte

@@ -245,7 +245,6 @@
   import openReferenceForm, { openPrimaryKeyForm } from '../formview/openReferenceForm';
   import openNewTab from '../utility/openNewTab';
   import ErrorInfo from '../elements/ErrorInfo.svelte';
-  import resizeObserver from '../utility/resizeObserver';
   import { dataGridRowHeight } from './DataGridRowHeightMeter.svelte';
 
   export let onLoadNextData = undefined;
@@ -1033,7 +1032,7 @@
 {#if !display || (!isDynamicStructure && (!columns || columns.length == 0))}
   <LoadingInfo wrapper message="Waiting for structure" />
 {:else if errorMessage}
-  <ErrorInfo message={errorMessage} />
+  <ErrorInfo message={errorMessage} alignTop />
 {:else if grider.errors && grider.errors.length > 0}
   <div>
     {#each grider.errors as err}
@@ -1121,7 +1120,7 @@
               >
                 <DataFilterControl
                   onGetReference={value => (domFilterControlsRef.get()[col.uniqueName] = value)}
-                  filterType={getFilterType(col.dataType)}
+                  filterType={col.filterType || getFilterType(col.dataType)}
                   filter={display.getFilter(col.uniqueName)}
                   setFilter={value => display.setFilter(col.uniqueName, value)}
                   showResizeSplitter
@@ -1146,6 +1145,7 @@
             {visibleRealColumns}
             {rowHeight}
             {autofillSelectedCells}
+            {isDynamicStructure}
             selectedCells={filterCellsForRow(selectedCells, rowIndex)}
             autofillMarkerCell={filterCellForRow(autofillMarkerCell, rowIndex)}
             focusedColumn={display.focusedColumn}

packages/web/src/datagrid/DataGridRow.svelte

@@ -19,6 +19,7 @@
   export let inplaceEditorState;
   export let dispatchInsplaceEditor;
   export let onSetFormView;
+  export let isDynamicStructure = false;
 
   $: rowData = grider.getRowData(rowIndex);
   $: rowStatus = grider.getRowStatus(rowIndex);
@@ -62,6 +63,7 @@
         isDeleted={rowStatus.status == 'deleted' ||
           (rowStatus.deletedFields && rowStatus.deletedFields.has(col.uniqueName))}
         {onSetFormView}
+        {isDynamicStructure}
       />
     {/if}
   {/each}