@finos/legend-extension-dsl-data-space 10.3.10 → 10.3.12

package/src/components/query-builder/DataSpaceQueryBuilder.tsx

@@ -17,16 +17,16 @@
 import {
   CustomSelectorInput,
   createFilter,
-  PURE_RuntimeIcon,
-  PlayIcon,
   DropdownMenu,
-  MoreHorizontalIcon,
   MenuContentItem,
   MenuContent,
   MenuContentItemIcon,
   CheckIcon,
   MenuContentItemLabel,
   SearchIcon,
+  PanelHeaderActions,
+  PanelHeader,
+  MoreVerticalIcon,
 } from '@finos/legend-art';
 import { observer } from 'mobx-react-lite';
 import { useApplicationStore } from '@finos/legend-application';
@@ -51,7 +51,6 @@ import { useEffect } from 'react';
 import { guaranteeType } from '@finos/legend-shared';
 import { flowResult } from 'mobx';
 import { type DataSpaceExecutionContext } from '../../graph/metamodel/pure/model/packageableElements/dataSpace/DSL_DataSpace_DataSpace.js';
-import { DataSpaceIcon } from '../shared/DSL_DataSpace_Icon.js';
 import { DataSpaceAdvancedSearchModal } from './DataSpaceAdvancedSearchModal.js';
 
 export type DataSpaceOption = {
@@ -128,8 +127,9 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
     const applicationStore = useApplicationStore();
 
     // data space
-    const dataSpaceOptions =
-      queryBuilderState.dataSpaces.map(buildDataSpaceOption);
+    const dataSpaceOptions = queryBuilderState.dataSpaces
+      .map(buildDataSpaceOption)
+      .sort((a, b) => a.label.localeCompare(b.label));
     const selectedDataSpaceOption: DataSpaceOption = {
       label:
         queryBuilderState.dataSpace.title ?? queryBuilderState.dataSpace.name,
@@ -153,9 +153,9 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
 
     // execution context
     const executionContextOptions =
-      queryBuilderState.dataSpace.executionContexts.map(
-        buildExecutionContextOption,
-      );
+      queryBuilderState.dataSpace.executionContexts
+        .map(buildExecutionContextOption)
+        .sort((a, b) => a.label.localeCompare(b.label));
     const selectedExecutionContextOption = buildExecutionContextOption(
       queryBuilderState.executionContext,
     );
@@ -179,7 +179,8 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
         (rt) =>
           new RuntimePointer(PackageableElementExplicitReference.create(rt)),
       )
-      .map(buildRuntimeValueOption);
+      .map(buildRuntimeValueOption)
+      .sort((a, b) => a.label.localeCompare(b.label));
     const selectedRuntimeOption = queryBuilderState.executionContextState
       .runtimeValue
       ? buildRuntimeValueOption(
@@ -217,14 +218,11 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
     }, [queryBuilderState, applicationStore]);
 
     return (
-      <>
-        <div className="query-builder__setup__config-group">
-          <div className="query-builder__setup__config-group__header">
-            <div className="query-builder__setup__config-group__header__title">
-              data space execution context
-            </div>
+      <div className="query-builder__setup__config-group">
+        <PanelHeader title="properties">
+          <PanelHeaderActions>
             <DropdownMenu
-              className="query-builder__setup__config-group__header__dropdown-trigger"
+              className="panel__header__action query-builder__setup__config-group__header__dropdown-trigger"
               title="Show Settings..."
               content={
                 <MenuContent>
@@ -251,113 +249,119 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
                 transformOrigin: { vertical: 'top', horizontal: 'right' },
               }}
             >
-              <MoreHorizontalIcon />
+              <MoreVerticalIcon className="query-builder__icon__more-options" />
             </DropdownMenu>
+          </PanelHeaderActions>
+        </PanelHeader>
+        <div className="query-builder__setup__config-group__content">
+          <div className="query-builder__setup__config-group__item">
+            <label
+              className="btn--sm query-builder__setup__config-group__item__label"
+              title="data space"
+              htmlFor="query-builder__setup__data-space-selector"
+            >
+              Data Space
+            </label>
+            <CustomSelectorInput
+              inputId="query-builder__setup__data-space-selector"
+              className="panel__content__form__section__dropdown query-builder__setup__config-group__item__selector"
+              options={dataSpaceOptions}
+              isLoading={queryBuilderState.loadDataSpacesState.isInProgress}
+              onChange={onDataSpaceOptionChange}
+              value={selectedDataSpaceOption}
+              placeholder="Search for data space..."
+              escapeClearsValue={true}
+              darkMode={
+                !applicationStore.layoutService
+                  .TEMPORARY__isLightColorThemeEnabled
+              }
+              formatOptionLabel={formatDataSpaceOptionLabel}
+            />
+            {queryBuilderState.isAdvancedDataSpaceSearchEnabled && (
+              <>
+                <button
+                  tabIndex={-1}
+                  className="query-builder__setup__data-space-searcher__btn btn--dark"
+                  onClick={openDataSpaceAdvancedSearch}
+                  title="Open advanced search for data space..."
+                >
+                  <SearchIcon />
+                </button>
+                {queryBuilderState.advancedSearchState && (
+                  <DataSpaceAdvancedSearchModal
+                    searchState={queryBuilderState.advancedSearchState}
+                    onClose={() => queryBuilderState.hideAdvancedSearchPanel()}
+                  />
+                )}
+              </>
+            )}
           </div>
