@finos/legend-extension-dsl-data-space 10.4.252 → 10.4.254

package/src/components/DataSpaceDescription.tsx

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { AnchorLinkIcon } from '@finos/legend-art';
+import { AnchorLinkIcon, ExpandMoreIcon, clsx } from '@finos/legend-art';
 import { type DataSpaceViewerState } from '../stores/DataSpaceViewerState.js';
 import { observer } from 'mobx-react-lite';
 import { DataSpaceWikiPlaceholder } from './DataSpacePlaceholder.js';
@@ -33,6 +33,14 @@ export const DataSpaceDescription = observer(
     const anchor = generateAnchorForActivity(
       DATA_SPACE_VIEWER_ACTIVITY_MODE.DESCRIPTION,
     );
+    const isCollapsed =
+      dataSpaceViewerState.layoutState.sectionCollapseState.isSectionCollapsed(
+        anchor,
+      );
+    const toggleCollapse = (): void =>
+      dataSpaceViewerState.layoutState.sectionCollapseState.toggleSectionCollapse(
+        anchor,
+      );
 
     useEffect(() => {
       if (sectionRef.current) {
@@ -48,6 +56,22 @@ export const DataSpaceDescription = observer(
       <div ref={sectionRef} className="data-space__viewer__wiki__section">
         <div className="data-space__viewer__wiki__section__header">
           <div className="data-space__viewer__wiki__section__header__label">
+            <button
+              className="data-space__viewer__wiki__section__header__caret-btn"
+              tabIndex={-1}
+              onClick={toggleCollapse}
+              title={isCollapsed ? 'Expand' : 'Collapse'}
+            >
+              <ExpandMoreIcon
+                className={clsx(
+                  'data-space__viewer__wiki__section__header__caret',
+                  {
+                    'data-space__viewer__wiki__section__header__caret--collapsed':
+                      isCollapsed,
+                  },
+                )}
+              />
+            </button>
             Description
             <button
               className="data-space__viewer__wiki__section__header__anchor"
@@ -58,20 +82,22 @@ export const DataSpaceDescription = observer(
             </button>
           </div>
         </div>
-        <div className="data-space__viewer__wiki__section__content">
-          {analysisResult.description !== undefined && (
-            <div className="data-space__viewer__description">
-              <div className="data-space__viewer__description__content">
-                <DataSpaceMarkdownTextViewer
-                  value={analysisResult.description}
-                />
+        {!isCollapsed && (
+          <div className="data-space__viewer__wiki__section__content">
+            {analysisResult.description !== undefined && (
+              <div className="data-space__viewer__description">
+                <div className="data-space__viewer__description__content">
+                  <DataSpaceMarkdownTextViewer
+                    value={analysisResult.description}
+                  />
+                </div>
               </div>
-            </div>
-          )}
-          {analysisResult.description === undefined && (
-            <DataSpaceWikiPlaceholder message="(not specified)" />
-          )}
-        </div>
+            )}
+            {analysisResult.description === undefined && (
+              <DataSpaceWikiPlaceholder message="(not specified)" />
+            )}
+          </div>
+        )}
       </div>
     );
   },

package/src/components/DataSpaceInfoPanel.tsx

@@ -71,12 +71,12 @@ export const DataSpaceInfoPanel = observer(
               </div>
               <div className="data-space__viewer__info__section__entry">
                 <div className="data-space__viewer__info__project-info__label">
-                  Data Product
+                  Data Space
                 </div>
                 <button
                   className="data-space__viewer__info__project-info__value"
                   tabIndex={-1}
-                  title="Click to View Data Product"
+                  title="Click to View Data Space"
                   onClick={viewDataSpaceInProject}
                 >
                   {analysisResult.path}
@@ -84,7 +84,7 @@ export const DataSpaceInfoPanel = observer(
                 <button
                   className="data-space__viewer__info__project-info__link"
                   tabIndex={-1}
-                  title="Edit Data Product"
+                  title="Edit Data Space"
                   onClick={viewDataSpaceInSDLCProject}
                 >
                   <PencilIcon />
@@ -92,7 +92,7 @@ export const DataSpaceInfoPanel = observer(
                 <button
                   className="data-space__viewer__info__project-info__link"
                   tabIndex={-1}
-                  title="View Data Product"
+                  title="View Data Space"
                   onClick={viewDataSpaceInProject}
                 >
                   <ExternalLinkIcon />

package/src/components/DataSpaceLegendAISchema.ts

@@ -55,6 +55,7 @@ import {
 import {
   DataSpaceSupportEmail,
   DataSpaceSupportCombinedInfo,
+  DataSpaceSupportFullInfo,
 } from '../graph/metamodel/pure/model/packageableElements/dataSpace/DSL_DataSpace_DataSpace.js';
 
 const MAX_QUERY_SCAN_LENGTH = 5_000;
@@ -392,6 +393,10 @@ export function extractMetadataFromDataSpaceAnalysis(
     supportInfoText = result.supportInfo.address;
   } else if (result.supportInfo instanceof DataSpaceSupportCombinedInfo) {
     supportInfoText = (result.supportInfo.emails ?? []).join(', ');
+  } else if (result.supportInfo instanceof DataSpaceSupportFullInfo) {
+    supportInfoText = (result.supportInfo.emails ?? [])
+      .map((email) => email.address)
+      .join(', ');
   }
 
   const metadata: LegendAIProductMetadata = {

package/src/components/DataSpaceQuickStart.tsx

@@ -21,6 +21,7 @@ import {
   CodeIcon,
   CopyIcon,
   DataAccessIcon,
+  ExpandMoreIcon,
   LegendLogo,
   MoreVerticalIcon,
   QuestionCircleIcon,
@@ -470,6 +471,14 @@ const DataSpaceExecutableAnalysisResultView = observer(
     const executableAnalysisResult = executableState.value;
     const quickStartRef = useRef<HTMLDivElement>(null);
     const anchor = generateAnchorForQuickStart(executableAnalysisResult);
+    const isCollapsed =
+      dataSpaceViewerState.layoutState.sectionCollapseState.isSectionCollapsed(
+        anchor,
+      );
+    const toggleCollapse = (): void =>
+      dataSpaceViewerState.layoutState.sectionCollapseState.toggleSectionCollapse(
+        anchor,
+      );
 
     useEffect(() => {
       if (quickStartRef.current) {
@@ -501,6 +510,22 @@ const DataSpaceExecutableAnalysisResultView = observer(
     return (
       <div ref={quickStartRef} className="data-space__viewer__quickstart__item">
         <div className="data-space__viewer__quickstart__item__header">
+          <button
+            className="data-space__viewer__quickstart__item__header__caret-btn"
+            tabIndex={-1}
+            onClick={toggleCollapse}
+            title={isCollapsed ? 'Expand' : 'Collapse'}
+          >
+            <ExpandMoreIcon
+              className={clsx(
+                'data-space__viewer__quickstart__item__header__caret',
+                {
+                  'data-space__viewer__quickstart__item__header__caret--collapsed':
+                    isCollapsed,
+                },
+              )}
+            />
+          </button>
           <div className="data-space__viewer__quickstart__item__header__title">
             {executableAnalysisResult.title}
           </div>
@@ -515,21 +540,25 @@ const DataSpaceExecutableAnalysisResultView = observer(
             <AnchorLinkIcon />
           </button>
         </div>
-        {executableAnalysisResult.description !== undefined && (
-          <div className="data-space__viewer__quickstart__item__description">
-            <DataSpaceMarkdownTextViewer
-              value={executableAnalysisResult.description}
-            />
-          </div>
-        )}
-        {(executableState.resultState instanceof
-          DataSpaceExecutableTDSResultState ||
-          executableState.resultState instanceof
-            DataSpaceExecutableRelationResultState) && (
-          <DataSpaceExecutableResultView
-            executableState={executableState}
-            resultState={executableState.resultState}
-          />
+        {!isCollapsed && (
+          <>
+            {executableAnalysisResult.description !== undefined && (
+              <div className="data-space__viewer__quickstart__item__description">
+                <DataSpaceMarkdownTextViewer
+                  value={executableAnalysisResult.description}
+                />
+              </div>
+            )}
+            {(executableState.resultState instanceof
+              DataSpaceExecutableTDSResultState ||
+              executableState.resultState instanceof
+                DataSpaceExecutableRelationResultState) && (
+              <DataSpaceExecutableResultView
+                executableState={executableState}
+                resultState={executableState.resultState}
+              />
+            )}
+          </>
         )}
       </div>
     );
@@ -546,6 +575,17 @@ export const DataSpaceQuickStart = observer(
     const anchor = generateAnchorForActivity(
       DATA_SPACE_VIEWER_ACTIVITY_MODE.QUICK_START,
     );
+    const executableAnchors = dataSpaceViewerState.executableStates.map(
+      (executableState) => generateAnchorForQuickStart(executableState.value),
+    );
+    const isCollapsed =
+      dataSpaceViewerState.layoutState.sectionCollapseState.areAllSectionsCollapsed(
+        executableAnchors,
+      );
+    const toggleCollapse = (): void =>
+      dataSpaceViewerState.layoutState.sectionCollapseState.toggleAllSectionsCollapse(
+        executableAnchors,
+      );
 
     useEffect(() => {
       if (sectionRef.current) {
@@ -569,6 +609,24 @@ export const DataSpaceQuickStart = observer(
       <div ref={sectionRef} className="data-space__viewer__wiki__section">
         <div className="data-space__viewer__wiki__section__header">
           <div className="data-space__viewer__wiki__section__header__label">
+            {executableAnchors.length > 0 && (
+              <button
+                className="data-space__viewer__wiki__section__header__caret-btn"
+                tabIndex={-1}
+                onClick={toggleCollapse}
+                title={isCollapsed ? 'Expand All' : 'Collapse All'}
+              >
+                <ExpandMoreIcon
+                  className={clsx(
+                    'data-space__viewer__wiki__section__header__caret',
+                    {
+                      'data-space__viewer__wiki__section__header__caret--collapsed':
+                        isCollapsed,
+                    },
+                  )}
+                />
+              </button>
+            )}
             Quick Start
             <button
               className="data-space__viewer__wiki__section__header__anchor"

package/src/components/DataSpaceSupportPanel.tsx

@@ -25,8 +25,10 @@ import {
   SupportIcon,
 } from '@finos/legend-art';
 import {
+  type DataSpaceLink,
   DataSpaceSupportCombinedInfo,
   DataSpaceSupportEmail,
+  DataSpaceSupportFullInfo,
 } from '../graph/metamodel/pure/model/packageableElements/dataSpace/DSL_DataSpace_DataSpace.js';
 import { type DataSpaceViewerState } from '../stores/DataSpaceViewerState.js';
 
@@ -160,6 +162,122 @@ const DataSpaceSupportCombinedInfoViewer = observer(
   },
 );
 
+const DataSpaceSupportLinkEntry = observer(
+  (props: {
+    label: string;
+    link: DataSpaceLink | undefined;
+    iconClassName?: string | undefined;
+    icon: React.ReactNode;
+  }) => {
+    const { label, link, iconClassName, icon } = props;
+
+    return (
+      <div className="data-space__viewer__support__entry" title={label}>
+        <div
+          className={`data-space__viewer__support__entry__icon${
+            iconClassName ? ` ${iconClassName}` : ''
+          }`}
+        >
+          {icon}
+        </div>
+        {link ? (
+          <a
+            href={link.url}
+            className="data-space__viewer__support__entry__content"
+          >
+            {link.label ?? link.url}
+          </a>
+        ) : (
+          <div className="data-space__viewer__support__entry__content">
+            (not specified)
+          </div>
+        )}
+      </div>
+    );
+  },
+);
+
+const DataSpaceSupportFullInfoViewer = observer(
+  (props: {
+    dataSpaceViewerState: DataSpaceViewerState;
+    supportInfo: DataSpaceSupportFullInfo;
+  }) => {
+    const { supportInfo } = props;
+
+    return (
+      <>
+        <div className="data-space__viewer__support__section">
+          <DataSpaceSupportLinkEntry
+            label="Website"
+            link={supportInfo.website}
+            iconClassName="data-space__viewer__support__entry__icon--website"
+            icon={<HomeIcon />}
+          />
+          <DataSpaceSupportLinkEntry
+            label="Documentation"
+            link={supportInfo.documentation}
+            icon={<DocumentationIcon />}
+          />
+          <DataSpaceSupportLinkEntry
+            label="Support"
+            link={supportInfo.supportUrl}
+            iconClassName="data-space__viewer__support__entry__icon--support"
+            icon={<SupportIcon />}
+          />
+          <DataSpaceSupportLinkEntry
+            label="FAQ"
+            link={supportInfo.faqUrl}
+            iconClassName="data-space__viewer__support__entry__icon--faq"
+            icon={<QuestionAnswerIcon />}
+          />
+        </div>
+        {Boolean(supportInfo.emails?.length) && (
+          <div className="data-space__viewer__support__section">
+            {supportInfo.emails?.map((email) => (
+              <div
+                key={email.address}
+                className="data-space__viewer__support__entry"
+                title={email.title}
+              >
+                <div className="data-space__viewer__support__entry__icon">
+                  <EnvelopeIcon />
+                </div>
+                <a
+                  href={`mailto:${email.address}`}
+                  className="data-space__viewer__support__entry__content"
+                >
+                  {email.title} - {email.address}
+                </a>
+              </div>
+            ))}
+          </div>
+        )}
+        {Boolean(supportInfo.expertise?.length) && (
+          <div className="data-space__viewer__support__section">
+            {supportInfo.expertise?.map((expertise, idx) => (
+              <div
+                // eslint-disable-next-line react/no-array-index-key
+                key={idx}
+                className="data-space__viewer__support__entry"
+                title="Expertise"
+              >
+                <div className="data-space__viewer__support__entry__icon">
+                  <SparkleIcon />
+                </div>
+                <div className="data-space__viewer__support__entry__content">
+                  {expertise.description ?? '(not specified)'}
+                  {Boolean(expertise.expertIds?.length) &&
+                    ` (${expertise.expertIds?.join(', ')})`}
+                </div>
+              </div>
+            ))}
+          </div>
+        )}
+      </>
+    );
+  },
+);
+
 const DataSpaceSupport = observer(
   (props: { dataSpaceViewerState: DataSpaceViewerState }) => {
     const { dataSpaceViewerState } = props;
@@ -182,6 +300,13 @@ const DataSpaceSupport = observer(
           supportInfo={supportInfo}
         />
       );
+    } else if (supportInfo instanceof DataSpaceSupportFullInfo) {
+      return (
+        <DataSpaceSupportFullInfoViewer
+          dataSpaceViewerState={dataSpaceViewerState}
+          supportInfo={supportInfo}
+        />
+      );
     }
     return (
       <div className="data-space__viewer__panel__content__placeholder">

package/src/components/DataSpaceViewer.tsx

@@ -85,7 +85,7 @@ const DataSpaceHeader = observer(
             {dataSpaceViewerState.isVerified && (
               <div
                 className="data-space__viewer__header__title__verified-badge"
-                title="Verified Data Product"
+                title="Verified Data Space"
               >
                 <VerifiedIcon />
               </div>
@@ -162,7 +162,7 @@ const DataSpaceHeader = observer(
                           )
                         }
                       >
-                        Query Data Product
+                        Query Data Space
                       </MenuContentItem>
                       <MenuContentDivider />
                     </>

package/src/components/DataSpaceWiki.tsx

@@ -59,7 +59,6 @@ export const DataSpaceWiki = observer(
       <div className="data-space__viewer__wiki">
         <DataSpaceDescription dataSpaceViewerState={dataSpaceViewerState} />
         <DiagramViewer
-          applicationStore={dataSpaceViewerState.applicationStore}
           diagramViewerState={dataSpaceViewerState.diagramViewerState}
           actions={{
             onQueryClass: dataSpaceViewerState.queryClass,
@@ -97,7 +96,6 @@ export const DataSpaceWiki = observer(
           modelsDocumentationState={
             dataSpaceViewerState.modelsDocumentationState
           }
-          applicationStore={dataSpaceViewerState.applicationStore}
         />
         <DataSpaceQuickStart dataSpaceViewerState={dataSpaceViewerState} />
         <DataSpaceDataAccess dataSpaceViewerState={dataSpaceViewerState} />

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

@@ -121,7 +121,7 @@ export const DataSpaceAdvancedSearchModal = observer(
           className="editor-modal data-space-advanced-search__dialog"
         >
           <ModalHeader className="data-space-advanced-search__dialog__header">
-            <ModalTitle title="Search for data product " />
+            <ModalTitle title="Search for data space " />
             <ModalHeaderActions>
               <button
                 className="modal__header__action"
@@ -144,7 +144,7 @@ export const DataSpaceAdvancedSearchModal = observer(
                 isLoading={searchState.loadDataSpacesState.isInProgress}
                 onChange={onDataSpaceOptionChange}
                 value={selectedDataSpaceOption}
-                placeholder="Search for data product by name..."
+                placeholder="Search for data space by name..."
                 isClearable={true}
                 escapeClearsValue={true}
                 darkMode={
@@ -164,7 +164,7 @@ export const DataSpaceAdvancedSearchModal = observer(
                 tabIndex={-1}
                 title={`[${
                   searchState.toGetSnapShot ? 'on' : 'off'
-                }] Toggle show data products from snapshot releases instead of latest releases`}
+                }] Toggle show data spaces from snapshot releases instead of latest releases`}
                 onClick={toggleGetSnapshot}
               >
                 <BoltIcon />
@@ -201,7 +201,7 @@ export const DataSpaceAdvancedSearchModal = observer(
                           <TimesCircleIcon />
                         </div>
                         <div className="data-space-advanced-search__dialog__view--failed__text">
-                          {`Can't load data product`}
+                          {`Can't load data space`}
                         </div>
                       </div>
                     </BlankPanelContent>

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

@@ -271,7 +271,7 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
         <PanelHeader title="properties">
           <PanelHeaderActions>
             <PanelHeaderActionItem
-              title="copy data product query set up link to clipboard"
+              title="copy data space query set up link to clipboard"
               onClick={copyDataSpaceLinkToClipboard}
               disabled={!queryBuilderState.isDataSpaceLinkable}
             >
@@ -313,10 +313,10 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
           <div className="query-builder__setup__config-group__item">
             <label
               className="btn--sm query-builder__setup__config-group__data-product"
-              title="data product"
+              title="data space"
               htmlFor="query-builder__setup__data-space-selector"
             >
-              Data Product
+              Data Space
             </label>
             <CustomSelectorInput
               inputId="query-builder__setup__data-space-selector"
@@ -325,7 +325,7 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
               isLoading={queryBuilderState.loadEntitiesState.isInProgress}
               onChange={onDataSpaceOptionChange}
               value={selectedDataSpaceOption}
-              placeholder="Search for data product..."
+              placeholder="Search for data space..."
               escapeClearsValue={true}
               darkMode={
                 !applicationStore.layoutService
@@ -339,7 +339,7 @@ const DataSpaceQueryBuilderSetupPanelContent = observer(
                   tabIndex={-1}
                   className="query-builder__setup__data-space-searcher__btn btn--dark"
                   onClick={openDataSpaceAdvancedSearch}
-                  title="Open advanced search for data product..."
+                  title="Open advanced search for data space..."
                 >
                   <SearchIcon />
                 </button>

package/src/graph/DSL_DataSpace_HashUtils.ts

@@ -25,5 +25,9 @@ export enum DATA_SPACE_HASH_STRUCTURE {
   DATA_SPACE_DIAGRAM = 'DATA_SPACE_DIAGRAM',
   DATA_SPACE_SUPPORT_COMBINED_INFO = 'DATA_SPACE_SUPPORT_COMBINED_INFO',
   DATA_SPACE_SUPPORT_EMAIL = 'DATA_SPACE_SUPPORT_EMAIL',
+  DATA_SPACE_SUPPORT_FULL_INFO = 'DATA_SPACE_SUPPORT_FULL_INFO',
+  DATA_SPACE_LINK = 'DATA_SPACE_LINK',
+  DATA_SPACE_EMAIL = 'DATA_SPACE_EMAIL',
+  DATA_SPACE_EXPERTISE = 'DATA_SPACE_EXPERTISE',
   MAPPING_INCLUDE_DATASPACE = 'MAPPING_INCLUDE_DATASPACE',
 }

package/src/graph/metamodel/pure/model/packageableElements/dataSpace/DSL_DataSpace_DataSpace.ts

@@ -26,6 +26,7 @@ import {
   type Package,
   type RawLambda,
   type DataElementReference,
+  type OperationalMetadata,
   PackageableElement,
   ConcreteFunctionDefinition,
   generateFunctionPrettyName,
@@ -200,6 +201,70 @@ export class DataSpaceSupportCombinedInfo
   }
 }
 
+export class DataSpaceLink implements Hashable {
+  label?: string | undefined;
+  url!: string;
+
+  get hashCode(): string {
+    return hashArray([
+      DATA_SPACE_HASH_STRUCTURE.DATA_SPACE_LINK,
+      this.label ?? '',
+      this.url,
+    ]);
+  }
+}
+
+export class DataSpaceEmail implements Hashable {
+  title!: string;
+  address!: string;
+
+  get hashCode(): string {
+    return hashArray([
+      DATA_SPACE_HASH_STRUCTURE.DATA_SPACE_EMAIL,
+      this.title,
+      this.address,
+    ]);
+  }
+}
+
+export class DataSpaceExpertise implements Hashable {
+  description?: string | undefined;
+  expertIds?: string[] | undefined;
+
+  get hashCode(): string {
+    return hashArray([
+      DATA_SPACE_HASH_STRUCTURE.DATA_SPACE_EXPERTISE,
+      this.description ?? '',
+      hashArray(this.expertIds ?? []),
+    ]);
+  }
+}
+
+export class DataSpaceSupportFullInfo
+  extends DataSpaceSupportInfo
+  implements Hashable
+{
+  documentation?: DataSpaceLink | undefined;
+  website?: DataSpaceLink | undefined;
+  faqUrl?: DataSpaceLink | undefined;
+  supportUrl?: DataSpaceLink | undefined;
+  emails?: DataSpaceEmail[] | undefined;
+  expertise?: DataSpaceExpertise[] | undefined;
+
+  get hashCode(): string {
+    return hashArray([
+      DATA_SPACE_HASH_STRUCTURE.DATA_SPACE_SUPPORT_FULL_INFO,
+      this.documentationUrl ?? '',
+      this.documentation ?? '',
+      this.website ?? '',
+      this.faqUrl ?? '',
+      this.supportUrl ?? '',
+      hashArray(this.emails ?? []),
+      hashArray(this.expertise ?? []),
+    ]);
+  }
+}
+
 export class DataSpace extends PackageableElement implements Hashable {
   title?: string | undefined;
   description?: string | undefined;
@@ -209,6 +274,7 @@ export class DataSpace extends PackageableElement implements Hashable {
   executables?: DataSpaceExecutable[] | undefined;
   diagrams?: DataSpaceDiagram[] | undefined;
   supportInfo?: DataSpaceSupportInfo | undefined;
+  operationalMetadata?: OperationalMetadata | undefined;
 
   protected override get _elementHashCode(): string {
     return hashArray([
@@ -225,6 +291,7 @@ export class DataSpace extends PackageableElement implements Hashable {
       hashArray(this.executables ?? []),
       hashArray(this.diagrams ?? []),
       this.supportInfo ?? '',
+      this.operationalMetadata ?? '',
     ]);
   }