fix: Undo/redo behavior incorrect in multiplayer editor (#8015)

app/editor/extensions/Multiplayer.ts

@@ -1,5 +1,4 @@
 import isEqual from "lodash/isEqual";
-import { keymap } from "prosemirror-keymap";
 import {
   ySyncPlugin,
   yCursorPlugin,
@@ -104,11 +103,13 @@ export default class Multiplayer extends Extension {
         selectionBuilder,
       }),
       yUndoPlugin(),
-      keymap({
-        "Mod-z": undo,
-        "Mod-y": redo,
-        "Mod-Shift-z": redo,
-      }),
     ];
   }
+
+  commands() {
+    return {
+      undo: () => undo,
+      redo: () => redo,
+    };
+  }
 }

app/scenes/Document/components/Document.tsx

@@ -215,13 +215,15 @@ class DocumentScene extends React.Component<Props> {
 
   onUndoRedo = (event: KeyboardEvent) => {
     if (isModKey(event)) {
+      event.preventDefault();
+
       if (event.shiftKey) {
-        if (this.editor.current?.redo()) {
-          event.preventDefault();
+        if (!this.props.readOnly) {
+          this.editor.current?.commands.redo();
         }
       } else {
-        if (this.editor.current?.undo()) {
-          event.preventDefault();
+        if (!this.props.readOnly) {
+          this.editor.current?.commands.undo();
         }
       }
     }

shared/editor/extensions/History.ts

@@ -1,17 +1,28 @@
 import { history, undo, redo } from "prosemirror-history";
 import { undoInputRule } from "prosemirror-inputrules";
-import Extension from "../lib/Extension";
+import { Command } from "prosemirror-state";
+import Extension, { CommandFactory } from "../lib/Extension";
 
 export default class History extends Extension {
   get name() {
     return "history";
   }
 
-  keys() {
+  commands(): Record<string, CommandFactory> {
     return {
-      "Mod-z": undo,
-      "Mod-y": redo,
-      "Shift-Mod-z": redo,
+      undo: () => undo,
+      redo: () => redo,
+    };
+  }
+
+  keys(): Record<string, Command> {
+    return {
+      "Mod-z": (state, dispatch) =>
+        this.editor.commands.undo()(state, dispatch),
+      "Mod-y": (state, dispatch) =>
+        this.editor.commands.redo()(state, dispatch),
+      "Shift-Mod-z": (state, dispatch) =>
+        this.editor.commands.redo()(state, dispatch),
       Backspace: undoInputRule,
     };
   }

shared/editor/lib/Extension.ts

@@ -5,9 +5,7 @@ import { Command, Plugin } from "prosemirror-state";
 import { Primitive } from "utility-types";
 import type { Editor } from "../../../app/editor";
 
-export type CommandFactory = (
-  attrs?: Record<string, Primitive>
-) => Command | void;
+export type CommandFactory = (attrs?: Record<string, Primitive>) => Command;
 
 export type WidgetProps = { rtl: boolean; readOnly: boolean | undefined };
 

shared/editor/lib/ExtensionManager.ts

@@ -251,13 +251,10 @@ export default class ExtensionManager {
         };
 
         const handle = (_name: string, _value: CommandFactory) => {
-          if (Array.isArray(_value)) {
-            commands[_name] = (attrs: Record<string, Primitive>) =>
-              _value.forEach((callback) => apply(callback, attrs));
-          } else if (typeof _value === "function") {
-            commands[_name] = ((attrs: Record<string, Primitive>) =>
-              apply(_value, attrs)) as CommandFactory;
-          }
+          const values = Array.isArray(_value) ? _value : [_value];
+
+          commands[_name] = (attrs: Record<string, Primitive>) => () =>
+            values.filter((callback) => apply(callback, attrs))?.length > 0;
         };
 
         if (typeof value === "object") {