-          <div className="query-builder__setup__config-group__content">
-            <div className="query-builder__setup__config-group__item">
-              <div
-                className="btn--sm query-builder__setup__config-group__item__label"
-                title="data space"
-              >
-                <DataSpaceIcon />
-              </div>
-              <CustomSelectorInput
-                className="panel__content__form__section__dropdown query-builder__setup__config-group__item__selector"
-                options={dataSpaceOptions}
-                isLoading={queryBuilderState.loadDataSpacesState.isInProgress}
-                onChange={onDataSpaceOptionChange}
-                value={selectedDataSpaceOption}
-                placeholder="Search for data space..."
-                escapeClearsValue={true}
-                darkMode={
-                  !applicationStore.layoutService
-                    .TEMPORARY__isLightColorThemeEnabled
-                }
-                formatOptionLabel={formatDataSpaceOptionLabel}
-              />
-              {queryBuilderState.isAdvancedDataSpaceSearchEnabled && (
-                <>
-                  <button
-                    tabIndex={-1}
-                    className="query-builder__setup__data-space-searcher__btn btn--dark"
-                    onClick={openDataSpaceAdvancedSearch}
-                    title="Open advanced search for data space..."
-                  >
-                    <SearchIcon />
-                  </button>
-                  {queryBuilderState.advancedSearchState && (
-                    <DataSpaceAdvancedSearchModal
-                      searchState={queryBuilderState.advancedSearchState}
-                      onClose={() =>
-                        queryBuilderState.hideAdvancedSearchPanel()
-                      }
-                    />
-                  )}
-                </>
-              )}
-            </div>
+          <div className="query-builder__setup__config-group__item">
+            <label
+              className="btn--sm query-builder__setup__config-group__item__label"
+              title="execution context"
+              htmlFor="query-builder__setup__context-selector"
+            >
+              Context
+            </label>
+            <CustomSelectorInput
+              inputId="query-builder__setup__context-selector"
+              className="panel__content__form__section__dropdown query-builder__setup__config-group__item__selector"
+              placeholder="Choose an execution context..."
+              options={executionContextOptions}
+              disabled={
+                executionContextOptions.length < 1 ||
+                (executionContextOptions.length === 1 &&
+                  Boolean(selectedExecutionContextOption))
+              }
+              onChange={onExecutionContextOptionChange}
+              value={selectedExecutionContextOption}
+              darkMode={
+                !applicationStore.layoutService
+                  .TEMPORARY__isLightColorThemeEnabled
+              }
+            />
+          </div>
+          {queryBuilderState.showRuntimeSelector && (
             <div className="query-builder__setup__config-group__item">
-              <div
+              <label
                 className="btn--sm query-builder__setup__config-group__item__label"
-                title="execution context"
+                title="runtime"
+                htmlFor="query-builder__setup__runtime-selector"
               >
-                <PlayIcon className="query-builder__setup__data-space__icon__execution-context" />
-              </div>
+                Runtime
+              </label>
               <CustomSelectorInput
+                inputId="query-builder__setup__runtime-selector"
                 className="panel__content__form__section__dropdown query-builder__setup__config-group__item__selector"
-                placeholder="Choose an execution context..."
-                options={executionContextOptions}
-                disabled={
-                  executionContextOptions.length < 1 ||
-                  (executionContextOptions.length === 1 &&
-                    Boolean(selectedExecutionContextOption))
-                }
-                onChange={onExecutionContextOptionChange}
-                value={selectedExecutionContextOption}
+                placeholder="Choose a runtime..."
+                noMatchMessage="No compatible runtime found for specified execution context"
+                options={runtimeOptions}
+                onChange={changeRuntime}
+                value={selectedRuntimeOption}
                 darkMode={
                   !applicationStore.layoutService
                     .TEMPORARY__isLightColorThemeEnabled
                 }
+                filterOption={runtimeFilterOption}
+                formatOptionLabel={getRuntimeOptionFormatter({
+                  darkMode:
+                    !applicationStore.layoutService
+                      .TEMPORARY__isLightColorThemeEnabled,
+                })}
               />
             </div>
-            {queryBuilderState.showRuntimeSelector && (
-              <div className="query-builder__setup__config-group__item">
-                <div
-                  className="btn--sm query-builder__setup__config-group__item__label"
-                  title="runtime"
-                >
-                  <PURE_RuntimeIcon />
-                </div>
-                <CustomSelectorInput
-                  className="panel__content__form__section__dropdown query-builder__setup__config-group__item__selector"
-                  placeholder="Choose a runtime..."
-                  noMatchMessage="No compatible runtime found for specified execution context"
-                  options={runtimeOptions}
-                  onChange={changeRuntime}
-                  value={selectedRuntimeOption}
-                  darkMode={
-                    !applicationStore.layoutService
-                      .TEMPORARY__isLightColorThemeEnabled
-                  }
-                  filterOption={runtimeFilterOption}
-                  formatOptionLabel={getRuntimeOptionFormatter({
-                    darkMode:
-                      !applicationStore.layoutService
-                        .TEMPORARY__isLightColorThemeEnabled,
-                  })}
-                />
-              </div>
-            )}
+          )}
+          <div className="query-builder__setup__config-group__item">
+            <QueryBuilderClassSelector
+              queryBuilderState={queryBuilderState}
+              classes={classes}
+              onClassChange={queryBuilderState.onClassChange}
+              noMatchMessage="No compatible entity found for specified execution context"
+            />
           </div>
         </div>
