diff --git a/app/src/components/ui/Tools.tsx b/app/src/components/ui/Tools.tsx
index 8fa95a9..5938aa3 100644
--- a/app/src/components/ui/Tools.tsx
+++ b/app/src/components/ui/Tools.tsx
@@ -115,17 +115,10 @@ const Tools: React.FC = () => {
setOpenDrop(false); // Close the dropdown
}
};
- const handleEscKeyPress = (event: KeyboardEvent) => {
- if (event.key === "Escape") {
- setIsPlaying(false); // Set isPlaying to false when Escape key is pressed
- }
- };
document.addEventListener("mousedown", handleOutsideClick);
- document.addEventListener("keydown", handleEscKeyPress); // Listen for ESC key
return () => {
document.removeEventListener("mousedown", handleOutsideClick);
- document.removeEventListener("keydown", handleEscKeyPress); // Clean up the event listener
};
}, []);
useEffect(() => {
diff --git a/app/src/modules/scene/camera/camMode.tsx b/app/src/modules/scene/camera/camMode.tsx
index ba1aa0f..b4a59b0 100644
--- a/app/src/modules/scene/camera/camMode.tsx
+++ b/app/src/modules/scene/camera/camMode.tsx
@@ -5,6 +5,7 @@ import { useCamMode, useToggleView } from '../../../store/store';
import { useKeyboardControls } from '@react-three/drei';
import switchToThirdPerson from './switchToThirdPerson';
import switchToFirstPerson from './switchToFirstPerson';
+import { detectModifierKeys } from '../../../utils/shortcutkeys/detectModifierKeys';
const CamMode: React.FC = () => {
const { camMode, setCamMode } = useCamMode();
@@ -37,7 +38,9 @@ const CamMode: React.FC = () => {
const handleKeyPress = async (event: any) => {
if (!state.controls) return;
- if (event.key === "/" && !isTransitioning && !toggleView) {
+ const keyCombination = detectModifierKeys(event);
+
+ if (keyCombination === "/" && !isTransitioning && !toggleView) {
setIsTransitioning(true);
state.controls.mouseButtons.left = CONSTANTS.controlsTransition.leftMouse;
state.controls.mouseButtons.right = CONSTANTS.controlsTransition.rightMouse;
@@ -81,9 +84,7 @@ const CamMode: React.FC = () => {
}
});
- return (
- <></>
- );
+ return null; // This component does not render any UI
};
export default CamMode;
\ No newline at end of file
diff --git a/app/src/modules/scene/controls/selection/copyPasteControls.tsx b/app/src/modules/scene/controls/selection/copyPasteControls.tsx
index 5af10c0..0c68da3 100644
--- a/app/src/modules/scene/controls/selection/copyPasteControls.tsx
+++ b/app/src/modules/scene/controls/selection/copyPasteControls.tsx
@@ -5,6 +5,7 @@ import { useFloorItems, useSelectedAssets, useSimulationStates, useSocketStore,
import { toast } from "react-toastify";
// import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
import * as Types from "../../../../types/world/worldTypes";
+import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pastedObjects, setpastedObjects, selectionGroup, setDuplicatedObjects, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects, boundingBoxRef }: any) => {
const { camera, controls, gl, scene, pointer, raycaster } = useThree();
@@ -38,10 +39,12 @@ const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pas
};
const onKeyDown = (event: KeyboardEvent) => {
- if (event.ctrlKey && event.key.toLowerCase() === "c" && movedObjects.length === 0 && rotatedObjects.length === 0) {
+ const keyCombination = detectModifierKeys(event);
+
+ if (keyCombination === "Ctrl+C" && movedObjects.length === 0 && rotatedObjects.length === 0) {
copySelection();
}
- if (event.ctrlKey && event.key.toLowerCase() === "v" && copiedObjects.length > 0 && pastedObjects.length === 0 && movedObjects.length === 0 && rotatedObjects.length === 0) {
+ if (keyCombination === "Ctrl+V" && copiedObjects.length > 0 && pastedObjects.length === 0 && movedObjects.length === 0 && rotatedObjects.length === 0) {
pasteCopiedObjects();
}
};
@@ -570,9 +573,7 @@ const CopyPasteControls = ({ itemsGroupRef, copiedObjects, setCopiedObjects, pas
setSelectedAssets([]);
}
- return (
- <></>
- );
+ return null; // No visible output, but the component handles copy-paste functionality
};
export default CopyPasteControls;
\ No newline at end of file
diff --git a/app/src/modules/scene/controls/selection/duplicationControls.tsx b/app/src/modules/scene/controls/selection/duplicationControls.tsx
index 2964181..dbd0b34 100644
--- a/app/src/modules/scene/controls/selection/duplicationControls.tsx
+++ b/app/src/modules/scene/controls/selection/duplicationControls.tsx
@@ -6,6 +6,7 @@ import { toast } from "react-toastify";
// import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
import * as Types from "../../../../types/world/worldTypes";
import { setFloorItemApi } from "../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi";
+import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedObjects, setpastedObjects, selectionGroup, movedObjects, setMovedObjects, rotatedObjects, setRotatedObjects, boundingBoxRef }: any) => {
const { camera, controls, gl, scene, pointer, raycaster } = useThree();
@@ -39,12 +40,11 @@ const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedOb
};
const onKeyDown = (event: KeyboardEvent) => {
- if (event.key.toLowerCase() === "d") {
- event.preventDefault();
- if (event.ctrlKey && event.key.toLowerCase() === "d" && selectedAssets.length > 0 && duplicatedObjects.length === 0 && movedObjects.length === 0 && rotatedObjects.length === 0) {
+ const keyCombination = detectModifierKeys(event);
+
+ if (keyCombination === "Ctrl+D" && selectedAssets.length > 0 && duplicatedObjects.length === 0 && movedObjects.length === 0 && rotatedObjects.length === 0) {
duplicateSelection();
}
- }
};
if (!toggleView) {
@@ -552,9 +552,7 @@ const DuplicationControls = ({ itemsGroupRef, duplicatedObjects, setDuplicatedOb
setSelectedAssets([]);
}
- return (
- <></>
- );
+ return null; // This component does not render any UI
};
export default DuplicationControls;
\ No newline at end of file
diff --git a/app/src/modules/scene/controls/selection/moveControls.tsx b/app/src/modules/scene/controls/selection/moveControls.tsx
index 2a11c53..47a3747 100644
--- a/app/src/modules/scene/controls/selection/moveControls.tsx
+++ b/app/src/modules/scene/controls/selection/moveControls.tsx
@@ -5,6 +5,7 @@ import { useFloorItems, useSelectedAssets, useSimulationStates, useSocketStore,
// import { setFloorItemApi } from '../../../../services/factoryBuilder/assest/floorAsset/setFloorItemApi';
import { toast } from "react-toastify";
import * as Types from "../../../../types/world/worldTypes";
+import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
function MoveControls({ movedObjects, setMovedObjects, itemsGroupRef, copiedObjects, setCopiedObjects, pastedObjects, setpastedObjects, duplicatedObjects, setDuplicatedObjects, selectionGroup, rotatedObjects, setRotatedObjects, boundingBoxRef }: any) {
const { camera, controls, gl, scene, pointer, raycaster } = useThree();
@@ -56,14 +57,16 @@ function MoveControls({ movedObjects, setMovedObjects, itemsGroupRef, copiedObje
};
const onKeyDown = (event: KeyboardEvent) => {
+ const keyCombination = detectModifierKeys(event);
+
if (pastedObjects.length > 0 || duplicatedObjects.length > 0 || rotatedObjects.length > 0) return;
- if (event.key.toLowerCase() === "g") {
+ if (keyCombination === "G") {
if (selectedAssets.length > 0) {
moveAssets();
itemsData.current = floorItems.filter((item: { modeluuid: string }) => selectedAssets.some((asset: any) => asset.uuid === item.modeluuid));
}
}
- if (event.key.toLowerCase() === "escape") {
+ if (keyCombination === "ESCAPE") {
event.preventDefault();
clearSelection();
@@ -453,9 +456,7 @@ function MoveControls({ movedObjects, setMovedObjects, itemsGroupRef, copiedObje
setSelectedAssets([]);
}
- return (
- <></>
- )
+ return null; // No need to return anything, as this component is used for its side effects
}
export default MoveControls
\ No newline at end of file
diff --git a/app/src/modules/scene/controls/selection/rotateControls.tsx b/app/src/modules/scene/controls/selection/rotateControls.tsx
index 90143ca..bef64a2 100644
--- a/app/src/modules/scene/controls/selection/rotateControls.tsx
+++ b/app/src/modules/scene/controls/selection/rotateControls.tsx
@@ -457,9 +457,7 @@ function RotateControls({ rotatedObjects, setRotatedObjects, movedObjects, setMo
setSelectedAssets([]);
}
- return (
- <></>
- )
+ return null; // No need to return anything, as this component is used for its side effects
}
export default RotateControls
\ No newline at end of file
diff --git a/app/src/modules/scene/controls/selection/selectionControls.tsx b/app/src/modules/scene/controls/selection/selectionControls.tsx
index 11c2dfb..acaed3a 100644
--- a/app/src/modules/scene/controls/selection/selectionControls.tsx
+++ b/app/src/modules/scene/controls/selection/selectionControls.tsx
@@ -14,6 +14,7 @@ import CopyPasteControls from "./copyPasteControls";
import MoveControls from "./moveControls";
import RotateControls from "./rotateControls";
import useModuleStore from "../../../../store/useModuleStore";
+import { detectModifierKeys } from "../../../../utils/shortcutkeys/detectModifierKeys";
const SelectionControls: React.FC = () => {
const { camera, controls, gl, scene, pointer } = useThree();
@@ -101,12 +102,13 @@ const SelectionControls: React.FC = () => {
};
const onKeyDown = (event: KeyboardEvent) => {
+ const keyCombination = detectModifierKeys(event);
if (movedObjects.length > 0 || rotatedObjects.length > 0) return;
- if (event.key.toLowerCase() === "escape") {
+ if (keyCombination === "ESCAPE") {
event.preventDefault();
clearSelection();
}
- if (event.key.toLowerCase() === "delete") {
+ if (keyCombination === "DELETE") {
event.preventDefault();
deleteSelection();
}
diff --git a/app/src/modules/simulation/path/pathCreation.tsx b/app/src/modules/simulation/path/pathCreation.tsx
index 839cf39..c31da9b 100644
--- a/app/src/modules/simulation/path/pathCreation.tsx
+++ b/app/src/modules/simulation/path/pathCreation.tsx
@@ -16,6 +16,7 @@ import { useFrame, useThree } from "@react-three/fiber";
import { useSubModuleStore } from "../../../store/useModuleStore";
import { usePlayButtonStore } from "../../../store/usePlayButtonStore";
import { setEventApi } from "../../../services/factoryBuilder/assest/floorAsset/setEventsApt";
+import { detectModifierKeys } from "../../../utils/shortcutkeys/detectModifierKeys";
function PathCreation({ pathsGroupRef, }: { pathsGroupRef: React.MutableRefObject<THREE.Group>; }) {
const { isPlaying } = usePlayButtonStore();
@@ -40,11 +41,12 @@ function PathCreation({ pathsGroupRef, }: { pathsGroupRef: React.MutableRefObjec
useEffect(() => {
setTransformMode(null);
const handleKeyDown = (e: KeyboardEvent) => {
+ const keyCombination = detectModifierKeys(e);
if (!selectedActionSphere) return;
- if (e.key === "g") {
+ if (keyCombination === "G") {
setTransformMode((prev) => (prev === "translate" ? null : "translate"));
}
- if (e.key === "r") {
+ if (keyCombination === "R") {
setTransformMode((prev) => (prev === "rotate" ? null : "rotate"));
}
};