@finos/legend-query-builder 4.14.51 → 4.14.53

package/src/components/fetch-structure/QueryBuilderResultModifierPanel.tsx

@@ -419,6 +419,22 @@ export const QueryResultModifierModal = observer(
     );
     const [startDate, setStartDate] = useState(milestoningState.startDate);
     const [endDate, setEndDate] = useState(milestoningState.endDate);
+    const [businessDateValue, setBusinessDateValue] = useState(
+      milestoningState.getMilestoningParameterValue(
+        milestoningState.businessDate,
+      ),
+    );
+    const [processingDateValue, setProcessingDateValue] = useState(
+      milestoningState.getMilestoningParameterValue(
+        milestoningState.processingDate,
+      ),
+    );
+    const [startDateValue, setStartDateValue] = useState(
+      milestoningState.getMilestoningParameterValue(milestoningState.startDate),
+    );
+    const [endDateValue, setEndDateValue] = useState(
+      milestoningState.getMilestoningParameterValue(milestoningState.endDate),
+    );
 
     const shouldFilterMilestoningParamIfNotUsed = (
       param: ValueSpecification | undefined,
@@ -491,28 +507,28 @@ export const QueryResultModifierModal = observer(
         );
         setParameterStates(allParamStates);
         if (!businessDate) {
-          setBusinessDate(
-            allParamStates.find(
-              (ps) =>
-                ps.variableName ===
-                (milestoningState.businessDate &&
-                milestoningState.businessDate instanceof VariableExpression
-                  ? milestoningState.businessDate.name
-                  : BUSINESS_DATE_MILESTONING_PROPERTY_NAME),
-            )?.parameter,
+          const lambdaParamState = allParamStates.find(
+            (ps) =>
+              ps.variableName ===
+              (milestoningState.businessDate &&
+              milestoningState.businessDate instanceof VariableExpression
+                ? milestoningState.businessDate.name
+                : BUSINESS_DATE_MILESTONING_PROPERTY_NAME),
           );
+          setBusinessDate(lambdaParamState?.parameter);
+          setBusinessDateValue(lambdaParamState?.value);
         }
         if (!processingDate) {
-          setProcessingDate(
-            allParamStates.find(
-              (ps) =>
-                ps.variableName ===
-                (milestoningState.businessDate &&
-                milestoningState.processingDate instanceof VariableExpression
-                  ? milestoningState.processingDate.name
-                  : PROCESSING_DATE_MILESTONING_PROPERTY_NAME),
-            )?.parameter,
+          const lambdaParamState = allParamStates.find(
+            (ps) =>
+              ps.variableName ===
+              (milestoningState.businessDate &&
+              milestoningState.processingDate instanceof VariableExpression
+                ? milestoningState.processingDate.name
+                : PROCESSING_DATE_MILESTONING_PROPERTY_NAME),
           );
+          setProcessingDate(lambdaParamState?.parameter);
+          setProcessingDateValue(lambdaParamState?.value);
         }
       }
       setIsAllVersionsEnabled(Boolean(value));
@@ -552,6 +568,7 @@ export const QueryResultModifierModal = observer(
           MILESTONING_START_DATE_PARAMETER_NAME,
         );
         setStartDate(startDateParameterState.parameter);
+        setStartDateValue(startDateParameterState.value);
       }
       if (!(endDate && endDate instanceof VariableExpression)) {
         endDateParameterState = getOrCreateNewLambdaParameterState(
@@ -559,6 +576,7 @@ export const QueryResultModifierModal = observer(
           MILESTONING_END_DATE_PARAMETER_NAME,
         );
         setEndDate(endDateParameterState.parameter);
+        setEndDateValue(endDateParameterState.value);
       }
       setParameterStates([
         ...new Set([
@@ -601,6 +619,24 @@ export const QueryResultModifierModal = observer(
       setParameterStates(
         milestoningState.queryBuilderState.parametersState.parameterStates,
       );
+      setStartDateValue(
+        milestoningState.getMilestoningParameterValue(
+          milestoningState.startDate,
+        ),
+      );
+      setEndDateValue(
+        milestoningState.getMilestoningParameterValue(milestoningState.endDate),
+      );
+      setProcessingDateValue(
+        milestoningState.getMilestoningParameterValue(
+          milestoningState.processingDate,
+        ),
+      );
+      setBusinessDateValue(
+        milestoningState.getMilestoningParameterValue(
+          milestoningState.businessDate,
+        ),
+      );
     };
 
     // Handle user actions
@@ -630,6 +666,11 @@ export const QueryResultModifierModal = observer(
         milestoningState.queryBuilderState.setGetAllFunction(
           QUERY_BUILDER_SUPPORTED_GET_ALL_FUNCTIONS.GET_ALL_VERSIONS_IN_RANGE,
         );
+        milestoningState.updateMilestoningParameterValue(
+          startDate,
+          startDateValue,
+        );
+        milestoningState.updateMilestoningParameterValue(endDate, endDateValue);
       } else if (isAllVersionsEnabled) {
         milestoningState.clearGetAllParameters();
         milestoningState.queryBuilderState.setGetAllFunction(
@@ -644,6 +685,14 @@ export const QueryResultModifierModal = observer(
         milestoningState.queryBuilderState.setGetAllFunction(
           QUERY_BUILDER_SUPPORTED_GET_ALL_FUNCTIONS.GET_ALL,
         );
+        milestoningState.updateMilestoningParameterValue(
+          processingDate,
+          processingDateValue,
+        );
+        milestoningState.updateMilestoningParameterValue(
+          businessDate,
+          businessDateValue,
+        );
       }
       milestoningState.updateQueryBuilderState();
     };
@@ -660,7 +709,26 @@ export const QueryResultModifierModal = observer(
       setParameterStates(
         milestoningState.queryBuilderState.parametersState.parameterStates,
       );
+      setStartDateValue(
+        milestoningState.getMilestoningParameterValue(
+          milestoningState.startDate,
+        ),
+      );
+      setEndDateValue(
+        milestoningState.getMilestoningParameterValue(milestoningState.endDate),
+      );
+      setProcessingDateValue(
+        milestoningState.getMilestoningParameterValue(
+          milestoningState.processingDate,
+        ),
+      );
+      setBusinessDateValue(
+        milestoningState.getMilestoningParameterValue(
+          milestoningState.businessDate,
+        ),
+      );
     }, [
+      milestoningState,
       milestoningState.isAllVersionsEnabled,
       milestoningState.isAllVersionsInRangeEnabled,
       milestoningState.queryBuilderState.parametersState.parameterStates,
@@ -724,24 +792,34 @@ export const QueryResultModifierModal = observer(
                                 <div className="panel__content__form__section__header__label">
                                   Start Date
                                 </div>
+                                <div className="panel__content__form__section__header__prompt">
+                                  Choose a value for this milestoning parameter
+                                </div>
                                 <MilestoningParameterEditor
                                   queryBuilderState={
                                     milestoningState.queryBuilderState
                                   }
                                   parameter={startDate}
                                   setParameter={setStartDate}
+                                  parameterValue={startDateValue}
+                                  setParameterValue={setStartDateValue}
                                 />
                               </PanelFormSection>
                               <PanelFormSection>
                                 <div className="panel__content__form__section__header__label">
                                   End Date
                                 </div>
+                                <div className="panel__content__form__section__header__prompt">
+                                  Choose a value for this milestoning parameter
+                                </div>
                                 <MilestoningParameterEditor
                                   queryBuilderState={
                                     milestoningState.queryBuilderState
                                   }
                                   parameter={endDate}
                                   setParameter={setEndDate}
+                                  parameterValue={endDateValue}
+                                  setParameterValue={setEndDateValue}
                                 />
                               </PanelFormSection>
                             </div>
@@ -755,12 +833,17 @@ export const QueryResultModifierModal = observer(
                           <div className="panel__content__form__section__header__label">
                             Processing Date
                           </div>
+                          <div className="panel__content__form__section__header__prompt">
+                            Choose a value for this milestoning parameter
+                          </div>
                           <MilestoningParameterEditor
                             queryBuilderState={
                               milestoningState.queryBuilderState
                             }
                             parameter={processingDate}
                             setParameter={setProcessingDate}
+                            parameterValue={processingDateValue}
+                            setParameterValue={setProcessingDateValue}
                           />
                         </PanelFormSection>
                       )}
@@ -769,58 +852,71 @@ export const QueryResultModifierModal = observer(
                           <div className="panel__content__form__section__header__label">
                             Business Date
                           </div>
+                          <div className="panel__content__form__section__header__prompt">
+                            Choose a value for this milestoning parameter
+                          </div>
                           <MilestoningParameterEditor
                             queryBuilderState={
                               milestoningState.queryBuilderState
                             }
                             parameter={businessDate}
                             setParameter={setBusinessDate}
+                            parameterValue={businessDateValue}
+                            setParameterValue={setBusinessDateValue}
                           />
                         </PanelFormSection>
                       )}
                     </>
                   )}
-                  <PanelFormSection>
-                    <div className="panel__content__form__section__header__label">
-                      List of compatible milestoning parameters
-                    </div>
-                  </PanelFormSection>
-                  <div className="panel__content__form__section__list__items">
-                    <PanelFormListItems title="Available parameters">
-                      {filteredParameterStates.length === 0 && (
-                        <> No available parameters </>
-                      )}
-                      {filteredParameterStates.map((pState) => (
-                        <VariableViewer
-                          key={pState.uuid}
-                          variable={pState.parameter}
-                          isReadOnly={true}
-                          queryBuilderState={milestoningState.queryBuilderState}
-                        />
-                      ))}
-                    </PanelFormListItems>
-                    {Boolean(filteredConstantState.length) && (
-                      <PanelFormListItems title="Available constants">
-                        {filteredConstantState.map((constantState) => (
-                          <VariableViewer
-                            key={constantState.uuid}
-                            variable={constantState.variable}
-                            value={{
-                              val:
-                                constantState instanceof
-                                QueryBuilderSimpleConstantExpressionState
-                                  ? constantState.value
-                                  : undefined,
-                            }}
-                            queryBuilderState={
-                              milestoningState.queryBuilderState
-                            }
-                            isReadOnly={true}
-                          />
-                        ))}
-                      </PanelFormListItems>
-                    )}
-                  </div>
+                  {!(isAllVersionsEnabled && !isAllVersionsInRangeEnabled) && (
+                    <>
+                      <PanelFormSection>
+                        <div className="panel__content__form__section__header__label">
+                          List of compatible milestoning parameters
+                        </div>
+                      </PanelFormSection>
+                      <div className="panel__content__form__section__list__items">
+                        {filteredParameterStates.length > 0 && (
+                          <PanelFormListItems title="Available parameters">
+                            {filteredParameterStates.map((pState) => (
+                              <VariableViewer
+                                key={pState.uuid}
+                                variable={pState.parameter}
+                                isReadOnly={true}
+                                queryBuilderState={
+                                  milestoningState.queryBuilderState
+                                }
+                                option={{
+                                  hideMilestoningParameterValueString: true,
+                                }}
+                              />
+                            ))}
+                          </PanelFormListItems>
+                        )}
+                        {Boolean(filteredConstantState.length) && (
+                          <PanelFormListItems title="Available constants">
+                            {filteredConstantState.map((constantState) => (
+                              <VariableViewer
+                                key={constantState.uuid}
+                                variable={constantState.variable}
+                                value={{
+                                  val:
+                                    constantState instanceof
+                                    QueryBuilderSimpleConstantExpressionState
+                                      ? constantState.value
+                                      : undefined,
+                                }}
+                                queryBuilderState={
+                                  milestoningState.queryBuilderState
+                                }
+                                isReadOnly={true}
+                              />
+                            ))}
+                          </PanelFormListItems>
+                        )}
+                      </div>
+                    </>
+                  )}
                   <div className="query-builder__projection__options__section-name">
                     Other
                   </div>
@@ -960,7 +1056,7 @@ export const QueryResultModifierModal = observer(
                               watermarkState.queryBuilderState.graphManagerState
                                 .graph
                             }
-                            obseverContext={
+                            observerContext={
                               watermarkState.queryBuilderState.observerContext
                             }
                             typeCheckOption={{

package/src/components/fetch-structure/QueryBuilderTDSPanel.tsx

@@ -1146,7 +1146,7 @@ const QueryBuilderProjectionColumnEditor = observer(
                       aggregateColumnState.calendarFunction?.setEndDate(val);
                     }}
                     graph={tdsState.queryBuilderState.graphManagerState.graph}
-                    obseverContext={tdsState.queryBuilderState.observerContext}
+                    observerContext={tdsState.queryBuilderState.observerContext}
                     typeCheckOption={{
                       expectedType: PrimitiveType.STRICTDATE,
                     }}
@@ -1353,7 +1353,17 @@ export const QueryBuilderTDSPanel = observer(
                     : 'Set Query Options'}
                 </div>
               </button>
-              <div className="query-builder__projection__result-modifier-prompt__divider">
+
+              <div
+                className={clsx(
+                  'query-builder__projection__result-modifier-prompt__divider',
+                  {
+                    'query-builder__projection__result-modifier-prompt__divider--light':
+                      applicationStore.layoutService
+                        .TEMPORARY__isLightColorThemeEnabled,
+                  },
+                )}
+              >
                 {tdsState.isQueryOptionsSet && ' - '}
               </div>
               {tdsState.queryBuilderState.milestoningState

package/src/components/filter/QueryBuilderFilterPanel.tsx

@@ -14,7 +14,14 @@
  * limitations under the License.
  */
 
-import { useRef, useState, useCallback, forwardRef, useMemo } from 'react';
+import {
+  useRef,
+  useState,
+  useCallback,
+  forwardRef,
+  useMemo,
+  useEffect,
+} from 'react';
 import { observer } from 'mobx-react-lite';
 import {
   type TreeNodeContainerProps,
@@ -103,9 +110,9 @@ import type { QueryBuilderFilterOperator } from '../../stores/filter/QueryBuilde
 import { isTypeCompatibleForAssignment } from '../../stores/QueryBuilderValueSpecificationHelper.js';
 import { QUERY_BUILDER_GROUP_OPERATION } from '../../stores/QueryBuilderGroupOperationHelper.js';
 import {
-  BasicValueSpecificationEditor,
   type QueryBuilderVariableDragSource,
   QUERY_BUILDER_VARIABLE_DND_TYPE,
+  EditableBasicValueSpecificationEditor,
 } from '../shared/BasicValueSpecificationEditor.js';
 import { QueryBuilderTelemetryHelper } from '../../__lib__/QueryBuilderTelemetryHelper.js';
 import { getPropertyChainName } from '../../stores/QueryBuilderPropertyEditorState.js';
@@ -350,6 +357,7 @@ export const buildFilterTreeWithExists = (
     undefined,
     filterConditionState,
   );
+  treeNode.setIsNewlyAdded(true);
   filterState.addNodeFromNode(treeNode, parentNode);
   if (targetDropNode instanceof QueryBuilderFilterTreeBlankConditionNodeData) {
     filterState.removeNodeAndPruneBranch(targetDropNode);
@@ -511,6 +519,7 @@ const buildFilterTree = (
       undefined,
       filterConditionState,
     );
+    treeNode.setIsNewlyAdded(true);
     // Check if there are any exists node present in the parent nodes of the target.
     // This would change the way we build the filter tree
     let cn: QueryBuilderFilterTreeNodeData | undefined = targetDropNode;
@@ -798,6 +807,10 @@ const QueryBuilderFilterConditionEditor = observer(
       cleanUpReloadValues,
     };
 
+    useEffect(() => {
+      node.setIsNewlyAdded(false);
+    }, [node]);
+
     return (
       <div
         className="dnd__entry__container"
@@ -856,11 +869,11 @@ const QueryBuilderFilterConditionEditor = observer(
                   isDragOver={isFilterValueDragOver}
                   label="Change Filter Value"
                 >
-                  <BasicValueSpecificationEditor
+                  <EditableBasicValueSpecificationEditor
                     valueSpecification={node.condition.value}
                     setValueSpecification={changeValueSpecification}
                     graph={graph}
-                    obseverContext={queryBuilderState.observerContext}
+                    observerContext={queryBuilderState.observerContext}
                     typeCheckOption={{
                       expectedType:
                         node.condition.propertyExpressionState
@@ -872,6 +885,7 @@ const QueryBuilderFilterConditionEditor = observer(
                     isConstant={queryBuilderState.constantState.isValueSpecConstant(
                       node.condition.value,
                     )}
+                    initializeAsEditable={node.isNewlyAdded}
                   />
                 </PanelEntryDropZonePlaceholder>
               </div>

package/src/components/result/QueryBuilderResultPanel.tsx

@@ -334,6 +334,7 @@ export const QueryBuilderResultPanel = observer(
         <MenuContentItem
           key={item.key}
           title={item.title ?? ''}
+          disabled={item.disableFunc?.(queryBuilderState) ?? false}
           onClick={() => {
             item.onClick(queryBuilderState);
           }}

package/src/components/result/tds/QueryBuilderTDSGridResult.tsx

@@ -22,7 +22,6 @@ import {
   DataGrid,
   type DataGridApi,
   type DataGridCellRange,
-  type DataGridColumnApi,
   type DataGridColumnDefinition,
   type DataGridGetContextMenuItemsParams,
   type DataGridIRowNode,
@@ -249,9 +248,7 @@ export const QueryBuilderTDSGridResult = observer(
     const applicationStore = useApplicationStore();
     const darkMode =
       !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled;
-    const [columnAPi, setColumnApi] = useState<DataGridColumnApi | undefined>(
-      undefined,
-    );
+    const [gridApi, setGridApi] = useState<DataGridApi | undefined>(undefined);
     const [aggFuncParams, setAggFuncParams] = useState<
       DataGridIAggFuncParams | undefined
     >(undefined);
@@ -262,12 +259,12 @@ export const QueryBuilderTDSGridResult = observer(
       : getColDefs(executionResult, resultState);
 
     const onSaveGridColumnState = (): void => {
-      if (!columnAPi) {
+      if (!gridApi) {
         return;
       }
       resultState.setGridConfig({
-        columns: columnAPi.getColumnState(),
-        isPivotModeEnabled: columnAPi.isPivotMode(),
+        columns: gridApi.getColumnState(),
+        isPivotModeEnabled: gridApi.isPivotMode(),
         isLocalModeEnabled: true,
         previewLimit: resultState.previewLimit,
         ...(resultState.wavgAggregationState?.weightedColumnIdPairs && {
@@ -368,7 +365,7 @@ export const QueryBuilderTDSGridResult = observer(
       ],
     );
 
-    const weightedColumnOptions = columnAPi
+    const weightedColumnOptions = gridApi
       ?.getColumns()
       ?.filter((c) => c.getColDef().cellDataType === 'number')
       .map((col) => ({
@@ -458,7 +455,7 @@ export const QueryBuilderTDSGridResult = observer(
 
     useEffect(() => {
       if (aggFuncParams) {
-        aggFuncParams.columnApi.setColumnAggFunc(
+        aggFuncParams.api.setColumnAggFunc(
           aggFuncParams.colDef.field!,
           QueryBuilderDataGridCustomAggregationFunction.WAVG,
         );
@@ -480,10 +477,12 @@ export const QueryBuilderTDSGridResult = observer(
             <DataGrid
               rowData={getRowDataFromExecutionResult(executionResult)}
               onGridReady={(params): void => {
-                setColumnApi(params.columnApi);
-                params.columnApi.setPivotMode(
-                  Boolean(resultState.gridConfig?.isPivotModeEnabled),
-                );
+                setGridApi(params.api);
+                params.api.updateGridOptions({
+                  pivotMode: Boolean(
+                    resultState.gridConfig?.isPivotModeEnabled,
+                  ),
+                });
               }}
               gridOptions={{
                 suppressScrollOnNewData: true,

package/src/components/result/tds/QueryBuilderTDSResultShared.tsx

@@ -316,7 +316,7 @@ const updateExistingPostFilterConditionNodeData = (
           .map((v) =>
             v instanceof EnumValueInstanceValue
               ? v.values.map((ef) => ef.value.name)
-              : (v as InstanceValue).values,
+              : v.values,
           )
           .flat()
           .includes(_cellData.value ?? data?.value);

package/src/components/result/tds/QueryBuilderTDSSimpleGridResult.tsx

@@ -114,11 +114,11 @@ const QueryResultCellRenderer = observer(
       ) {
         return undefined;
       }
-      if (params.columnApi.getColumnState()[colIndex]?.sort === 'asc') {
+      if (params.api.getColumnState()[colIndex]?.sort === 'asc') {
         resultState.executionResult.result.rows.sort((a, b) =>
           getTDSRowRankByColumnInAsc(a, b, colIndex),
         );
-      } else if (params.columnApi.getColumnState()[colIndex]?.sort === 'desc') {
+      } else if (params.api.getColumnState()[colIndex]?.sort === 'desc') {
         resultState.executionResult.result.rows.sort((a, b) =>
           getTDSRowRankByColumnInAsc(b, a, colIndex),
         );