Fork of atp.tools as a universal profile for people on the ATmosphere
1import { useState, useEffect } from "react";
2
3const KEY_MAPPINGS: { [key: string]: string } = {
4 cmd: "Meta",
5 shift: "Shift",
6 alt: "Alt",
7 ctrl: "Control",
8 esc: "Escape",
9};
10
11export function useKeyPress(targetKey: string) {
12 const [isPressed, setIsPressed] = useState(false);
13
14 useEffect(() => {
15 const mappedKey =
16 KEY_MAPPINGS[targetKey.toLowerCase()] || targetKey.toLowerCase();
17
18 const handleKeyDown = (event: KeyboardEvent) => {
19 if (event.key.toLowerCase() === mappedKey.toLowerCase()) {
20 setIsPressed(event.key.toLowerCase() === mappedKey.toLowerCase());
21 }
22 };
23
24 const handleKeyUp = (event: KeyboardEvent) => {
25 if (event.key.toLowerCase() === mappedKey.toLowerCase()) {
26 setIsPressed(false);
27 }
28 };
29
30 window.addEventListener("keydown", handleKeyDown);
31 window.addEventListener("keyup", handleKeyUp);
32
33 return () => {
34 window.removeEventListener("keydown", handleKeyDown);
35 window.removeEventListener("keyup", handleKeyUp);
36 };
37 }, [targetKey]);
38
39 return isPressed;
40}