Merge pull request #53 from frappe/develop

frappe · Jan 9, 2024 · 9fb5727 · 9fb5727
2 parents dbfdf39 + cf5ffd2
commit 9fb5727
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 12 deletions.
diff --git a/frontend/src/pages/PageBuilder.vue b/frontend/src/pages/PageBuilder.vue
@@ -52,7 +52,14 @@ import { BuilderPage } from "@/types/Builder/BuilderPage";
 import Block, { styleProperty } from "@/utils/block";
 import blockController from "@/utils/blockController";
 import getBlockTemplate from "@/utils/blockTemplate";
-import { copyToClipboard, getBlockCopy, isHTMLString, isJSONString, isTargetEditable } from "@/utils/helpers";
+import {
+	copyToClipboard,
+	getBlockCopy,
+	isCtrlOrCmd,
+	isHTMLString,
+	isJSONString,
+	isTargetEditable,
+} from "@/utils/helpers";
 import { useActiveElement, useDebounceFn, useEventListener, useMagicKeys } from "@vueuse/core";
 import { computed, nextTick, onActivated, provide, ref, watch, watchEffect } from "vue";
 import { useRoute, useRouter } from "vue-router";
@@ -233,20 +240,20 @@ useEventListener(document, "paste", async (e) => {
 // TODO: Refactor with useMagicKeys
 useEventListener(document, "keydown", (e) => {
 	if (isTargetEditable(e)) return;
-	if (e.key === "z" && e.metaKey && !e.shiftKey && store.activeCanvas?.history.canUndo) {
+	if (e.key === "z" && isCtrlOrCmd(e) && !e.shiftKey && store.activeCanvas?.history.canUndo) {
 		store.activeCanvas?.history.undo();
 		updateSelectedBlocks();
 		e.preventDefault();
 		return;
 	}
-	if (e.key === "z" && e.shiftKey && e.metaKey && store.activeCanvas?.history.canRedo) {
+	if (e.key === "z" && e.shiftKey && isCtrlOrCmd(e) && store.activeCanvas?.history.canRedo) {
 		store.activeCanvas?.history.redo();
 		updateSelectedBlocks();
 		e.preventDefault();
 		return;
 	}
 
-	if (e.key === "0" && e.metaKey) {
+	if (e.key === "0" && isCtrlOrCmd(e)) {
 		e.preventDefault();
 		if (pageCanvas.value) {
 			if (e.shiftKey) {
@@ -290,23 +297,23 @@ useEventListener(document, "keydown", (e) => {
 		return;
 	}
 
-	if (e.key === "=" && e.metaKey) {
+	if (e.key === "=" && isCtrlOrCmd(e)) {
 		e.preventDefault();
 		if (pageCanvas.value) {
 			pageCanvas.value.zoomIn();
 		}
 		return;
 	}
 
-	if (e.key === "-" && e.metaKey) {
+	if (e.key === "-" && isCtrlOrCmd(e)) {
 		e.preventDefault();
 		if (pageCanvas.value) {
 			pageCanvas.value.zoomOut();
 		}
 		return;
 	}
 
-	if (e.metaKey || e.ctrlKey || e.shiftKey) {
+	if (isCtrlOrCmd(e) || e.shiftKey) {
 		return;
 	}
 
@@ -359,7 +366,7 @@ watch(space, (value) => {
 });
 
 useEventListener(document, "keydown", (e) => {
-	if (e.key === "\\" && e.metaKey) {
+	if (e.key === "\\" && isCtrlOrCmd(e)) {
 		e.preventDefault();
 		if (e.shiftKey) {
 			store.showLeftPanel = !store.showLeftPanel;
@@ -369,7 +376,7 @@ useEventListener(document, "keydown", (e) => {
 		}
 	}
 	// save page or component
-	if (e.key === "s" && (e.ctrlKey || e.metaKey)) {
+	if (e.key === "s" && isCtrlOrCmd(e)) {
 		e.preventDefault();
 		if (store.editingMode === "component") {
 			store.editPage(true);
@@ -380,7 +387,7 @@ useEventListener(document, "keydown", (e) => {
 		return;
 	}
 
-	if (e.key === "p" && (e.ctrlKey || e.metaKey)) {
+	if (e.key === "p" && isCtrlOrCmd(e)) {
 		e.preventDefault();
 		store.savePage();
 		router.push({
@@ -391,7 +398,7 @@ useEventListener(document, "keydown", (e) => {
 		});
 	}
 
-	if (e.key === "c" && e.metaKey && e.shiftKey) {
+	if (e.key === "c" && isCtrlOrCmd(e) && e.shiftKey) {
 		if (blockController.isBLockSelected() && !blockController.multipleBlocksSelected()) {
 			e.preventDefault();
 			const block = blockController.getSelectedBlocks()[0];
@@ -402,7 +409,7 @@ useEventListener(document, "keydown", (e) => {
 		}
 	}
 
-	if (e.key === "d" && e.metaKey) {
+	if (e.key === "d" && isCtrlOrCmd(e)) {
 		if (blockController.isBLockSelected() && !blockController.multipleBlocksSelected()) {
 			e.preventDefault();
 			const block = blockController.getSelectedBlocks()[0];

diff --git a/frontend/src/utils/helpers.ts b/frontend/src/utils/helpers.ts
@@ -256,6 +256,10 @@ function getBlockCopy(block: BlockOptions | Block, retainId = false): Block {
 	return getBlockInstance(b);
 }
 
+function isCtrlOrCmd(e: KeyboardEvent) {
+	return e.ctrlKey || e.metaKey;
+}
+
 export {
 	HSVToHex,
 	HexToHSV,
@@ -271,6 +275,7 @@ export {
 	getRGB,
 	getRandomColor,
 	getTextContent,
+	isCtrlOrCmd,
 	isHTMLString,
 	isJSONString,
 	isTargetEditable,