@finos/legend-application-studio 28.19.2 → 28.19.4

package/src/components/editor/editor-group/function-activator/SnowflakeM2MUdfFunctionActivatorEditor.tsx

@@ -0,0 +1,291 @@
+/**
+ * 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 {
+  type SelectComponent,
+  Panel,
+  PanelHeader,
+  PanelContent,
+  PanelForm,
+  PanelFormTextField,
+  PURE_FunctionIcon,
+  LongArrowRightIcon,
+  PanelLoadingIndicator,
+  PURE_ConnectionIcon,
+  CustomSelectorInput,
+  createFilter,
+} from '@finos/legend-art';
+import {
+  type PackageableConnection,
+  generateFunctionPrettyName,
+  RelationalDatabaseConnection,
+  DatabaseType,
+} from '@finos/legend-graph';
+import { observer } from 'mobx-react-lite';
+import { useApplicationStore } from '@finos/legend-application';
+import { useEditorStore } from '../../EditorStoreProvider.js';
+import { SnowflakeM2MUdfFunctionActivatorEdtiorState } from '../../../../stores/editor/editor-state/element-editor-state/function-activator/SnowflakeM2MUdfFunctionActivatorEditorState.js';
+import { flowResult } from 'mobx';
+import { useRef } from 'react';
+import {
+  type RelationalDatabaseConnectionOption,
+  buildRelationalDatabaseConnectionOption,
+} from '../connection-editor/RelationalDatabaseConnectionEditor.js';
+import { ActivatorOwnershipForm } from './ActivatorFormComponents.js';
+
+export const SnowflakeM2MUdfFunctionActivatorEditor = observer(() => {
+  const editorStore = useEditorStore();
+  const applicationStore = useApplicationStore();
+  const editorState = editorStore.tabManagerState.getCurrentEditorState(
+    SnowflakeM2MUdfFunctionActivatorEdtiorState,
+  );
+  const isReadOnly = editorState.isReadOnly;
+  const activator = editorState.activator;
+
+  const connectionSelectorRef = useRef<SelectComponent>(null);
+  const connectionFilterOption = createFilter({
+    ignoreCase: true,
+    ignoreAccents: false,
+    stringify: (option: { data: RelationalDatabaseConnectionOption }): string =>
+      option.data.value.path,
+  });
+  const connectionOptions = editorStore.graphManagerState.usableConnections
+    .filter(
+      (connection) =>
+        connection.connectionValue instanceof RelationalDatabaseConnection &&
+        connection.connectionValue.type === DatabaseType.Snowflake,
+    )
+    .map(buildRelationalDatabaseConnectionOption);
+
+  const initializeActivationConnection = (
+    val: PackageableConnection | undefined,
+  ): PackageableConnection | undefined => {
+    if (val) {
+      editorState.updateConnection(val);
+    }
+    return !val
+      ? undefined
+      : activator.activationConfiguration.activationConnection
+          ?.packageableConnection.value;
+  };
+
+  const activationConnection = activator.activationConfiguration
+    .activationConnection
+    ? activator.activationConfiguration.activationConnection
+        .packageableConnection.value
+    : initializeActivationConnection(connectionOptions.at(0)?.value);
+
+  const changeConnection = (val: RelationalDatabaseConnectionOption): void => {
+    if (!isReadOnly && val.value === activationConnection) {
+      return;
+    }
+    editorState.updateConnection(val.value);
+  };
+  const changeDescription: React.ChangeEventHandler<HTMLTextAreaElement> = (
+    event,
+  ) => {
+    if (!isReadOnly) {
+      editorState.updateAppDescription(event.target.value);
+    }
+  };
+  const visitFunction = (): void =>
+    editorState.editorStore.graphEditorMode.openElement(
+      activator.function.value,
+    );
+  const visitConnection = (): void => {
+    if (activationConnection) {
+      editorState.editorStore.graphEditorMode.openElement(activationConnection);
+    }
+  };
+  const validate = (): void => {
+    flowResult(editorState.validate()).catch(
+      applicationStore.alertUnhandledError,
+    );
+  };
+  const deploy = (): void => {
+    flowResult(editorState.deployToSandbox()).catch(
+      applicationStore.alertUnhandledError,
+    );
+  };
+
+  return (
+    <div className="snowflake-m2m-udf-function-activator-editor">
+      <Panel>
+        <PanelHeader title="Snowflake M2M Udf Application" />
+        <PanelLoadingIndicator
+          isLoading={Boolean(
+            editorState.validateState.isInProgress ||
+              editorState.deployState.isInProgress,
+          )}
+        />
+        <PanelContent>
+          <div className="snowflake-m2m-udf-function-activator-editor__header">
+            <div className="snowflake-m2m-udf-function-activator-editor__header__label">
+              Snowflake Activator Metadata
+            </div>
+            <div className="snowflake-m2m-udf-function-activator-editor__header__actions">
+              <button
+                className="snowflake-m2m-udf-function-activator-editor__header__actions__action snowflake-m2m-udf-function-activator-editor__header__actions__action--primary"
+                onClick={validate}
+                disabled={editorState.validateState.isInProgress}
+                tabIndex={-1}
+                title="Click Validate to verify your activator before deployment"
+              >
+                Validate
+              </button>
+              <button
+                className="snowflake-m2m-udf-function-activator-editor__header__actions__action snowflake-m2m-udf-function-activator-editor__header__actions__action--primary"
+                onClick={deploy}
+                disabled={editorState.deployState.isInProgress}
+                title="Deploy to sandbox"
+                tabIndex={-1}
+              >
+                Deploy to Sandbox
+              </button>
+            </div>
+          </div>
+          <PanelForm>
+            <div className="panel__content__form__section">
+              <div className="panel__content__form__section__header__label">
+                Function
+              </div>
+            </div>
+            <div className="snowflake-m2m-udf-function-activator-editor__configuration__items">
+              <div className="snowflake-m2m-udf-function-activator-editor__configuration__item">
+                <div className="btn--sm snowflake-m2m-udf-function-activator-editor__configuration__item__label">
+                  <PURE_FunctionIcon />
+                </div>
+                <input
+                  className="panel__content__form__section__input"
+                  spellCheck={false}
+                  disabled={true}
+                  value={generateFunctionPrettyName(activator.function.value, {
+                    fullPath: true,
+                    spacing: false,
+                  })}
+                />
+                <button
+                  className="btn--dark btn--sm snowflake-m2m-udf-function-activator-editor__configuration__item__btn"
+                  onClick={visitFunction}
+                  tabIndex={-1}
+                  title="See Function"
+                >
+                  <LongArrowRightIcon />
+                </button>
+              </div>
+            </div>
+          </PanelForm>
+          <PanelForm>
+            <div className="panel__content__form__section">
+              <div className="panel__content__form__section__header__label">
+                Connection
+              </div>
+            </div>
+            <div className="snowflake-m2m-udf-function-activator-editor__configuration__items">
+              <div className="snowflake-m2m-udf-function-activator-editor__configuration__item">
+                <div className="btn--sm snowflake-m2m-udf-function-activator-editor__configuration__item__label">
+                  <PURE_ConnectionIcon />
+                </div>
+                <CustomSelectorInput
+                  inputRef={connectionSelectorRef}
+                  className="snowflake-m2m-udf-function-activator-editor__config__connection-selector__input"
+                  options={connectionOptions}
+                  onChange={changeConnection}
+                  value={
+                    activationConnection
+                      ? buildRelationalDatabaseConnectionOption(
+                          activationConnection,
+                        )
+                      : undefined
+                  }
+                  darkMode={
+                    !applicationStore.layoutService
+                      .TEMPORARY__isLightColorThemeEnabled
+                  }
+                  placeholder="Choose a connection"
+                  filterOption={connectionFilterOption}
+                />
+                <button
+                  className="btn--dark btn--sm snowflake-m2m-udf-function-activator-editor__configuration__item__btn"
+                  onClick={visitConnection}
+                  disabled={!activationConnection}
+                  tabIndex={-1}
+                  title="See Connection"
+                >
+                  <LongArrowRightIcon />
+                </button>
+              </div>
+            </div>
+          </PanelForm>
+          <PanelForm>
+            <PanelFormTextField
+              value={activator.udfName}
+              isReadOnly={isReadOnly}
+              name="Activator Identifer"
+              placeholder="Specify the name of the UDF for this activator..."
+              update={(value: string | undefined): void =>
+                editorState.updateUdfName(value ?? '')
+              }
+            />
+          </PanelForm>
+          <PanelForm>
+            <PanelFormTextField
+              value={activator.deploymentSchema}
+              isReadOnly={isReadOnly}
+              name="Deployment Schema"
+              placeholder="Specify the deployment schema"
+              update={(value: string | undefined): void =>
+                editorState.updateDeploymentSchema(value)
+              }
+            />
+          </PanelForm>
+          <PanelForm>
+            <PanelFormTextField
+              value={activator.deploymentStage}
+              isReadOnly={isReadOnly}
+              name="Deployment Stage"
+              placeholder="Specify the deployment stage"
+              update={(value: string | undefined): void =>
+                editorState.updateDeploymentStage(value)
+              }
+            />
+          </PanelForm>
+          <PanelForm>
+            <div className="panel__content__form__section">
+              <div className="panel__content__form__section__header__label">
+                Description
+              </div>
+              <div className="panel__content__form__section__header__prompt">{`Provide a brief description of Snowflake M2M Udf`}</div>
+              <textarea
+                className="panel__content__form__section__textarea service-editor__documentation__input"
+                spellCheck={false}
+                disabled={isReadOnly}
+                value={activator.description}
+                onChange={changeDescription}
+              />
+            </div>
+          </PanelForm>
+          <PanelForm>
+            <ActivatorOwnershipForm
+              activator={activator}
+              isReadOnly={isReadOnly}
+            />
+          </PanelForm>
+        </PanelContent>
+      </Panel>
+    </div>
+  );
+});

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

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { useRef } from 'react';
+import React, { useRef } from 'react';
 import { LEGEND_STUDIO_TEST_ID } from '../../../__lib__/LegendStudioTesting.js';
 import { observer } from 'mobx-react-lite';
 import {
@@ -28,6 +28,7 @@ import {
   CONNECTION_TYPE,
   type RuntimeOption,
   NewLakehouseDataProductDriver,
+  NewRuntimeType,
 } from '../../../stores/editor/NewElementState.js';
 import { Dialog, compareLabelFn, CustomSelectorInput } from '@finos/legend-art';
 import type { EditorStore } from '../../../stores/editor/EditorStore.js';
@@ -178,7 +179,23 @@ const NewRuntimeDriverEditor = observer(() => {
   const newRuntimeDriver = editorStore.newElementState.getNewElementDriver(
     NewPackageableRuntimeDriver,
   );
+  const type = newRuntimeDriver.type;
+  const typeOptions = Object.values(NewRuntimeType).map((typeOption) => ({
+    label: prettyCONSTName(typeOption),
+    value: typeOption,
+  }));
+  const typeOption = {
+    value: type,
+    label: prettyCONSTName(type),
+  };
+  const onTypeChange = (val: {
+    value: NewRuntimeType;
+    label: string;
+  }): void => {
+    newRuntimeDriver.setType(val.value);
+  };
   // mapping
+  const isStandard = type === NewRuntimeType.LEGACY;
   const mapping = newRuntimeDriver.mapping;
   const mappingOptions =
     editorStore.graphManagerState.usableMappings.map(buildElementOption);
@@ -193,22 +210,45 @@ const NewRuntimeDriverEditor = observer(() => {
     }
   };
 
-  if (!mapping) {
-    // TODO: show warning
-    return <div>no mapping found</div>;
-  }
   return (
-    <div className="explorer__new-element-modal__driver">
-      <CustomSelectorInput
-        className="explorer__new-element-modal__driver__dropdown"
-        options={mappingOptions}
-        onChange={onMappingSelectionChange}
-        value={selectedMappingOption}
-        darkMode={
-          !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled
-        }
-      />
-    </div>
+    <>
+      <div className="panel__content__form__section__header__label">
+        Runtime Type
+      </div>
+      <div className="explorer__new-element-modal__driver">
+        <CustomSelectorInput
+          className="explorer__new-element-modal__driver__dropdown"
+          options={typeOptions}
+          onChange={onTypeChange}
+          value={typeOption}
+          darkMode={
+            !applicationStore.layoutService.TEMPORARY__isLightColorThemeEnabled
+          }
+        />
+      </div>
+      {isStandard &&
+        (mapping ? (
+          <>
+            <div className="panel__content__form__section__header__label">
+              Mapping
+            </div>
+            <div className="explorer__new-element-modal__driver">
+              <CustomSelectorInput
+                className="explorer__new-element-modal__driver__dropdown"
+                options={mappingOptions}
+                onChange={onMappingSelectionChange}
+                value={selectedMappingOption}
+                darkMode={
+                  !applicationStore.layoutService
+                    .TEMPORARY__isLightColorThemeEnabled
+                }
+              />
+            </div>
+          </>
+        ) : (
+          <div>no mapping found</div>
+        ))}
+    </>
   );
 });
 

package/src/index.ts

@@ -119,6 +119,8 @@ export type { EmbeddedDataTypeOption } from './stores/editor/editor-state/elemen
 
 export { SnowflakeAppFunctionActivatorEdtiorState } from './stores/editor/editor-state/element-editor-state/function-activator/SnowflakeAppFunctionActivatorEditorState.js';
 export { SnowflakeAppFunctionActivatorEditor } from './components/editor/editor-group/function-activator/SnowflakeAppFunctionActivatorEditor.js';
+export { SnowflakeM2MUdfFunctionActivatorEdtiorState } from './stores/editor/editor-state/element-editor-state/function-activator/SnowflakeM2MUdfFunctionActivatorEditorState.js';
+export { SnowflakeM2MUdfFunctionActivatorEditor } from './components/editor/editor-group/function-activator/SnowflakeM2MUdfFunctionActivatorEditor.js';
 export { HostedServiceFunctionActivatorEditorState } from './stores/editor/editor-state/element-editor-state/function-activator/HostedServiceFunctionActivatorEditorState.js';
 export { MemSQLFunctionActivatorEditorState } from './stores/editor/editor-state/element-editor-state/function-activator/MemSQLFunctionActivatorEditorState.js';
 export { MemSQLFunctionActivatorEditor } from './components/editor/editor-group/function-activator/MemSQLFunctionActivatorEditor.js';

package/src/stores/editor/EditorGraphState.ts

@@ -88,6 +88,7 @@ import {
   createGraphBuilderReport,
   ExecutionEnvironmentInstance,
   SnowflakeApp,
+  SnowflakeM2MUdf,
   GraphEntities,
   HostedService,
   DataProduct,
@@ -855,6 +856,8 @@ export class EditorGraphState {
       return PACKAGEABLE_ELEMENT_TYPE.EXECUTION_ENVIRONMENT;
     } else if (element instanceof SnowflakeApp) {
       return PACKAGEABLE_ELEMENT_TYPE.SNOWFLAKE_APP;
+    } else if (element instanceof SnowflakeM2MUdf) {
+      return PACKAGEABLE_ELEMENT_TYPE.SNOWFLAKE_M2M_UDF;
     } else if (element instanceof HostedService) {
       return PACKAGEABLE_ELEMENT_TYPE.HOSTED_SERVICE;
     } else if (element instanceof DataProduct) {

package/src/stores/editor/EditorTabManagerState.ts

@@ -34,6 +34,7 @@ import {
   Service,
   INTERNAL__UnknownFunctionActivator,
   SnowflakeApp,
+  SnowflakeM2MUdf,
   HostedService,
   DataProduct,
   IngestDefinition,
@@ -65,6 +66,7 @@ import type { DSL_LegendStudioApplicationPlugin_Extension } from '../LegendStudi
 import { TabManagerState, type TabState } from '@finos/legend-lego/application';
 import { INTERNAL__UnknownFunctionActivatorEdtiorState } from './editor-state/element-editor-state/function-activator/INTERNAL__UnknownFunctionActivatorEditorState.js';
 import { SnowflakeAppFunctionActivatorEdtiorState } from './editor-state/element-editor-state/function-activator/SnowflakeAppFunctionActivatorEditorState.js';
+import { SnowflakeM2MUdfFunctionActivatorEdtiorState } from './editor-state/element-editor-state/function-activator/SnowflakeM2MUdfFunctionActivatorEditorState.js';
 import { HostedServiceFunctionActivatorEditorState } from './editor-state/element-editor-state/function-activator/HostedServiceFunctionActivatorEditorState.js';
 import { MemSQLFunctionActivatorEditorState } from './editor-state/element-editor-state/function-activator/MemSQLFunctionActivatorEditorState.js';
 import { ArtifactGenerationViewerState } from './editor-state/ArtifactGenerationViewerState.js';
@@ -196,6 +198,11 @@ export class EditorTabManagerState extends TabManagerState {
         this.editorStore,
         element,
       );
+    } else if (element instanceof SnowflakeM2MUdf) {
+      return new SnowflakeM2MUdfFunctionActivatorEdtiorState(
+        this.editorStore,
+        element,
+      );
     } else if (element instanceof HostedService) {
       return new HostedServiceFunctionActivatorEditorState(
         this.editorStore,

package/src/stores/editor/NewElementState.ts

@@ -39,7 +39,6 @@ import {
 } from './editor-state/GraphGenerationState.js';
 import {
   type PackageableElement,
-  type Runtime,
   type Store,
   ModelStore,
   type Connection,
@@ -85,6 +84,8 @@ import {
   GenericTypeExplicitReference,
   GenericType,
   DataProduct,
+  LakehouseRuntime,
+  type Runtime,
 } from '@finos/legend-graph';
 import type { DSL_Mapping_LegendStudioApplicationPlugin_Extension } from '../extensions/DSL_Mapping_LegendStudioApplicationPlugin_Extension.js';
 import {
@@ -203,8 +204,14 @@ export abstract class NewElementDriver<T extends PackageableElement> {
   abstract createElement(name: string): T;
 }
 
+export enum NewRuntimeType {
+  LEGACY = 'LEGACY',
+  LAKEHOUSE = 'LAKEHOUSE',
+}
+
 export class NewPackageableRuntimeDriver extends NewElementDriver<PackageableRuntime> {
   mapping?: Mapping | undefined;
+  type = NewRuntimeType.LEGACY;
 
   constructor(editorStore: EditorStore) {
     super(editorStore);
@@ -213,24 +220,42 @@ export class NewPackageableRuntimeDriver extends NewElementDriver<PackageableRun
       mapping: observable,
       setMapping: action,
       isValid: computed,
+      type: observable,
+      setType: action,
     });
 
-    const mappings = this.editorStore.graphManagerState.graph.mappings;
-    if (mappings.length) {
-      this.mapping = mappings[0];
+    const firstMapping = this.editorStore.graphManagerState.graph.mappings[0];
+    this.mapping = firstMapping;
+    if (!firstMapping) {
+      this.type = NewRuntimeType.LAKEHOUSE;
     }
   }
 
+  setType(val: NewRuntimeType): void {
+    this.type = val;
+  }
+
   setMapping(mapping: Mapping): void {
     this.mapping = mapping;
   }
 
   get isValid(): boolean {
-    return Boolean(this.mapping);
+    if (this.type === NewRuntimeType.LEGACY) {
+      return Boolean(this.mapping);
+    }
+    return true;
   }
 
   createElement(name: string): PackageableRuntime {
     const runtime = new PackageableRuntime(name);
+    if (this.type === NewRuntimeType.LAKEHOUSE) {
+      const lakehouseRuntime = new LakehouseRuntime();
+      lakehouseRuntime.environment = '';
+      lakehouseRuntime.warehouse = '';
+      lakehouseRuntime.connectionPointer = undefined;
+      runtime.runtimeValue = lakehouseRuntime;
+      return runtime;
+    }
     runtime.runtimeValue = new EngineRuntime();
     runtime_addMapping(
       runtime.runtimeValue,

package/src/stores/editor/editor-state/element-editor-state/FunctionActivatorState.ts

@@ -21,9 +21,11 @@ import {
   type FunctionActivator,
   PackageableElementExplicitReference,
   SnowflakeApp,
+  SnowflakeM2MUdf,
   extractElementNameFromPath,
   extractPackagePathFromPath,
   SnowflakeAppDeploymentConfiguration,
+  SnowflakeM2MUdfDeploymentConfiguration,
   DeploymentOwner,
   HostedService,
   MemSQLFunction,
@@ -89,6 +91,20 @@ export class FunctionActivatorState {
   ): FunctionActivator | undefined {
     const type = this.activateType;
     switch (type) {
+      case FUNCTION_ACTIVATE_TYPE.SNOWFLAKE_M2M_UDF: {
+        const activatorName = this.activatorPath.includes('::')
+          ? extractElementNameFromPath(this.activatorPath)
+          : this.activatorPath;
+        const snowflakeM2MUdf = new SnowflakeM2MUdf(activatorName);
+        snowflakeM2MUdf.udfName = '';
+        snowflakeM2MUdf.description = '';
+        snowflakeM2MUdf.ownership = new DeploymentOwner('', snowflakeM2MUdf);
+        snowflakeM2MUdf.function =
+          PackageableElementExplicitReference.create(functionElement);
+        snowflakeM2MUdf.activationConfiguration =
+          new SnowflakeM2MUdfDeploymentConfiguration();
+        return snowflakeM2MUdf;
+      }
       case FUNCTION_ACTIVATE_TYPE.SNOWFLAKE_NATIVE_APP: {
         const activatorName = this.activatorPath.includes('::')
           ? extractElementNameFromPath(this.activatorPath)