-        <QueryBuilderClassSelector
-          queryBuilderState={queryBuilderState}
-          classes={classes}
-          onClassChange={queryBuilderState.onClassChange}
-          noMatchMessage="No compatible class found for specified execution context"
-        />
-      </>
+      </div>
     );
   },
 );

package/src/stores/DataSpaceModelsDocumentationState.ts

@@ -307,10 +307,10 @@ const buildPackageFilterTreeData = (
             entry instanceof DataSpaceClassDocumentationEntry
               ? CORE_PURE_PATH.CLASS
               : entry instanceof DataSpaceEnumerationDocumentationEntry
-              ? CORE_PURE_PATH.ENUMERATION
-              : entry instanceof DataSpaceAssociationDocumentationEntry
-              ? CORE_PURE_PATH.ASSOCIATION
-              : undefined,
+                ? CORE_PURE_PATH.ENUMERATION
+                : entry instanceof DataSpaceAssociationDocumentationEntry
+                  ? CORE_PURE_PATH.ASSOCIATION
+                  : undefined,
           );
         } else {
           node = new ModelsDocumentationFilterTreePackageNodeData(

package/src/stores/query-builder/DataSpaceQueryBuilderState.ts

@@ -17,9 +17,10 @@
 import { type GenericLegendApplicationStore } from '@finos/legend-application';
 import {
   type QueryBuilderConfig,
-  QueryBuilderState,
   type QuerySDLC,
   type QueryBuilderWorkflowState,
+  type QueryBuilderActionConfig,
+  QueryBuilderState,
 } from '@finos/legend-query-builder';
 import {
   type GraphManagerState,
@@ -155,6 +156,7 @@ export class DataSpaceQueryBuilderState extends QueryBuilderState {
     graphManagerState: GraphManagerState,
     depotServerClient: DepotServerClient,
     workflow: QueryBuilderWorkflowState,
+    actionConfig: QueryBuilderActionConfig,
     dataSpace: DataSpace,
     executionContext: DataSpaceExecutionContext,
     onDataSpaceChange: (val: DataSpaceInfo) => void,
@@ -195,6 +197,7 @@ export class DataSpaceQueryBuilderState extends QueryBuilderState {
     this.onClassChange = onClassChange;
     this.isAdvancedDataSpaceSearchEnabled = isAdvancedDataSpaceSearchEnabled;
     this.dataSpaceAnalysisResult = dataSpaceAnalysisResult;
+    this.workflowState.updateActionConfig(actionConfig);
   }
 
   override get sideBarClassName(): string | undefined {

package/tsconfig.json

@@ -24,7 +24,23 @@
     "outDir": "./lib",
     "tsBuildInfoFile": "./build/prod.tsbuildinfo",
     "rootDir": "./src",
-    "jsx": "react-jsx"
+    "jsx": "react-jsx",
+    "moduleResolution": "nodenext",
+    "moduleDetection": "force",
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "preserveConstEnums": true,
+    "incremental": true,
+    "useDefineForClassFields": true,
+    "noImplicitAny": true,
+    "noImplicitThis": true,
+    "strictNullChecks": true,
+    "strictFunctionTypes": true,
+    "strictBindCallApply": true,
+    "strictPropertyInitialization": true,
+    "alwaysStrict": true,
+    "useUnknownInCatchVariables": true
   },
   "references": [
     {

package/tsconfig.package.json

@@ -23,7 +23,23 @@
     "forceConsistentCasingInFileNames": true,
     "outDir": "./lib",
     "tsBuildInfoFile": "./build/package.tsbuildinfo",
-    "rootDir": "./"
+    "rootDir": "./",
+    "moduleResolution": "nodenext",
+    "moduleDetection": "force",
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "allowSyntheticDefaultImports": true,
+    "preserveConstEnums": true,
+    "incremental": true,
+    "useDefineForClassFields": true,
+    "noImplicitAny": true,
+    "noImplicitThis": true,
+    "strictNullChecks": true,
+    "strictFunctionTypes": true,
+    "strictBindCallApply": true,
+    "strictPropertyInitialization": true,
+    "alwaysStrict": true,
+    "useUnknownInCatchVariables": true
   },
   "files": [
     "./package.json"