Skip to content

Implement undo/redo

Closes #3450303.

This MR allows the user to undo and redo either by using the buttons located in the top bar or by using hot keys where undo is cmd+z for Mac and ctrl+z for Windows and redo is cmd+shift+z for Mac and ctrl+y for Windows.

Changes:

  • Added the redux-undo and react-hotkeys-hook (existing work for panning around canvas adds this library so might as well use it for this purpose too!) libraries.
  • Combined layoutSlice and modelSlice to layoutModelSlice so we can wrap it with the redux-undo library and just have one history to keep track of.
  • Allow undo/redo with hotkeys.
    • The UndoRedo.tsx component handles dispatching the undo/redo action
    • The useHotKeys hook only listens to the parent document, so needed to add an event listener to the iFrame inside of Preview.tsx where it listens for the keys, then sends a message to the parent document. The UndoRedo.tsx component has a listener that waits for the message and then dispatches undo/redo accordingly.
Edited by Wim Leers

Merge request reports