From 5a1db6db1adad43887e839181719818474bc66b0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ra=C3=BAl=20G=C3=B3mez=20Morales?= <raul00gm@gmail.com>
Date: Wed, 18 Sep 2024 09:10:51 +0200
Subject: [PATCH] fix(editor): Restore V1 keybinding, Space Key to toggle
 panning (#10841)

---
 packages/editor-ui/src/components/canvas/Canvas.spec.ts | 8 ++++----
 packages/editor-ui/src/components/canvas/Canvas.vue     | 5 ++++-
 2 files changed, 8 insertions(+), 5 deletions(-)

diff --git a/packages/editor-ui/src/components/canvas/Canvas.spec.ts b/packages/editor-ui/src/components/canvas/Canvas.spec.ts
index 256377a8f3..8768e97798 100644
--- a/packages/editor-ui/src/components/canvas/Canvas.spec.ts
+++ b/packages/editor-ui/src/components/canvas/Canvas.spec.ts
@@ -164,7 +164,7 @@ describe('Canvas', () => {
 			const pane = canvas.querySelector('.vue-flow__pane');
 			if (!pane) throw new Error('VueFlow pane not found');
 
-			await fireEvent.keyDown(pane, { view: window, key: 'Shift' });
+			await fireEvent.keyDown(pane, { view: window, key: ' ' });
 			await fireEvent.mouseDown(pane, { view: window });
 			await fireEvent.mouseMove(pane, {
 				view: window,
@@ -172,7 +172,7 @@ describe('Canvas', () => {
 				clientY: 100,
 			});
 			await fireEvent.mouseUp(pane, { view: window });
-			await fireEvent.keyUp(pane, { view: window, key: 'Shift' });
+			await fireEvent.keyUp(pane, { view: window, key: ' ' });
 
 			vi.advanceTimersByTime(minimapTransitionDuration);
 			await waitFor(() => expect(getByTestId('canvas-minimap')).toBeVisible());
@@ -196,7 +196,7 @@ describe('Canvas', () => {
 			const pane = canvas.querySelector('.vue-flow__pane');
 			if (!pane) throw new Error('VueFlow pane not found');
 
-			await fireEvent.keyDown(pane, { view: window, key: 'Shift' });
+			await fireEvent.keyDown(pane, { view: window, key: ' ' });
 			await fireEvent.mouseDown(pane, { view: window });
 			await fireEvent.mouseMove(pane, {
 				view: window,
@@ -204,7 +204,7 @@ describe('Canvas', () => {
 				clientY: 100,
 			});
 			await fireEvent.mouseUp(pane, { view: window });
-			await fireEvent.keyUp(pane, { view: window, key: 'Shift' });
+			await fireEvent.keyUp(pane, { view: window, key: ' ' });
 
 			vi.advanceTimersByTime(minimapTransitionDuration);
 			await waitFor(() => expect(getByTestId('canvas-minimap')).toBeVisible());
diff --git a/packages/editor-ui/src/components/canvas/Canvas.vue b/packages/editor-ui/src/components/canvas/Canvas.vue
index 8efb8fcea5..a552c5bd23 100644
--- a/packages/editor-ui/src/components/canvas/Canvas.vue
+++ b/packages/editor-ui/src/components/canvas/Canvas.vue
@@ -122,7 +122,10 @@ const classes = computed(() => ({
 
 const disableKeyBindings = computed(() => !props.keyBindings);
 
-const panningKeyCode = 'Shift';
+/**
+ * @see https://developer.mozilla.org/en-US/docs/Web/API/UI_Events/Keyboard_event_key_values#whitespace_keys
+ */
+const panningKeyCode = ' ';
 const isPanningEnabled = ref(false);
 
 onKeyDown(panningKeyCode, () => {