@finos/legend-application-studio 19.1.0 → 20.0.0

package/src/components/editor/edit-panel/connection-editor/post-processor-editor/MapperPostProcessorEditor.tsx

@@ -19,7 +19,7 @@ import {
   ResizablePanel,
   PlusIcon,
   ResizablePanelSplitter,
-  PanelFormTextEditor,
+  PanelFormTextField,
   PanelForm,
   ContextMenu,
   MenuContent,
@@ -32,7 +32,6 @@ import {
   PanelHeader,
   PanelContent,
   PanelListSelectorItemLabel,
-  PanelSection,
   PanelHeaderActions,
 } from '@finos/legend-art';
 import {
@@ -232,28 +231,25 @@ export const MapperPostProcessorEditor = observer(
                   )}
                   {selectedMapper && (
                     <PanelForm>
-                      <PanelSection>
-                        <PanelFormTextEditor
-                          isReadOnly={isReadOnly}
-                          value={selectedMapper.from}
-                          name="From"
-                          update={(value: string | undefined): void =>
-                            mapper_setFrom(selectedMapper, value ?? '')
-                          }
-                        />
-                        <PanelFormTextEditor
-                          isReadOnly={isReadOnly}
-                          value={selectedMapper.to}
-                          name="To"
-                          update={(value: string | undefined): void =>
-                            mapper_setTo(selectedMapper, value ?? '')
-                          }
-                        />
-                      </PanelSection>
-
+                      <PanelFormTextField
+                        isReadOnly={isReadOnly}
+                        value={selectedMapper.from}
+                        name="From"
+                        update={(value: string | undefined): void =>
+                          mapper_setFrom(selectedMapper, value ?? '')
+                        }
+                      />
+                      <PanelFormTextField
+                        isReadOnly={isReadOnly}
+                        value={selectedMapper.to}
+                        name="To"
+                        update={(value: string | undefined): void =>
+                          mapper_setTo(selectedMapper, value ?? '')
+                        }
+                      />
                       {selectedSchemaNameMapper && (
-                        <PanelSection>
-                          <PanelFormTextEditor
+                        <>
+                          <PanelFormTextField
                             isReadOnly={isReadOnly}
                             value={selectedSchemaNameMapper.from}
                             name="Schema - From"
@@ -264,7 +260,7 @@ export const MapperPostProcessorEditor = observer(
                               );
                             }}
                           />
-                          <PanelFormTextEditor
+                          <PanelFormTextField
                             isReadOnly={isReadOnly}
                             value={selectedSchemaNameMapper.to}
                             name="Schema - To"
@@ -275,7 +271,7 @@ export const MapperPostProcessorEditor = observer(
                               )
                             }
                           />
-                        </PanelSection>
+                        </>
                       )}
                     </PanelForm>
                   )}

package/src/components/editor/edit-panel/diff-editor/EntityChangeConflictEditor.tsx

@@ -46,10 +46,9 @@ import {
   clsx,
   CustomSelectorInput,
   disposeEditor,
-  baseTextEditorSettings,
-  moveToPosition,
+  getBaseTextEditorOptions,
+  moveCursorToPosition,
   setErrorMarkers,
-  revealError,
   resetLineNumberGutterWidth,
   getEditorValue,
   normalizeLineEnding,
@@ -57,6 +56,7 @@ import {
   ArrowDownIcon,
   ArrowUpIcon,
   useResizeDetector,
+  clearMarkers,
 } from '@finos/legend-art';
 import { TextDiffView } from '../../../shared/DiffView.js';
 import { getPrettyLabelForRevision } from '../../../../stores/editor-state/entity-diff-editor-state/EntityDiffEditorState.js';
@@ -193,7 +193,7 @@ const MergeConflictEditor = observer(
       if (!editor && textInputRef.current) {
         const element = textInputRef.current;
         const _editor = monacoEditorAPI.create(element, {
-          ...baseTextEditorSettings,
+          ...getBaseTextEditorOptions(),
           theme: EDITOR_THEME.LEGEND,
           language: EDITOR_LANGUAGE.PURE,
           minimap: { enabled: false },
@@ -376,16 +376,17 @@ const MergeConflictEditor = observer(
       if (editorModel) {
         editorModel.updateOptions({ tabSize: TAB_SIZE });
         if (error?.sourceInformation) {
-          setErrorMarkers(
-            editorModel,
-            error.message,
-            error.sourceInformation.startLine,
-            error.sourceInformation.startColumn,
-            error.sourceInformation.endLine,
-            error.sourceInformation.endColumn,
-          );
+          setErrorMarkers(editorModel, [
+            {
+              message: error.message,
+              startLineNumber: error.sourceInformation.startLine,
+              startColumn: error.sourceInformation.startColumn,
+              endLineNumber: error.sourceInformation.endLine,
+              endColumn: error.sourceInformation.endColumn,
+            },
+          ]);
         } else {
-          monacoEditorAPI.setModelMarkers(editorModel, 'Error', []);
+          clearMarkers();
         }
       }
 
@@ -549,11 +550,10 @@ const MergeConflictEditor = observer(
     useEffect(() => {
       if (editor) {
         if (error?.sourceInformation) {
-          revealError(
-            editor,
-            error.sourceInformation.startLine,
-            error.sourceInformation.startColumn,
-          );
+          moveCursorToPosition(editor, {
+            lineNumber: error.sourceInformation.startLine,
+            column: error.sourceInformation.startColumn,
+          });
         }
       }
     }, [editor, error, error?.sourceInformation]);
@@ -563,11 +563,11 @@ const MergeConflictEditor = observer(
         editor &&
         conflictEditorState.currentMergeEditorConflict !== undefined
       ) {
-        moveToPosition(
-          editor,
-          conflictEditorState.currentMergeEditorConflict.startHeader,
-          1,
-        );
+        moveCursorToPosition(editor, {
+          lineNumber:
+            conflictEditorState.currentMergeEditorConflict.startHeader,
+          column: 1,
+        });
       }
     }, [
       editor,

package/src/components/editor/edit-panel/mapping-editor/EnumerationMappingEditor.tsx

@@ -444,8 +444,9 @@ export const EnumerationMappingEditor = observer(
                   'mapping-element-editor__metadata__chunk',
                   'mapping-element-editor__metadata__driver-chunk',
                   'background--primitive',
+                  'mapping-element-editor__metadata__source-chunk--primitive',
                   {
-                    'mapping-element-editor__metadata__source--none':
+                    'mapping-element-editor__metadata__source-chunk--none':
                       !sourceType,
                   },
                 )}

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

@@ -268,7 +268,7 @@ const ExplorerContextMenu = observer(
         );
       }
     };
-    const copyLinkToElementInViewerMode = (): void => {
+    const copyWorkspaceElementLink = (): void => {
       if (node) {
         applicationStore
           .copyTextToClipboard(
@@ -279,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);
       }
@@ -333,7 +335,7 @@ const ExplorerContextMenu = observer(
                 View in Project
               </MenuContentItem>
             )}
-            <MenuContentItem onClick={copyLinkToElementInViewerMode}>
+            <MenuContentItem onClick={copyWorkspaceElementLink}>
               Copy Link
             </MenuContentItem>
           </>

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 {