@finos/legend-application-studio 28.19.65 → 28.19.67

package/src/components/editor/editor-group/dataProduct/DataProductEditor.tsx

@@ -88,7 +88,11 @@ import {
   useRef,
   useState,
 } from 'react';
-import { filterByType, guaranteeType } from '@finos/legend-shared';
+import {
+  filterByType,
+  guaranteeType,
+  UserSearchService,
+} from '@finos/legend-shared';
 import { InlineLambdaEditor, LineageViewer } from '@finos/legend-query-builder';
 import { action, autorun, flowResult } from 'mobx';
 import { useAuth } from 'react-oidc-context';
@@ -142,7 +146,7 @@ import {
   expertise_setDescription,
   expertise_addId,
   expertise_deleteId,
-  dataProduct_deleteExpertise,
+  supportInfo_deleteExpertise,
   externalType_setLinkURL,
   externalType_setLinkLabel,
   accessPointGroup_setTitle,
@@ -2488,7 +2492,9 @@ const ExpertiseEditor = observer(
     };
 
     const handleRemoveExpertise = (expertise: Expertise) => {
-      dataProduct_deleteExpertise(product, expertise);
+      if (product.supportInfo) {
+        supportInfo_deleteExpertise(product.supportInfo, expertise);
+      }
     };
 
     return (
@@ -2507,66 +2513,68 @@ const ExpertiseEditor = observer(
             </PanelHeaderActionItem>
           </PanelHeaderActions>
         </PanelHeader>
-        {dataProductEditorState.product.expertise?.map((expertise) => (
-          <>
-            <div className="data-product-editor__expertise">
-              <div className="panel__content__form__section">
-                <div className="panel__content__form__section__header__prompt">
-                  Description
-                </div>
-                <textarea
-                  className="panel__content__form__section__textarea"
-                  spellCheck={false}
-                  disabled={dataProductEditorState.isReadOnly}
-                  value={expertise.description ?? ''}
-                  onChange={(event) =>
-                    updateExpertiseDescription(expertise, event.target.value)
-                  }
-                  style={{
-                    height: '100%',
-                  }}
-                />
-              </div>
-              <div className="panel__content__form__section">
-                <div className="panel__content__form__section__header__prompt">
-                  User IDs
+        {dataProductEditorState.product.supportInfo?.expertise?.map(
+          (expertise) => (
+            <>
+              <div className="data-product-editor__expertise">
+                <div className="panel__content__form__section">
+                  <div className="panel__content__form__section__header__prompt">
+                    Description
+                  </div>
+                  <textarea
+                    className="panel__content__form__section__textarea"
+                    spellCheck={false}
+                    disabled={dataProductEditorState.isReadOnly}
+                    value={expertise.description ?? ''}
+                    onChange={(event) =>
+                      updateExpertiseDescription(expertise, event.target.value)
+                    }
+                    style={{
+                      height: '100%',
+                    }}
+                  />
                 </div>
-                <div className="panel__content__form__section__list__id-list">
-                  {expertise.expertIds?.map((id) => (
-                    <div
-                      className="panel__content__form__section__list__item"
-                      key={id}
-                    >
-                      {id}
-
-                      <button
-                        className="panel__content__form__section__list__item__remove-btn"
-                        disabled={dataProductEditorState.isReadOnly}
-                        onClick={() => handleRemoveId(expertise, id)}
-                        tabIndex={-1}
+                <div className="panel__content__form__section">
+                  <div className="panel__content__form__section__header__prompt">
+                    User IDs
+                  </div>
+                  <div className="panel__content__form__section__list__id-list">
+                    {expertise.expertIds?.map((id) => (
+                      <div
+                        className="panel__content__form__section__list__item"
+                        key={id}
                       >
-                        <TimesIcon />
-                      </button>
-                    </div>
-                  ))}
+                        {id}
+
+                        <button
+                          className="panel__content__form__section__list__item__remove-btn"
+                          disabled={dataProductEditorState.isReadOnly}
+                          onClick={() => handleRemoveId(expertise, id)}
+                          tabIndex={-1}
+                        >
+                          <TimesIcon />
+                        </button>
+                      </div>
+                    ))}
+                  </div>
+                  <NewExpertIdComponent expertise={expertise} />
+                </div>
+                <div className="data-product-editor__expertise__actions">
+                  <button
+                    className="access-point-editor__generic-entry__remove-btn--group"
+                    onClick={() => {
+                      handleRemoveExpertise(expertise);
+                    }}
+                    tabIndex={-1}
+                    title="Remove Expertise"
+                  >
+                    <TimesIcon />
+                  </button>
                 </div>
-                <NewExpertIdComponent expertise={expertise} />
-              </div>
-              <div className="data-product-editor__expertise__actions">
-                <button
-                  className="access-point-editor__generic-entry__remove-btn--group"
-                  onClick={() => {
-                    handleRemoveExpertise(expertise);
-                  }}
-                  tabIndex={-1}
-                  title="Remove Expertise"
-                >
-                  <TimesIcon />
-                </button>
               </div>
-            </div>
-          </>
-        ))}
+            </>
+          ),
+        )}
       </>
     );
   },
@@ -2852,6 +2860,27 @@ const getDataProductViewerState = (
     V1_DataProduct,
   );
   const remoteEngine = guaranteeType(graphManager.engine, V1_RemoteEngine);
+  let userSearchService: UserSearchService | undefined = undefined;
+  if (applicationStore.pluginManager.getUserPlugins().length > 0) {
+    applicationStore.pluginManager
+      .getUserPlugins()
+      .forEach((plugin) =>
+        plugin.setup(
+          applicationStore.config.options.userSearchConfig
+            ?.applicationDirectoryUrl,
+        ),
+      );
+    userSearchService = new UserSearchService({
+      userProfileImageUrl:
+        applicationStore.config.options.userSearchConfig?.userProfileImageUrl,
+      applicationDirectoryUrl:
+        applicationStore.config.options.userSearchConfig
+          ?.applicationDirectoryUrl,
+    });
+    userSearchService.registerPlugins(
+      applicationStore.pluginManager.getUserPlugins(),
+    );
+  }
   const dataProductViewerState = new DataProductViewerState(
     v1_dataProduct,
     applicationStore,
@@ -2859,7 +2888,7 @@ const getDataProductViewerState = (
     depotServerClient,
     graphManagerState,
     applicationStore.config.options.dataProductConfig,
-    undefined,
+    userSearchService,
     undefined,
     {},
   );

package/src/components/editor/side-bar/DevMetadataPanel.tsx

@@ -0,0 +1,168 @@
+/**
+ * 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 { observer } from 'mobx-react-lite';
+import { useEditorStore } from '../EditorStoreProvider.js';
+import { useEffect } from 'react';
+import {
+  PanelFormSection,
+  PanelFormValidatedTextField,
+  PanelHeader,
+  PanelContent,
+  Panel,
+  clsx,
+  Dialog,
+  CheckCircleIcon,
+  ModalBody,
+  ModalFooterButton,
+  ModalFooter,
+  ModalHeader,
+  Modal,
+  ModalTitle,
+} from '@finos/legend-art';
+import { CODE_EDITOR_LANGUAGE } from '@finos/legend-code-editor';
+import { CodeEditor } from '@finos/legend-lego/code-editor';
+import { DevMetadataResult } from '@finos/legend-graph';
+
+const DevMetadataResultModal = observer(
+  (props: {
+    closeModal: () => void;
+    deploymentResponse: DevMetadataResult;
+  }) => {
+    const { closeModal, deploymentResponse } = props;
+    return (
+      <Dialog
+        open={true}
+        classes={{
+          root: 'ingestion-modal__root-container',
+          container: 'ingestion-modal__container',
+          paper: 'ingestion-modal__content',
+        }}
+      >
+        <Modal darkMode={true} className="ingestion-modal">
+          <ModalHeader>
+            <ModalTitle
+              icon={<CheckCircleIcon className="ingestion-modal--success" />}
+              title="Push Response"
+            ></ModalTitle>
+          </ModalHeader>
+          <ModalBody>
+            <div className="ingestion-modal__write">
+              <div className="ingestion-modal__write--value">
+                <CodeEditor
+                  inputValue={JSON.stringify(
+                    DevMetadataResult.serialization.toJson(deploymentResponse),
+                    null,
+                    2,
+                  )}
+                  isReadOnly={true}
+                  language={CODE_EDITOR_LANGUAGE.JSON}
+                  extraEditorOptions={{
+                    wordWrap: 'on',
+                  }}
+                  hideActionBar={true}
+                />
+              </div>
+            </div>
+          </ModalBody>
+          <ModalFooter>
+            <ModalFooterButton
+              onClick={closeModal}
+              text="Close"
+              type="secondary"
+            />
+          </ModalFooter>
+        </Modal>
+      </Dialog>
+    );
+  },
+);
+
+export const DevMetadataPanel = observer(() => {
+  const editorStore = useEditorStore();
+  const devMetadataState = editorStore.devMetadataState;
+
+  useEffect(() => {
+    devMetadataState.init();
+  }, [devMetadataState]);
+
+  const handlePush = (): void => {
+    devMetadataState.push();
+  };
+
+  const handleDidChange = (value: string | undefined): void => {
+    devMetadataState.setDid(value ?? '');
+  };
+
+  const isPushDisabled = !devMetadataState.did.trim();
+
+  return (
+    <Panel>
+      <PanelHeader className="side-bar__header">
+        <div className="panel__header__title">
+          <div className="panel__header__title__label side-bar__header__title__content">
+            Push to Dev
+          </div>
+        </div>
+      </PanelHeader>
+      <PanelContent>
+        <form
+          onSubmit={(event) => {
+            event.preventDefault();
+            if (!isPushDisabled) {
+              handlePush();
+            }
+          }}
+        >
+          <PanelFormSection>
+            <div className="panel__content__form__section__header__label">
+              DID
+            </div>
+            <PanelFormValidatedTextField
+              value={devMetadataState.did}
+              update={handleDidChange}
+              placeholder="Enter DID..."
+            />
+          </PanelFormSection>
+          <PanelFormSection>
+            <button
+              type="submit"
+              className={clsx('btn btn--primary register-service__push-btn', {
+                'btn--disabled': isPushDisabled,
+              })}
+              disabled={isPushDisabled}
+              title={
+                isPushDisabled
+                  ? 'Please fill in both DID and Project Name'
+                  : 'Push to Dev'
+              }
+            >
+              <div className="btn__content">
+                <div className="btn__content__label">Push</div>
+              </div>
+            </button>
+          </PanelFormSection>
+        </form>
+      </PanelContent>
+      {devMetadataState.result && (
+        <DevMetadataResultModal
+          closeModal={() => (devMetadataState.result = undefined)}
+          deploymentResponse={devMetadataState.result}
+        />
+      )}
+    </Panel>
+  );
+});

package/src/components/editor/side-bar/SideBar.tsx

@@ -30,6 +30,7 @@ import { useEditorStore } from '../EditorStoreProvider.js';
 import { GlobalTestRunner } from './testable/GlobalTestRunner.js';
 import { RegisterService } from './RegisterService.js';
 import { EndToEndWorkflow } from './end-to-end-workflow/EndToEndWorkflows.js';
+import { DevMetadataPanel } from './DevMetadataPanel.js';
 
 /**
  * Wrapper component around different implementations of sidebar, such as to view domain, to manage SDLC, etc.
@@ -63,6 +64,8 @@ export const SideBar = observer(() => {
             globalTestRunnerState={editorStore.globalTestRunnerState}
           />
         );
+      case ACTIVITY_MODE.DEV_MODE:
+        return <DevMetadataPanel />;
       case ACTIVITY_MODE.REGISTER_SERVICES:
         return (
           <RegisterService

package/src/stores/editor/EditorConfig.ts

@@ -37,6 +37,7 @@ export enum ACTIVITY_MODE {
   PROJECT_OVERVIEW = 'PROJECT_OVERVIEW',
   WORKFLOW_MANAGER = 'WORKFLOW_MANAGER',
   TEST_RUNNER = 'TEST_RUNNER',
+  DEV_MODE = 'DEV_MODE',
   REGISTER_SERVICES = 'REGISTER_SERVICES',
 }
 

package/src/stores/editor/EditorStore.ts

@@ -123,6 +123,7 @@ import {
 import type { QueryBuilderDataCubeViewerState } from '@finos/legend-query-builder';
 import { EditorInitialConfiguration } from './editor-state/element-editor-state/ElementEditorInitialConfiguration.js';
 import { LakehouseIngestionManager } from '@finos/legend-server-lakehouse';
+import { DevMetadataState } from './sidebar-state/dev-metadata/DevMetadataState.js';
 
 export abstract class EditorExtensionState {
   /**
@@ -181,6 +182,7 @@ export class EditorStore implements CommandRegistrar {
   globalBulkServiceRegistrationState: GlobalBulkServiceRegistrationState;
   globalEndToEndWorkflowState: GlobalEndToEndWorkflowState;
   devToolState: DevToolPanelState;
+  devMetadataState: DevMetadataState;
   sqlPlaygroundState: SQLPlaygroundPanelState;
 
   modelImporterState: ModelImporterState;
@@ -277,6 +279,7 @@ export class EditorStore implements CommandRegistrar {
     this.graphEditorMode = new GraphEditFormModeState(this);
     this.changeDetectionState = new ChangeDetectionState(this, this.graphState);
     this.devToolState = new DevToolPanelState(this);
+    this.devMetadataState = new DevMetadataState(this);
     this.sqlPlaygroundState = new SQLPlaygroundPanelState(this);
     this.embeddedQueryBuilderState = new EmbeddedQueryBuilderState(this);
     // side bar panels

package/src/stores/editor/editor-state/element-editor-state/dataProduct/DataProductEditorState.ts

@@ -97,7 +97,7 @@ import {
   accessPointGroup_swapAccessPoints,
   dataProduct_addAccessPoint,
   dataProduct_addAccessPointGroup,
-  dataProduct_addExpertise,
+  supportInfo_addExpertise,
   dataProduct_deleteAccessPoint,
   dataProduct_deleteAccessPointGroup,
   dataProduct_swapAccessPointGroups,
@@ -108,6 +108,7 @@ import {
   modelAccessPointGroup_setDefaultRuntime,
   modelAccessPointGroup_setElementExclude,
   modelAccessPointGroup_setMapping,
+  dataProduct_setSupportInfoIfAbsent,
 } from '../../../../graph-modifier/DSL_DataProduct_GraphModifierHelper.js';
 import { LambdaEditorState, LineageState } from '@finos/legend-query-builder';
 import {
@@ -1093,8 +1094,11 @@ export class DataProductEditorState extends ElementEditorState {
   }
 
   createExpertise() {
+    dataProduct_setSupportInfoIfAbsent(this.product);
     const newExpertise = new Expertise();
-    dataProduct_addExpertise(this.product, newExpertise);
+    if (this.product.supportInfo) {
+      supportInfo_addExpertise(this.product.supportInfo, newExpertise);
+    }
   }
 
   *deploy(token: string | undefined): GeneratorFn<void> {

package/src/stores/editor/sidebar-state/dev-metadata/DevMetadataState.ts

@@ -0,0 +1,111 @@
+/**
+ * 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 {
+  ActionState,
+  assertErrorThrown,
+  assertNonEmptyString,
+  assertNonNullable,
+  assertTrue,
+  filterByType,
+  type GeneratorFn,
+} from '@finos/legend-shared';
+import type { EditorStore } from '../../EditorStore.js';
+import { action, flow, makeObservable, observable } from 'mobx';
+import { type DevMetadataResult, IngestDefinition } from '@finos/legend-graph';
+import { generateGAVCoordinates } from '@finos/legend-storage';
+
+export class DevMetadataState {
+  readonly editorStore: EditorStore;
+  result: DevMetadataResult | undefined;
+  pushState = ActionState.create();
+  did = '';
+
+  constructor(editorStore: EditorStore) {
+    this.editorStore = editorStore;
+
+    makeObservable(this, {
+      pushState: observable,
+      did: observable,
+      setDid: action,
+      push: flow,
+      init: action,
+    });
+  }
+
+  setDid(did: string): void {
+    this.did = did;
+  }
+
+  init(): void {
+    if (!this.did) {
+      const ingestDID = this.editorStore.graphManagerState.graph.allElements
+        .filter(filterByType(IngestDefinition))[0]
+        ?.appDirDeployment?.appDirId?.toString();
+      if (ingestDID) {
+        this.setDid(ingestDID);
+      }
+    }
+  }
+
+  *push(): GeneratorFn<void> {
+    try {
+      this.result = undefined;
+      const dependenciesSize =
+        this.editorStore.graphManagerState.graph.dependencyManager
+          .projectDependencyModelsIndex.size;
+      assertTrue(
+        dependenciesSize === 0,
+        'Dependencies not supported in dev mode',
+      );
+      const currentProjectConfiguration =
+        this.editorStore.projectConfigurationEditorState
+          .currentProjectConfiguration;
+      assertNonNullable(
+        currentProjectConfiguration,
+        'Project Name required to push to dev mode',
+      );
+      const projectId = generateGAVCoordinates(
+        currentProjectConfiguration.groupId,
+        currentProjectConfiguration.artifactId,
+        undefined,
+      );
+      assertNonEmptyString(this.did, 'DID required to push to dev mode');
+      this.pushState.inProgress();
+      this.editorStore.applicationStore.alertService.setBlockingAlert({
+        message: 'Pushing to Dev Mode',
+        showLoading: true,
+      });
+      const result =
+        (yield this.editorStore.graphManagerState.graphManager.pushToDevMetadata(
+          this.did,
+          projectId,
+          this.editorStore.graphManagerState.graph,
+        )) as DevMetadataResult;
+      this.result = result;
+      this.editorStore.applicationStore.notificationService.notifySuccess(
+        `Pushed to dev mode`,
+      );
+    } catch (error) {
+      assertErrorThrown(error);
+      this.pushState.fail();
+    } finally {
+      this.editorStore.applicationStore.alertService.setBlockingAlert(
+        undefined,
+      );
+    }
+  }
+}

package/src/stores/graph-modifier/DSL_DataProduct_GraphModifierHelper.ts

@@ -201,21 +201,21 @@ export const dataProduct_deleteAccessPointGroup = action(
   },
 );
 
-export const dataProduct_addExpertise = action(
-  (product: DataProduct, expertise: Expertise) => {
+export const supportInfo_addExpertise = action(
+  (supportInfo: SupportInfo, expertise: Expertise) => {
     const observedExpertise = observe_Expertise(expertise);
-    if (!product.expertise) {
-      product.expertise = [observedExpertise];
+    if (!supportInfo.expertise) {
+      supportInfo.expertise = [observedExpertise];
     } else {
-      addUniqueEntry(product.expertise, observedExpertise);
+      addUniqueEntry(supportInfo.expertise, observedExpertise);
     }
   },
 );
 
-export const dataProduct_deleteExpertise = action(
-  (product: DataProduct, expertise: Expertise) => {
-    if (product.expertise) {
-      deleteEntry(product.expertise, expertise);
+export const supportInfo_deleteExpertise = action(
+  (supportInfo: SupportInfo, expertise: Expertise) => {
+    if (supportInfo.expertise) {
+      deleteEntry(supportInfo.expertise, expertise);
     }
   },
 );

package/tsconfig.json

@@ -181,6 +181,7 @@
     "./src/stores/editor/sidebar-state/WorkspaceSyncState.ts",
     "./src/stores/editor/sidebar-state/WorkspaceUpdateConflictResolutionState.ts",
     "./src/stores/editor/sidebar-state/WorkspaceUpdaterState.ts",
+    "./src/stores/editor/sidebar-state/dev-metadata/DevMetadataState.ts",
     "./src/stores/editor/sidebar-state/end-to-end-workflow/GlobalEndToEndFlowState.ts",
     "./src/stores/editor/sidebar-state/testable/GlobalTestRunnerState.ts",
     "./src/stores/editor/utils/DnDUtils.ts",
@@ -331,6 +332,7 @@
     "./src/components/editor/panel-group/ProblemsPanel.tsx",
     "./src/components/editor/panel-group/SQLPlaygroundPanel.tsx",
     "./src/components/editor/side-bar/CreateNewElementModal.tsx",
+    "./src/components/editor/side-bar/DevMetadataPanel.tsx",
     "./src/components/editor/side-bar/Explorer.tsx",
     "./src/components/editor/side-bar/LocalChanges.tsx",
     "./src/components/editor/side-bar/ProjectOverview.tsx",