diff --git a/app/src/components/footer/Footer.tsx b/app/src/components/footer/Footer.tsx index be52a92..b18d0ad 100644 --- a/app/src/components/footer/Footer.tsx +++ b/app/src/components/footer/Footer.tsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useEffect, useRef } from "react"; import { HelpIcon } from "../icons/DashboardIcon"; import { useLogger } from "../ui/log/LoggerContext"; import { GetLogIcon } from "./getLogIcons"; @@ -10,15 +10,41 @@ import { import ShortcutHelper from "./shortcutHelper"; import { useShortcutStore } from "../../store/builder/store"; import { usePlayButtonStore } from "../../store/usePlayButtonStore"; +import OuterClick from "../../utils/outerClick"; const Footer: React.FC = () => { const { logs, setIsLogListVisible } = useLogger(); const lastLog = logs.length > 0 ? logs[logs.length - 1] : null; - const { showShortcuts } = useShortcutStore(); + const { isPlaying } = usePlayButtonStore(); + const { showShortcuts, setShowShortcuts } = useShortcutStore(); + // Listen for Ctrl + Shift + ? + useEffect(() => { + const handleKeyDown = (e: KeyboardEvent) => { + if ( + e.ctrlKey && + e.shiftKey && + (e.key === "?" || e.key === "/") // for some keyboards ? and / share the same key + ) { + e.preventDefault(); + setShowShortcuts(!showShortcuts); // toggle visibility directly + } + if (e.key === "Escape") { + setShowShortcuts(false); + } + }; + + window.addEventListener("keydown", handleKeyDown); + return () => window.removeEventListener("keydown", handleKeyDown); + }, [showShortcuts, setShowShortcuts]); + + OuterClick({ + contextClassName: ["shortcut-helper-overlay"], + setMenuVisible: () => setShowShortcuts(false), + }); return (
diff --git a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx index ca5a8de..73a630c 100644 --- a/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx +++ b/app/src/components/layout/sidebarRight/versionHisory/VersionHistory.tsx @@ -10,6 +10,7 @@ import RenameInput from "../../../ui/inputs/RenameInput"; const VersionHistory = () => { const userName = localStorage.getItem("userName") ?? "Anonymous"; + const initialVersions = [ { versionName: "v1.0",