feat(builder): Enable ctrl+z to undo changes in editor#217

baptisteArno · Jan 16, 2023 · e547cbb · e547cbb
1 parent 65c35fa
commit e547cbb
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/apps/builder/src/features/editor/components/TypebotHeader/TypebotHeader.tsx b/apps/builder/src/features/editor/components/TypebotHeader/TypebotHeader.tsx
@@ -27,6 +27,8 @@ import { headerHeight } from '../../constants'
 import { EditableEmojiOrImageIcon } from '@/components/EditableEmojiOrImageIcon'
 import { PublishButton } from '@/features/publish'
 import { CollaborationMenuButton } from '@/features/collaboration'
+import { useUndoShortcut } from '@/hooks/useUndoShortcut'
+
 
 export const TypebotHeader = () => {
   const router = useRouter()
@@ -52,6 +54,8 @@ export const TypebotHeader = () => {
     setRightPanel(RightPanel.PREVIEW)
   }
 
+  useUndoShortcut(canUndo, undo);
+
   const handleHelpClick = () => {
     isCloudProdInstance
       ? getBubbleActions().open()

diff --git a/apps/builder/src/hooks/useUndoShortcut.ts b/apps/builder/src/hooks/useUndoShortcut.ts
@@ -0,0 +1,12 @@
+import { useEventListener } from '@chakra-ui/react'
+
+export const useUndoShortcut = (canUndo: boolean, undo: () => void) => {
+  const isUndoShortcut = (event: KeyboardEvent) =>
+    (event.metaKey || event.ctrlKey) && event.key === 'z'
+
+  useEventListener('keydown', (event: KeyboardEvent) => {
+    if (isUndoShortcut(event) && canUndo) {
+      undo()
+    }
+  })
+}