@finos/legend-extension-dsl-data-space 6.1.11 → 6.1.12

package/src/components/query/DataSpaceQueryBuilder.tsx

@@ -0,0 +1,344 @@
+/**
+ * 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 {
+  CustomSelectorInput,
+  createFilter,
+  PURE_RuntimeIcon,
+  PlayIcon,
+  DropdownMenu,
+  MoreHorizontalIcon,
+  MenuContentItem,
+  MenuContent,
+  MenuContentItemIcon,
+  CheckIcon,
+  MenuContentItemLabel,
+} from '@finos/legend-art';
+import { observer } from 'mobx-react-lite';
+import { useApplicationStore } from '@finos/legend-application';
+import type { DataSpaceQueryBuilderState } from '../../stores/query/DataSpaceQueryBuilderState.js';
+import {
+  buildRuntimeValueOption,
+  getRuntimeOptionFormatter,
+  QueryBuilderClassSelector,
+} from '@finos/legend-application-query';
+import {
+  type Runtime,
+  getMappingCompatibleClasses,
+  getMappingCompatibleRuntimes,
+  PackageableElementExplicitReference,
+  RuntimePointer,
+} from '@finos/legend-graph';
+import type { DataSpaceInfo } from '../../stores/query/DataSpaceInfo.js';
+import { generateGAVCoordinates } from '@finos/legend-server-depot';
+import { useEffect, useMemo, useState } from 'react';
+import { debounce, guaranteeType } from '@finos/legend-shared';
+import { flowResult } from 'mobx';
+import type { DataSpaceExecutionContext } from '../../graph/metamodel/pure/model/packageableElements/dataSpace/DSLDataSpace_DataSpace.js';
+import { DataSpaceIcon } from '../DSLDataSpace_Icon.js';
+
+type DataSpaceOption = {
+  label: string;
+  value: DataSpaceInfo;
+};
+const buildDataSpaceOption = (value: DataSpaceInfo): DataSpaceOption => ({
+  label: value.title ?? value.name,
+  value,
+});
+
+type ExecutionContextOption = {
+  label: string;
+  value: DataSpaceExecutionContext;
+};
+const buildExecutionContextOption = (
+  value: DataSpaceExecutionContext,
+): ExecutionContextOption => ({
+  label: value.name,
+  value,
+});
+
+/**
+ * This setup panel supports cascading in order: Data-space -> Execution context (-> Runtime) -> Class
+ *
+ * In other words, we will only show:
+ * - For runtime selector: the list of compatible runtimes with the selected execution context mapping
+ * - For class selector: the list of compatible class with the selected execution context mapping
+ *
+ * See details on propagation/cascading in {@link DataSpaceQueryBuilderState}
+ */
+const DataSpaceQueryBuilderSetupPanelContent = observer(
+  (props: { queryBuilderState: DataSpaceQueryBuilderState }) => {
+    const { queryBuilderState } = props;
+    const applicationStore = useApplicationStore();
+    const [dataSpaceSearchText, setDataSpaceSearchText] = useState('');
+
+    // data space
+    const dataSpaceOptions =
+      queryBuilderState.dataSpaces.map(buildDataSpaceOption);
+    const selectedDataSpaceOption: DataSpaceOption = {
+      label:
+        queryBuilderState.dataSpace.title ?? queryBuilderState.dataSpace.name,
+      value: {
+        groupId: queryBuilderState.groupId,
+        artifactId: queryBuilderState.artifactId,
+        versionId: queryBuilderState.versionId,
+        title: queryBuilderState.dataSpace.title,
+        name: queryBuilderState.dataSpace.name,
+        path: queryBuilderState.dataSpace.path,
+        defaultExecutionContext:
+          queryBuilderState.dataSpace.defaultExecutionContext.name,
+      },
+    };
+    const onDataSpaceOptionChange = (option: DataSpaceOption): void => {
+      queryBuilderState.onDataSpaceChange(option.value);
+    };
+    const dataSpaceFilterOption = createFilter({
+      ignoreCase: true,
+      ignoreAccents: false,
+      stringify: (option: DataSpaceOption): string =>
+        `${option.label} - ${option.value.path}`,
+    });
+    const formatDataSpaceOptionLabel = (
+      option: DataSpaceOption,
+    ): React.ReactNode => (
+      <div
+        className="query-builder__setup__data-space__option"
+        title={`${option.label} - ${
+          option.value.path
+        } - ${generateGAVCoordinates(
+          option.value.groupId,
+          option.value.artifactId,
+          option.value.versionId,
+        )}`}
+      >
+        <div className="query-builder__setup__data-space__option__label">
+          {option.label}
+        </div>
+        <div className="query-builder__setup__data-space__option__path">
+          {option.value.path}
+        </div>
+        <div className="query-builder__setup__data-space__option__gav">
+          {generateGAVCoordinates(
+            option.value.groupId,
+            option.value.artifactId,
+            option.value.versionId,
+          )}
+        </div>
+      </div>
+    );
+
+    // data space search text
+    const debouncedLoadDataSpaces = useMemo(
+      () =>
+        debounce((input: string): void => {
+          flowResult(queryBuilderState.loadDataSpaces(input)).catch(
+            applicationStore.alertUnhandledError,
+          );
+        }, 500),
+      [applicationStore, queryBuilderState],
+    );
+    const onDataSpaceSearchTextChange = (value: string): void => {
+      if (value !== dataSpaceSearchText) {
+        setDataSpaceSearchText(value);
+        debouncedLoadDataSpaces.cancel();
+        debouncedLoadDataSpaces(value);
+      }
+    };
+
+    // execution context
+    const executionContextOptions =
+      queryBuilderState.dataSpace.executionContexts.map(
+        buildExecutionContextOption,
+      );
+    const selectedExecutionContextOption = buildExecutionContextOption(
+      queryBuilderState.executionContext,
+    );
+    const onExecutionContextOptionChange = (
+      option: ExecutionContextOption,
+    ): void => {
+      if (option.value === queryBuilderState.executionContext) {
+        return;
+      }
+      queryBuilderState.setExecutionContext(option.value);
+      queryBuilderState.propagateExecutionContextChange(option.value);
+      queryBuilderState.onExecutionContextChange?.(option.value);
+    };
+
+    // runtime
+    const runtimeOptions = getMappingCompatibleRuntimes(
+      queryBuilderState.executionContext.mapping.value,
+      queryBuilderState.graphManagerState.usableRuntimes,
+    )
+      .map(
+        (rt) =>
+          new RuntimePointer(PackageableElementExplicitReference.create(rt)),
+      )
+      .map(buildRuntimeValueOption);
+    const selectedRuntimeOption = queryBuilderState.runtimeValue
+      ? buildRuntimeValueOption(queryBuilderState.runtimeValue)
+      : null;
+    const changeRuntime = (option: { value: Runtime }): void => {
+      if (option.value === queryBuilderState.runtimeValue) {
+        return;
+      }
+      queryBuilderState.changeRuntime(option.value);
+      queryBuilderState.onRuntimeChange?.(option.value);
+    };
+    const runtimeFilterOption = createFilter({
+      ignoreCase: true,
+      ignoreAccents: false,
+      stringify: (option: { value: Runtime }): string =>
+        guaranteeType(option.value, RuntimePointer).packageableRuntime.value
+          .path,
+    });
+
+    // class
+    const classes = getMappingCompatibleClasses(
+      queryBuilderState.executionContext.mapping.value,
+      queryBuilderState.graphManagerState.usableClasses,
+    );
+
+    useEffect(() => {
+      flowResult(queryBuilderState.loadDataSpaces('')).catch(
+        applicationStore.alertUnhandledError,
+      );
+    }, [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>
+            <DropdownMenu
+              className="query-builder__setup__config-group__header__dropdown"
+              content={
+                <MenuContent>
+                  <MenuContentItem
+                    onClick={(): void =>
+                      queryBuilderState.setShowRuntimeSelector(
+                        !queryBuilderState.showRuntimeSelector,
+                      )
+                    }
+                  >
+                    <MenuContentItemIcon>
+                      {queryBuilderState.showRuntimeSelector ? (
+                        <CheckIcon />
+                      ) : null}
+                    </MenuContentItemIcon>
+                    <MenuContentItemLabel>
+                      Show Runtime Selector
+                    </MenuContentItemLabel>
+                  </MenuContentItem>
+                </MenuContent>
+              }
+              menuProps={{
+                anchorOrigin: { vertical: 'bottom', horizontal: 'right' },
+                transformOrigin: { vertical: 'top', horizontal: 'right' },
+              }}
+            >
+              <button
+                className="query-builder__setup__config-group__header__dropdown-trigger"
+                title="Show Settings..."
+              >
+                <MoreHorizontalIcon />
+              </button>
+            </DropdownMenu>
+          </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}
+                onInputChange={onDataSpaceSearchTextChange}
+                inputValue={dataSpaceSearchText}
+                onChange={onDataSpaceOptionChange}
+                value={selectedDataSpaceOption}
+                placeholder="Search for data space by name..."
+                escapeClearsValue={true}
+                darkMode={!applicationStore.TEMPORARY__isLightThemeEnabled}
+                filterOption={dataSpaceFilterOption}
+                formatOptionLabel={formatDataSpaceOptionLabel}
+              />
+            </div>
+            <div className="query-builder__setup__config-group__item">
+              <div
+                className="btn--sm query-builder__setup__config-group__item__label"
+                title="execution context"
+              >
+                <PlayIcon className="query-builder__setup__data-space__icon__execution-context" />
+              </div>
+              <CustomSelectorInput
+                className="panel__content__form__section__dropdown query-builder__setup__config-group__item__selector"
+                placeholder="Choose an execution context..."
+                options={executionContextOptions}
+                disabled={executionContextOptions.length <= 1}
+                onChange={onExecutionContextOptionChange}
+                value={selectedExecutionContextOption}
+                darkMode={!applicationStore.TEMPORARY__isLightThemeEnabled}
+              />
+            </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.TEMPORARY__isLightThemeEnabled}
+                  filterOption={runtimeFilterOption}
+                  formatOptionLabel={getRuntimeOptionFormatter({
+                    darkMode: !applicationStore.TEMPORARY__isLightThemeEnabled,
+                  })}
+                />
+              </div>
+            )}
+          </div>
+        </div>
+        <QueryBuilderClassSelector
+          queryBuilderState={queryBuilderState}
+          classes={classes}
+          onClassChange={queryBuilderState.onClassChange}
+          noMatchMessage="No compatible class found for specified execution context"
+        />
+      </>
+    );
+  },
+);
+
+export const renderDataSpaceQueryBuilderSetupPanelContent = (
+  queryBuilderState: DataSpaceQueryBuilderState,
+): React.ReactNode => (
+  <DataSpaceQueryBuilderSetupPanelContent
+    queryBuilderState={queryBuilderState}
+  />
+);

