NO-ISSUE: Fix stale content when switching editors for the same file …

…on KIE Sandbox (apache#2104)

packages/online-editor/src/editor/EditorPage.tsx

@@ -411,6 +411,40 @@ export function EditorPage(props: Props) {
     return editorEnvelopeLocator;
   }, [editorEnvelopeLocator, props.fileRelativePath, settings.editors.useLegacyDmnEditor]);
 
+  // `workspaceFilePromise` is ONLY updated when there's an external change on this file (e.g., on another tab), but
+  // when we jump between the legacy and the new DMN Editor, `settingsAwareEditorEnvelopeLocator` changes,
+  // and if we don't update `embeddedEditorFile`, the new <EmbeddedEditor> will be rendered using the `embeddedEditorFile`
+  // that originally was used for opening the file, and the new chosen DMN Editor will display stale content.
+  useCancelableEffect(
+    useCallback(
+      ({ canceled }) => {
+        workspaceFilePromise.data?.workspaceFile.getFileContentsAsString().then((content) => {
+          if (canceled.get()) {
+            return;
+          }
+
+          setEmbeddedEditorFile((prev) =>
+            !prev
+              ? undefined
+              : {
+                  ...prev,
+                  getFileContents: async () => content,
+                }
+          );
+        });
+      },
+      //
+      // This is a very unusual case.
+      // `workspaceFilePromise.data` should've been here, but we can't really add it otherwise
+      // the <EmbeddedEditor> component will blink on any edit.
+      // `settingsAwareEditorEnvelopeLocator` is added because it is the only case where the
+      // <EmbeddedEditor> should update for the same workspaceFile.
+      //
+      // eslint-disable-next-line react-hooks/exhaustive-deps
+      [settingsAwareEditorEnvelopeLocator]
+    )
+  );
+
   return (
     <OnlineEditorPage onKeyDown={onKeyDown}>
       <PromiseStateWrapper