@finos/legend-application-studio 19.0.0 → 20.0.0

package/src/components/editor/edit-panel/project-configuration-editor/ProjectConfigurationEditor.tsx

@@ -42,8 +42,7 @@ import {
   Dialog,
   Panel,
   PanelForm,
-  PanelSection,
-  PanelFormTextEditor,
+  PanelFormTextField,
   CheckSquareIcon,
   SquareIcon,
   ExclamationTriangleIcon,
@@ -150,29 +149,27 @@ const ProjectStructureEditor = observer(
         </div>
 
         <PanelForm>
-          <PanelSection>
-            <PanelFormTextEditor
-              isReadOnly={isReadOnly}
-              value={projectConfig.groupId}
-              name="Group ID"
-              prompt="The domain for artifacts generated as part of the project build
+          <PanelFormTextField
+            isReadOnly={isReadOnly}
+            value={projectConfig.groupId}
+            name="Group ID"
+            prompt="The domain for artifacts generated as part of the project build
               pipeline and published to an artifact repository"
-              update={(value: string | undefined): void =>
-                projectConfig.setGroupId(value ?? '')
-              }
-            />
-            <PanelFormTextEditor
-              isReadOnly={isReadOnly}
-              value={projectConfig.artifactId}
-              name="Artifact ID"
-              prompt="The identifier (within the domain specified by group ID) for
+            update={(value: string | undefined): void =>
+              projectConfig.setGroupId(value ?? '')
+            }
+          />
+          <PanelFormTextField
+            isReadOnly={isReadOnly}
+            value={projectConfig.artifactId}
+            name="Artifact ID"
+            prompt="The identifier (within the domain specified by group ID) for
               artifacts generated as part of the project build pipeline and
               published to an artifact repository"
-              update={(value: string | undefined): void =>
-                projectConfig.setArtifactId(value ?? '')
-              }
-            />
-          </PanelSection>
+            update={(value: string | undefined): void =>
+              projectConfig.setArtifactId(value ?? '')
+            }
+          />
         </PanelForm>
       </div>
     );

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

@@ -54,7 +54,10 @@ import { useDrag } from 'react-dnd';
 import { ElementDragSource } from '../../../stores/shared/DnDUtils.js';
 import { LEGEND_STUDIO_TEST_ID } from '../../LegendStudioTestID.js';
 import { ACTIVITY_MODE } from '../../../stores/EditorConfig.js';
-import { getTreeChildNodes } from '../../../stores/shared/PackageTreeUtils.js';
+import {
+  generatePackageableElementTreeNodeDataLabel,
+  getTreeChildNodes,
+} from '../../../stores/shared/PackageTreeUtils.js';
 import type { PackageTreeNodeData } from '../../../stores/shared/TreeUtils.js';
 import {
   type GenerationTreeNodeData,
@@ -75,8 +78,11 @@ import {
   isSystemElement,
   isDependencyElement,
   isElementReadOnly,
+  ConcreteFunctionDefinition,
   Class,
   isMainGraphElement,
+  getFunctionSignature,
+  getFunctionNameWithPath,
 } from '@finos/legend-graph';
 import { useApplicationStore } from '@finos/legend-application';
 import { PACKAGEABLE_ELEMENT_TYPE } from '../../../stores/shared/ModelClassifierUtils.js';
@@ -88,7 +94,11 @@ const ElementRenamer = observer(() => {
   const applicationStore = useApplicationStore();
   const explorerTreeState = editorStore.explorerTreeState;
   const element = explorerTreeState.elementToRename;
-  const [path, setPath] = useState(element?.path ?? '');
+  const [path, setPath] = useState(
+    (element instanceof ConcreteFunctionDefinition
+      ? getFunctionNameWithPath(element)
+      : element?.path) ?? '',
+  );
   const pathInputRef = useRef<HTMLInputElement>(null);
   const changePath: React.ChangeEventHandler<HTMLInputElement> = (
     event,
@@ -129,9 +139,14 @@ const ElementRenamer = observer(() => {
     event.preventDefault();
     if (element && canRenameElement) {
       explorerTreeState.setElementToRename(undefined);
-      flowResult(editorStore.renameElement(element, path)).catch(
-        applicationStore.alertUnhandledError,
-      );
+      flowResult(
+        editorStore.renameElement(
+          element,
+          element instanceof ConcreteFunctionDefinition
+            ? path + getFunctionSignature(element)
+            : path,
+        ),
+      ).catch(applicationStore.alertUnhandledError);
     }
   };
 
@@ -140,7 +155,11 @@ const ElementRenamer = observer(() => {
 
   useEffect(() => {
     if (element) {
-      setPath(element.path);
+      setPath(
+        element instanceof ConcreteFunctionDefinition
+          ? getFunctionNameWithPath(element)
+          : element.path,
+      );
     }
   }, [element]);
 
@@ -249,7 +268,7 @@ const ExplorerContextMenu = observer(
         );
       }
     };
-    const copyLinkToElementInViewerMode = (): void => {
+    const copyWorkspaceElementLink = (): void => {
       if (node) {
         applicationStore
           .copyTextToClipboard(
@@ -260,7 +279,9 @@ const ExplorerContextMenu = observer(
             ),
           )
           .then(() =>
-            applicationStore.notifySuccess('Copied element link to clipboard'),
+            applicationStore.notifySuccess(
+              'Copied workspace element link to clipboard',
+            ),
           )
           .catch(applicationStore.alertUnhandledError);
       }
@@ -314,7 +335,7 @@ const ExplorerContextMenu = observer(
                 View in Project
               </MenuContentItem>
             )}
-            <MenuContentItem onClick={copyLinkToElementInViewerMode}>
+            <MenuContentItem onClick={copyWorkspaceElementLink}>
               Copy Link
             </MenuContentItem>
           </>
@@ -458,7 +479,10 @@ const PackageTreeNodeContainer = observer(
             tabIndex={-1}
             title={node.packageableElement.path}
           >
-            {node.label}
+            {generatePackageableElementTreeNodeDataLabel(
+              node.packageableElement,
+              node,
+            )}
           </button>
         </div>
       </ContextMenu>

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

@@ -71,11 +71,13 @@ const ShareProjectModal = observer(
       : applicationStore.navigator.generateAddress(
           generateViewProjectRoute(projectId),
         );
-    const copyProjectLink = (): void => {
+    const copyProjectElementLink = (): void => {
       applicationStore
         .copyTextToClipboard(projectLink)
         .then(() =>
-          applicationStore.notifySuccess('Copied project link to clipboard'),
+          applicationStore.notifySuccess(
+            'Copied project element link to clipboard',
+          ),
         )
         .catch(applicationStore.alertUnhandledError)
         .finally(() => closeModal());
@@ -136,7 +138,7 @@ const ShareProjectModal = observer(
             <button
               className="btn--wide btn--dark"
               disabled={isFetchingProject}
-              onClick={copyProjectLink}
+              onClick={copyProjectElementLink}
             >
               Copy Link
             </button>

package/src/components/shared/DiffView.tsx

@@ -26,7 +26,7 @@ import {
 } from '@finos/legend-application';
 import {
   disposeDiffEditor,
-  baseTextEditorSettings,
+  getBaseTextEditorOptions,
   useResizeDetector,
 } from '@finos/legend-art';
 import {
@@ -64,7 +64,7 @@ export const TextDiffView = observer(
       if (!editor && editorRef.current) {
         const element = editorRef.current;
         const _editor = monacoEditorAPI.createDiffEditor(element, {
-          ...baseTextEditorSettings,
+          ...getBaseTextEditorOptions(),
           theme: EDITOR_THEME.LEGEND,
           readOnly: true,
         });

package/src/stores/ChangeDetectionState.ts

@@ -271,12 +271,14 @@ export class ChangeDetectionState {
   aggregatedConflictResolutionChanges: EntityDiff[] = [];
   conflicts: EntityChangeConflict[] = []; // conflicts in conflict resolution mode (derived from aggregated workspace changes and conflict resolution changes)
   resolutions: EntityChangeConflictResolution[] = [];
+  currentGraphHash: string | undefined;
 
   observerContext: ObserverContext;
 
   constructor(editorStore: EditorStore, graphState: EditorGraphState) {
     makeObservable(this, {
       resolutions: observable,
+      currentGraphHash: observable,
       projectLatestRevisionState: observable.ref,
       conflictResolutionBaseRevisionState: observable.ref,
       conflictResolutionHeadRevisionState: observable.ref,
@@ -355,6 +357,15 @@ export class ChangeDetectionState {
     this.potentialWorkspacePullConflicts = conflicts;
   }
 
+  getCurrentGraphHash(): string {
+    return hashObject(
+      Array.from(this.snapshotLocalEntityHashesIndex(true).entries())
+        // sort to ensure this array order does not affect change detection status
+        .sort((a, b) => a[0].localeCompare(b[0]))
+        .map(([key, value]) => `${key}@${value}`),
+    );
+  }
+
   stop(force = false): void {
     this.changeDetectionReaction?.();
     this.changeDetectionReaction = undefined;
@@ -407,16 +418,10 @@ export class ChangeDetectionState {
      * See https://medium.com/terria/when-and-why-does-mobxs-keepalive-cause-a-memory-leak-8c29feb9ff55
      */
     this.changeDetectionReaction = reaction(
-      // to be safe, rather than just giving the reaction the hash index snapshot to watch, we hash the snapshot content
-      () =>
-        hashObject(
-          Array.from(this.snapshotLocalEntityHashesIndex(true).entries())
-            // sort to ensure this array order does not affect change detection status
-            .sort((a, b) => a[0].localeCompare(b[0]))
-            .map(([key, value]) => `${key}@${value}`),
-        ),
+      () => this.getCurrentGraphHash(),
       () => {
         flowResult(this.computeLocalChanges(true)).catch(noop());
+        this.currentGraphHash = this.getCurrentGraphHash();
       },
       {
         // fire reaction immediately to compute the first changeset
@@ -426,11 +431,15 @@ export class ChangeDetectionState {
       },
     );
 
+    // set initial current graph hash
+    this.currentGraphHash = this.getCurrentGraphHash();
+
     // dispose and remove the disposers for `keepAlive` computations for elements' hash code
     this.graphElementHashCodeKeepAliveComputationDisposers.forEach((disposer) =>
       disposer(),
     );
     this.graphElementHashCodeKeepAliveComputationDisposers = [];
+
     this.initState.pass();
   }
 

package/src/stores/EditorConfig.ts

@@ -37,6 +37,7 @@ export enum ACTIVITY_MODE {
 export enum AUX_PANEL_MODE {
   CONSOLE = 'COMPILE',
   DEV_TOOL = 'DEV_TOOL',
+  PROBLEMS = 'PROBLEMS',
 }
 
 export enum ELEMENT_NATIVE_VIEW_MODE {