package/src/components/query/{DataSpaceQueryEditor.tsx → DataSpaceQueryCreator.tsx}

@@ -23,21 +23,21 @@ import {
 } from '@finos/legend-server-depot';
 import {
   LEGEND_QUERY_PATH_PARAM_TOKEN,
-  LEGEND_QUERY_QUERY_PARAM_TOKEN,
   QueryEditor,
   QueryEditorStoreContext,
   useLegendQueryApplicationStore,
   useLegendQueryBaseStore,
 } from '@finos/legend-application-query';
 import { useParams } from 'react-router';
-import { DataSpaceQueryEditorStore } from '../../stores/query/DataSpaceQueryEditorStore.js';
+import { DataSpaceQueryCreatorStore } from '../../stores/query/DataSpaceQueryCreatorStore.js';
 import {
-  type DataSpaceQueryEditorPathParams,
+  type DataSpaceQueryCreatorPathParams,
   type DataSpaceQueryEditorQueryParams,
-  DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN,
+  DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN,
+  DATA_SPACE_QUERY_CREATOR_QUERY_PARAM_TOKEN,
 } from '../../stores/query/DSLDataSpace_LegendQueryRouter.js';
 
-const DataSpaceQueryEditorStoreProvider: React.FC<{
+const DataSpaceQueryCreatorStoreProvider: React.FC<{
   children: React.ReactNode;
   gav: string;
   dataSpacePath: string;
@@ -58,7 +58,7 @@ const DataSpaceQueryEditorStoreProvider: React.FC<{
   const baseStore = useLegendQueryBaseStore();
   const store = useLocalObservable(
     () =>
-      new DataSpaceQueryEditorStore(
+      new DataSpaceQueryCreatorStore(
         applicationStore,
         depotServerClient,
         baseStore.pluginManager,
@@ -78,22 +78,22 @@ const DataSpaceQueryEditorStoreProvider: React.FC<{
   );
 };
 
-export const DataSpaceQueryEditor = observer(() => {
+export const DataSpaceQueryCreator = observer(() => {
   const applicationStore = useApplicationStore();
-  const params = useParams<DataSpaceQueryEditorPathParams>();
+  const params = useParams<DataSpaceQueryCreatorPathParams>();
   const gav = params[LEGEND_QUERY_PATH_PARAM_TOKEN.GAV];
   const dataSpacePath =
-    params[DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH];
+    params[DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH];
   const executionContext =
-    params[DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT];
+    params[DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT];
   const runtimePath = params[LEGEND_QUERY_PATH_PARAM_TOKEN.RUNTIME_PATH];
   const classPath = getQueryParameters<DataSpaceQueryEditorQueryParams>(
     applicationStore.navigator.getCurrentLocation(),
     true,
-  )[LEGEND_QUERY_QUERY_PARAM_TOKEN.CLASS_PATH];
+  )[DATA_SPACE_QUERY_CREATOR_QUERY_PARAM_TOKEN.CLASS_PATH];
 
   return (
-    <DataSpaceQueryEditorStoreProvider
+    <DataSpaceQueryCreatorStoreProvider
       gav={gav}
       dataSpacePath={dataSpacePath}
       executionContext={executionContext}
@@ -101,6 +101,6 @@ export const DataSpaceQueryEditor = observer(() => {
       classPath={classPath}
     >
       <QueryEditor />
-    </DataSpaceQueryEditorStoreProvider>
+    </DataSpaceQueryCreatorStoreProvider>
   );
 });

package/src/components/query/DataSpaceQuerySetup.tsx

@@ -34,16 +34,14 @@ import { debounce } from '@finos/legend-shared';
 import { flowResult } from 'mobx';
 import { observer } from 'mobx-react-lite';
 import { useEffect, useMemo, useRef, useState } from 'react';
-import type {
-  DataSpaceQuerySetupState,
-  DataSpaceContext,
-} from '../../stores/query/DataSpaceQuerySetupState.js';
+import type { DataSpaceQuerySetupState } from '../../stores/query/DataSpaceQuerySetupState.js';
 import { DataSpaceViewer } from '../DataSpaceViewer.js';
+import type { DataSpaceInfo } from '../../stores/query/DataSpaceInfo.js';
 
-type DataSpaceOption = { label: string; value: DataSpaceContext };
-const buildDataSpaceOption = (value: DataSpaceContext): DataSpaceOption => ({
+type DataSpaceOption = { label: string; value: DataSpaceInfo };
+const buildDataSpaceOption = (value: DataSpaceInfo): DataSpaceOption => ({
   label: value.title ?? value.name,
-  value: value,
+  value,
 });
 
 export const DataspaceQuerySetup = observer(
@@ -75,17 +73,15 @@ export const DataspaceQuerySetup = observer(
       querySetupState.setCurrentDataSpace(undefined);
     };
 
-    // query
+    // data space
     const dataSpaceOptions =
       querySetupState.dataSpaces.map(buildDataSpaceOption);
     const selectedDataSpaceOption = querySetupState.currentDataSpace
       ? buildDataSpaceOption(querySetupState.currentDataSpace)
       : null;
     const onDataSpaceOptionChange = (option: DataSpaceOption | null): void => {
-      if (option?.value !== querySetupState.currentDataSpace) {
-        querySetupState.setCurrentDataSpace(option?.value);
-        querySetupState.setDataSpaceViewerState(undefined);
-      }
+      querySetupState.setCurrentDataSpace(option?.value);
+      querySetupState.setDataSpaceViewerState(undefined);
     };
     const filterOption = createFilter({
       ignoreCase: true,
@@ -93,7 +89,7 @@ export const DataspaceQuerySetup = observer(
       stringify: (option: DataSpaceOption): string =>
         `${option.label} - ${option.value.path}`,
     });
-    const formatQueryOptionLabel = (
+    const formatDataSpaceOptionLabel = (
       option: DataSpaceOption,
     ): React.ReactNode => (
       <div
@@ -201,7 +197,7 @@ export const DataspaceQuerySetup = observer(
               escapeClearsValue={true}
               darkMode={true}
               filterOption={filterOption}
-              formatOptionLabel={formatQueryOptionLabel}
+              formatOptionLabel={formatDataSpaceOptionLabel}
             />
             <button
               className={clsx('query-setup__data-space__use-snapshot-btn', {

package/src/components/studio/DSLDataSpace_LegendStudioApplicationPlugin.tsx

@@ -33,7 +33,6 @@ import {
   UnsupportedElementEditorState,
   LegendStudioApplicationPlugin,
 } from '@finos/legend-application-studio';
-import { SquareIcon } from '@finos/legend-art';
 import {
   PackageableElementExplicitReference,
   stub_Mapping,
@@ -51,6 +50,7 @@ import {
 } from '../../graphManager/DSLDataSpace_PureGraphManagerPlugin.js';
 import { SIMPLE_DATA_SPACE_SNIPPET } from './DSLDataSpace_CodeSnippets.js';
 import type { DocumentationEntry } from '@finos/legend-application';
+import { DataSpaceIcon } from '../DSLDataSpace_Icon.js';
 
 const DATA_SPACE_ELEMENT_TYPE = 'DATA SPACE';
 const DATA_SPACE_ELEMENT_PROJECT_EXPLORER_DND_TYPE =
@@ -90,11 +90,7 @@ export class DSLDataSpace_LegendStudioApplicationPlugin
     return [
       (type: string): React.ReactNode | undefined => {
         if (type === DATA_SPACE_ELEMENT_TYPE) {
-          return (
-            <div className="icon icon--data-space">
-              <SquareIcon />
-            </div>
-          );
+          return <DataSpaceIcon />;
         }
         return undefined;
       },

package/src/stores/query/DSLDataSpace_LegendQueryRouter.ts

@@ -15,32 +15,33 @@
  */
 
 import { generateExtensionUrlPattern } from '@finos/legend-application';
-import {
-  LEGEND_QUERY_PATH_PARAM_TOKEN,
-  LEGEND_QUERY_QUERY_PARAM_TOKEN,
-} from '@finos/legend-application-query';
+import { LEGEND_QUERY_PATH_PARAM_TOKEN } from '@finos/legend-application-query';
 import { generateGAVCoordinates } from '@finos/legend-server-depot';
 import { generatePath } from 'react-router';
 
-export enum DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN {
+export enum DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN {
   DATA_SPACE_PATH = 'dataSpacePath',
   EXECUTION_CONTEXT = 'executionContext',
 }
 
-export interface DataSpaceQueryEditorPathParams {
+export enum DATA_SPACE_QUERY_CREATOR_QUERY_PARAM_TOKEN {
+  CLASS_PATH = 'class',
+}
+
+export interface DataSpaceQueryCreatorPathParams {
   [LEGEND_QUERY_PATH_PARAM_TOKEN.GAV]: string;
-  [DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH]: string;
-  [DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT]: string;
+  [DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH]: string;
+  [DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT]: string;
   [LEGEND_QUERY_PATH_PARAM_TOKEN.RUNTIME_PATH]?: string;
 }
 
 export interface DataSpaceQueryEditorQueryParams {
-  [LEGEND_QUERY_QUERY_PARAM_TOKEN.CLASS_PATH]?: string;
+  [DATA_SPACE_QUERY_CREATOR_QUERY_PARAM_TOKEN.CLASS_PATH]?: string;
 }
 
-export const DATA_SPACE_QUERY_EDITOR_ROUTE_PATTERN = `/dataspace/:${LEGEND_QUERY_PATH_PARAM_TOKEN.GAV}/:${DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH}/:${DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT}/:${LEGEND_QUERY_PATH_PARAM_TOKEN.RUNTIME_PATH}?`;
+export const CREATE_QUERY_FROM_DATA_SPACE_ROUTE_PATTERN = `/create-from-dataspace/:${LEGEND_QUERY_PATH_PARAM_TOKEN.GAV}/:${DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH}/:${DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT}/:${LEGEND_QUERY_PATH_PARAM_TOKEN.RUNTIME_PATH}?`;
 
-export const generateDataSpaceQueryEditorRoute = (
+export const generateDataSpaceQueryCreatorRoute = (
   groupId: string,
   artifactId: string,
   versionId: string,
@@ -50,20 +51,21 @@ export const generateDataSpaceQueryEditorRoute = (
   classPath?: string | undefined,
 ): string =>
   `${generatePath(
-    generateExtensionUrlPattern(DATA_SPACE_QUERY_EDITOR_ROUTE_PATTERN),
+    generateExtensionUrlPattern(CREATE_QUERY_FROM_DATA_SPACE_ROUTE_PATTERN),
     {
       [LEGEND_QUERY_PATH_PARAM_TOKEN.GAV]: generateGAVCoordinates(
         groupId,
         artifactId,
         versionId,
       ),
-      [DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH]: dataSpacePath,
-      [DATA_SPACE_QUERY_EDITOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT]:
+      [DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.DATA_SPACE_PATH]:
+        dataSpacePath,
+      [DATA_SPACE_QUERY_CREATOR_PATH_PARAM_TOKEN.EXECUTION_CONTEXT]:
         executionContextKey,
       [LEGEND_QUERY_PATH_PARAM_TOKEN.RUNTIME_PATH]: runtimePath,
     },
   )}${
     classPath
-      ? `?${LEGEND_QUERY_QUERY_PARAM_TOKEN.CLASS_PATH}=${classPath}`
+      ? `?${DATA_SPACE_QUERY_CREATOR_QUERY_PARAM_TOKEN.CLASS_PATH}=${classPath}`
       : ''
   }`;

package/src/stores/query/DataSpaceInfo.ts

@@ -0,0 +1,57 @@
+/**
+ * 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 {
+  SNAPSHOT_VERSION_ALIAS,
+  type StoredEntity,
+} from '@finos/legend-server-depot';
+import { isString } from '@finos/legend-shared';
+import { extractEntityNameFromPath } from '@finos/legend-storage';
+
+export interface DataSpaceInfo {
+  groupId: string;
+  artifactId: string;
+  versionId: string;
+  title: string | undefined;
+  name: string;
+  path: string;
+  /**
+   * NOTE: technically, this should be always available, but we must not
+   * assume that no dataspace is marlformed, so we leave it as optional
+   */
+  defaultExecutionContext: string | undefined;
+}
+
+export const extractDataSpaceInfo = (
+  storedEntity: StoredEntity,
+  isSnapshot: boolean,
+): DataSpaceInfo => ({
+  groupId: storedEntity.groupId,
+  artifactId: storedEntity.artifactId,
+  versionId: isSnapshot ? SNAPSHOT_VERSION_ALIAS : storedEntity.versionId,
+  path: storedEntity.entity.path,
+  name: extractEntityNameFromPath(storedEntity.entity.path),
+  title: isString(storedEntity.entity.content.title)
+    ? storedEntity.entity.content.title
+    : undefined,
+  // NOTE: we don't want to assert the existence of this field even when it
+  // is required in the specification of data space, so we don't throw error here
+  defaultExecutionContext: isString(
+    storedEntity.entity.content.defaultExecutionContext,
+  )
+    ? storedEntity.entity.content.defaultExecutionContext
+    : undefined,
+});