@finos/legend-application-repl 0.0.19 → 0.0.21

package/src/components/{REPLQueryEditor.tsx → dataCube/DataCubeQueryTextEditor.tsx}

@@ -14,9 +14,10 @@
  * limitations under the License.
  */
 
-import { useRef, useEffect, useState, useMemo } from 'react';
 import { observer } from 'mobx-react-lite';
-import { clsx } from '@finos/legend-art';
+import { flowResult } from 'mobx';
+import { PlayIcon, clsx } from '@finos/legend-art';
+import { useRef, useEffect, useState, useMemo } from 'react';
 import {
   getBaseCodeEditorOptions,
   getCodeEditorValue,
@@ -26,69 +27,23 @@ import {
   CODE_EDITOR_LANGUAGE,
   CODE_EDITOR_THEME,
   disposeCodeEditor,
+  CodeEditor,
 } from '@finos/legend-lego/code-editor';
-import { SourceInformation, type ParserError } from '@finos/legend-graph';
-import { debounce, uuid } from '@finos/legend-shared';
-import { action, flowResult, makeObservable, observable } from 'mobx';
+import { debounce } from '@finos/legend-shared';
 import { DEFAULT_TAB_SIZE } from '@finos/legend-application';
-import { useREPLGridClientStore } from './REPLGridClientStoreProvider.js';
+import { useREPLGridClientStore } from '../REPLGridClientStoreProvider.js';
 import {
   editor as monacoEditorAPI,
   type IDisposable,
   languages as monacoLanguagesAPI,
 } from 'monaco-editor';
+import type { REPLGridClientStore } from '../../stores/REPLGridClientStore.js';
 
-export class QueryEditorState {
-  uuid = uuid();
-  query: string;
-  parserError?: ParserError | undefined;
-
-  constructor(query: string) {
-    makeObservable(this, {
-      query: observable,
-      parserError: observable,
-      setQuery: action,
-      setParserError: action,
-    });
-
-    this.query = query;
-  }
-
-  setQuery(val: string): void {
-    this.query = val;
-  }
-
-  setParserError(parserError: ParserError | undefined): void {
-    // account for the lambda prefix offset in source information
-    if (parserError?.sourceInformation) {
-      parserError.sourceInformation = this.processSourceInformation(
-        parserError.sourceInformation,
-      );
-    }
-    this.parserError = parserError;
-  }
-
-  processSourceInformation(
-    sourceInformation: SourceInformation,
-  ): SourceInformation {
-    const { sourceId, startLine, startColumn, endLine, endColumn } =
-      sourceInformation;
-    const lineOffset = 0;
-    const columnOffset = 0;
-    return new SourceInformation(
-      sourceId,
-      startLine + lineOffset,
-      startColumn - (startLine === 1 ? columnOffset : 0),
-      endLine + lineOffset,
-      endColumn - (endLine === 1 ? columnOffset : 0),
-    );
-  }
-}
-
-export const QueryEditor = observer(() => {
+const QueryEditor = observer(() => {
   const editorStore = useREPLGridClientStore();
   const applicationStore = editorStore.applicationStore;
-  const queryEditorState = editorStore.replGridState.queryEditorState;
+  const dataCubeState = editorStore.dataCubeState;
+  const queryEditorState = dataCubeState.queryTextEditorState.queryEditorState;
   const onDidChangeModelContentEventDisposer = useRef<IDisposable | undefined>(
     undefined,
   );
@@ -105,11 +60,11 @@ export const QueryEditor = observer(() => {
   const debouncedParseQuery = useMemo(
     () =>
       debounce((): void => {
-        flowResult(editorStore.parseQuery()).catch(
+        flowResult(dataCubeState.parseQuery()).catch(
           editorStore.applicationStore.alertUnhandledError,
         );
       }, 1000),
-    [editorStore],
+    [dataCubeState, editorStore.applicationStore.alertUnhandledError],
   );
 
   if (editor) {
@@ -141,7 +96,7 @@ export const QueryEditor = observer(() => {
           triggerCharacters: ['>', '.', '$', '~'],
           provideCompletionItems: async (model, position, context) => {
             const suggestions: monacoLanguagesAPI.CompletionItem[] =
-              await editorStore.getTypeaheadResults(position, model);
+              await dataCubeState.getTypeaheadResults(position, model);
             return { suggestions };
           },
         },
@@ -203,3 +158,77 @@ export const QueryEditor = observer(() => {
     </div>
   );
 });
+
+export const DataCubeQueryTextEditor = observer(
+  (props: { editorStore: REPLGridClientStore }) => {
+    const { editorStore } = props;
+    const dataCubeState = editorStore.dataCubeState;
+
+    const executeLambda = (): void => {
+      flowResult(dataCubeState.executeLambda()).catch(
+        editorStore.applicationStore.alertUnhandledError,
+      );
+    };
+
+    const isLightTheme =
+      editorStore.applicationStore.layoutService
+        .TEMPORARY__isLightColorThemeEnabled;
+
+    return (
+      <div className="repl__content__query">
+        <div className="repl__query">
+          <div className="repl__query__editor">
+            <div className="repl__query__header">
+              <div className="repl__query__label">Curent Query</div>
+              <div className="repl__query__execute-btn btn__dropdown-combo btn__dropdown-combo--primary">
+                <button
+                  className="btn__dropdown-combo__label"
+                  onClick={executeLambda}
+                  tabIndex={-1}
+                >
+                  <PlayIcon className="btn__dropdown-combo__label__icon" />
+                  <div className="btn__dropdown-combo__label__title">
+                    Run Query
+                  </div>
+                </button>
+              </div>
+            </div>
+            <div className="repl__query__content">
+              <QueryEditor />
+            </div>
+          </div>
+        </div>
+        {dataCubeState.queryTextEditorState.currentSubQuery !== undefined && (
+          <div className="repl__query">
+            <div className="repl__query__editor">
+              <div className="repl__query__header">
+                <div className="repl__query__label__sub__query">
+                  Current Row Group Sub Query
+                </div>
+                <div className="repl__query__label__sub__query__read--only">
+                  Read Only
+                </div>
+              </div>
+              <div className="repl__query__content">
+                <CodeEditor
+                  lightTheme={
+                    isLightTheme
+                      ? CODE_EDITOR_THEME.BUILT_IN__VSCODE_HC_LIGHT
+                      : CODE_EDITOR_THEME.BUILT_IN__VSCODE_HC_BLACK
+                  }
+                  language={CODE_EDITOR_LANGUAGE.PURE}
+                  isReadOnly={true}
+                  inputValue={
+                    dataCubeState.queryTextEditorState.currentSubQuery
+                  }
+                  hideActionBar={true}
+                  hidePadding={true}
+                />
+              </div>
+            </div>
+          </div>
+        )}
+      </div>
+    );
+  },
+);

package/src/components/grid/GridUtils.ts

@@ -15,6 +15,7 @@
  */
 
 import {
+  type TDSRequest,
   TDS_AGGREGATION_FUNCTION,
   TDS_FILTER_OPERATION,
   TDS_SORT_ORDER,
@@ -48,6 +49,17 @@ export const getTDSSortOrder = (sortOrder: string): TDS_SORT_ORDER => {
   }
 };
 
+const getTDSSortModel = (sort: TDS_SORT_ORDER): string => {
+  switch (sort) {
+    case TDS_SORT_ORDER.ASCENDING:
+      return 'asc';
+    case TDS_SORT_ORDER.DESCENDING:
+      return 'desc';
+    default:
+      throw new Error(`Unsupported`);
+  }
+};
+
 export const getAggregationFunction = (
   aggFunc: string,
 ): TDS_AGGREGATION_FUNCTION => {
@@ -113,14 +125,46 @@ export const getFilterColumnType = (type: string): PRIMITIVE_TYPE => {
   }
 };
 
-export const getAggregationTDSColumnCustomizations = (
-  isAgGridLicenseEnabled: boolean,
+export const getFilterModeltype = (type: PRIMITIVE_TYPE): string => {
+  switch (type) {
+    case PRIMITIVE_TYPE.STRING:
+      return 'text';
+    case PRIMITIVE_TYPE.NUMBER:
+      return 'number';
+    case PRIMITIVE_TYPE.BOOLEAN:
+      return 'boolean';
+    case PRIMITIVE_TYPE.DATE:
+      return 'date';
+    default:
+      throw new Error(`Unsupported filter type ${type}`);
+  }
+};
+
+export const getTDSColumnCustomizations = (
   result: TDSExecutionResult,
   columnName: string,
+  tdsRequest?: TDSRequest | undefined,
 ): object => {
-  if (!isAgGridLicenseEnabled) {
+  if (!tdsRequest) {
     return {};
   }
+  const sort = tdsRequest.sort.find((c) => c.column === columnName)?.order;
+  const rowGroup = tdsRequest.groupBy.columns.find((c) => c === columnName);
+  const aggFunc = tdsRequest.groupBy.aggregations.find(
+    (c) => c.column === columnName,
+  );
+  return {
+    sort: sort ? getTDSSortModel(sort) : undefined,
+    rowGroup: Boolean(rowGroup),
+    hide: Boolean(rowGroup),
+    aggFunc: aggFunc?.function,
+  };
+};
+
+export const getAggregationTDSColumnCustomizations = (
+  result: TDSExecutionResult,
+  columnName: string,
+): object => {
   const columnType = result.builder.columns.find(
     (col) => col.name === columnName,
   )?.type;

package/src/components/grid/ServerSideDataSource.ts

@@ -27,6 +27,7 @@ import {
   TDSSort,
   TDSFilterCondition,
   TDS_FILTER_GROUP,
+  TDSColumn,
 } from './TDSRequest.js';
 import {
   guaranteeNonNullable,
@@ -70,18 +71,30 @@ export class ServerSideDataSource implements IServerSideDatasource {
     params: IServerSideGetRowsParams<unknown, unknown>,
   ): GeneratorFn<void> {
     try {
-      if (this.executions > 0) {
+      if (
+        this.executions > 0 ||
+        this.editorStore?.dataCubeState.gridState.currentQueryTDSRequest
+      ) {
         if (this.editorStore) {
           const request = this.extractRequest(params);
+          this.editorStore.dataCubeState.gridState.setLastQueryTDSRequest(
+            request,
+          );
           if (request) {
-            yield flowResult(this.editorStore.getREPLGridServerResult(request));
-            const result = this.editorStore.replGridState.currentResult;
+            yield flowResult(
+              this.editorStore.dataCubeState.getREPLGridServerResult(request),
+            );
+            const result =
+              this.editorStore.dataCubeState.gridState.currentResult;
             const rowData = getTDSRowData(guaranteeNonNullable(result).result);
             params.success({ rowData: rowData });
           } else {
             params.fail();
           }
         }
+        this.editorStore?.dataCubeState.gridState.setCurrentQueryTDSRequest(
+          undefined,
+        );
       } else {
         params.success({ rowData: this.rowData });
       }
@@ -163,7 +176,7 @@ export class ServerSideDataSource implements IServerSideDatasource {
         });
       }
       const tdsRequest = new TDSRequest(
-        columns ?? [],
+        columns?.map((col) => new TDSColumn(col)) ?? [],
         filter,
         sort,
         groupBy,

package/src/components/grid/TDSLambdaBuilder.ts

@@ -444,7 +444,11 @@ export const buildLambdaExpressions = (
     request.filter.push(groupFilter);
   }
   processFilterOperations(expressions, request.filter);
-  processGroupByOperations(expressions, request.groupBy, request.columns);
+  processGroupByOperations(
+    expressions,
+    request.groupBy,
+    request.columns.map((col) => col.name),
+  );
   processSortOperations(expressions, request.sort, request.groupBy);
   const lambda = new V1_Lambda();
   lambda.body = expressions;

package/src/components/grid/TDSQuery.ts

@@ -0,0 +1,37 @@
+/**
+ * Copyright (c) 2020-present, Goldman Sachs
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { type V1_Lambda, V1_lambdaModelSchema } from '@finos/legend-graph';
+import { TDSRequest } from './TDSRequest.js';
+import { SerializationFactory, usingModelSchema } from '@finos/legend-shared';
+import { createModelSchema } from 'serializr';
+
+export class TDSQuery {
+  initialQuery!: V1_Lambda;
+  currentQueryInfo!: TDSRequest;
+
+  constructor(initialQuery: V1_Lambda, currentQueryInfo: TDSRequest) {
+    this.initialQuery = initialQuery;
+    this.currentQueryInfo = currentQueryInfo;
+  }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSQuery, {
+      initialQuery: usingModelSchema(V1_lambdaModelSchema([])),
+      currentQueryInfo: usingModelSchema(TDSRequest.serialization.schema),
+    }),
+  );
+}

package/src/components/grid/TDSRequest.ts

@@ -15,6 +15,9 @@
  */
 
 import type { PRIMITIVE_TYPE } from '@finos/legend-graph';
+import { SerializationFactory, usingModelSchema } from '@finos/legend-shared';
+import { observable, makeObservable, action } from 'mobx';
+import { createModelSchema, list, optional, primitive } from 'serializr';
 
 export enum TDS_FILTER_OPERATION {
   EQUALS = 'equal',
@@ -64,6 +67,13 @@ export class TDSFilterCondition {
     this.operation = operation;
     this.value = value;
   }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSFilterCondition, {
+      operation: primitive(),
+      value: primitive(),
+    }),
+  );
 }
 
 export class TDSFilter {
@@ -83,6 +93,17 @@ export class TDSFilter {
     this.conditions = conditions;
     this.groupOperation = groupOperation;
   }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSFilter, {
+      column: primitive(),
+      columnType: primitive(),
+      conditions: list(
+        usingModelSchema(TDSFilterCondition.serialization.schema),
+      ),
+      groupOperation: primitive(),
+    }),
+  );
 }
 
 export class TDSSort {
@@ -90,9 +111,25 @@ export class TDSSort {
   order!: TDS_SORT_ORDER;
 
   constructor(column: string, order: TDS_SORT_ORDER) {
+    makeObservable(this, {
+      column: observable,
+      order: observable,
+      setOrder: action,
+    });
     this.column = column;
     this.order = order;
   }
+
+  setOrder(val: TDS_SORT_ORDER): void {
+    this.order = val;
+  }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSSort, {
+      column: primitive(),
+      order: primitive(),
+    }),
+  );
 }
 
 export class TDSAggregation {
@@ -109,6 +146,14 @@ export class TDSAggregation {
     this.columnType = columnType;
     this.function = _function;
   }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSAggregation, {
+      column: primitive(),
+      columnType: primitive(),
+      function: primitive(),
+    }),
+  );
 }
 
 export class TDSGroupby {
@@ -125,18 +170,40 @@ export class TDSGroupby {
     this.groupKeys = groupKeys;
     this.aggregations = aggregations;
   }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSGroupby, {
+      columns: list(primitive()),
+      groupKeys: list(primitive()),
+      aggregations: list(usingModelSchema(TDSAggregation.serialization.schema)),
+    }),
+  );
+}
+
+export class TDSColumn {
+  name!: string;
+
+  constructor(name: string) {
+    this.name = name;
+  }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSColumn, {
+      name: primitive(),
+    }),
+  );
 }
 
 export class TDSRequest {
   startRow?: number | undefined;
   endRow?: number | undefined;
-  columns!: string[];
+  columns!: TDSColumn[];
   filter!: TDSFilter[];
   sort!: TDSSort[];
   groupBy!: TDSGroupby;
 
   constructor(
-    columns: string[],
+    columns: TDSColumn[],
     filter: TDSFilter[],
     sort: TDSSort[],
     groupBy: TDSGroupby,
@@ -150,4 +217,15 @@ export class TDSRequest {
     this.sort = sort;
     this.groupBy = groupBy;
   }
+
+  static readonly serialization = new SerializationFactory(
+    createModelSchema(TDSRequest, {
+      startRow: optional(primitive()),
+      endRow: optional(primitive()),
+      columns: list(usingModelSchema(TDSColumn.serialization.schema)),
+      filter: list(usingModelSchema(TDSFilter.serialization.schema)),
+      sort: list(usingModelSchema(TDSSort.serialization.schema)),
+      groupBy: usingModelSchema(TDSGroupby.serialization.schema),
+    }),
+  );
 }

package/src/server/REPLServerClient.ts

@@ -22,6 +22,7 @@ import {
 import type { REPLGridServerResult } from '../components/grid/REPLGridServerResult.js';
 import type { V1_Lambda } from '@finos/legend-graph';
 import type { CompletionItem } from '../stores/CompletionResult.js';
+import type { TDSQuery } from '../components/grid/TDSQuery.js';
 
 export class REPLServerClient {
   private readonly networkClient: NetworkClient;
@@ -101,4 +102,20 @@ export class REPLServerClient {
       undefined,
       undefined,
     );
+
+  getREPLQuery = (queryId: string): Promise<PlainObject<TDSQuery>> =>
+    this.networkClient.get(
+      `${this.baseUrl}/query/${queryId}`,
+      undefined,
+      undefined,
+      undefined,
+    );
+
+  saveQuery = (tdsQuery: PlainObject<TDSQuery>): Promise<string> =>
+    this.networkClient.post(
+      `${this.baseUrl}/saveQuery`,
+      tdsQuery,
+      undefined,
+      undefined,
+    );
 }