diff --git a/components/Modals/ShortcutHelpModal.tsx b/components/Modals/ShortcutHelpModal.tsx new file mode 100644 index 0000000..94686d6 --- /dev/null +++ b/components/Modals/ShortcutHelpModal.tsx @@ -0,0 +1,44 @@ +import { Modal } from "antd"; +import { useState } from "react"; +import { GlobalHotKeys, KeyMap } from "react-hotkeys"; + +export default function ShortcutHelpModal() { + const [visible, setVisible] = useState(true); + + function handleToggleModal() { + setVisible((pv) => !pv); + } + + const keyMap: KeyMap = { + SHOW_HELP_MODAL: "/", + }; + const handlers = { SHOW_HELP_MODAL: handleToggleModal }; + + return ( + <> + {/* fixed help on bottom left */} + + Help + + + + + + + + + ); +} diff --git a/pages/teams/[teamid].tsx b/pages/teams/[teamid].tsx index 0133007..f36da46 100644 --- a/pages/teams/[teamid].tsx +++ b/pages/teams/[teamid].tsx @@ -20,6 +20,7 @@ import UserService from "../../services/userService"; import Announcements from "../../components/Dashboard/Announcements"; import Links from "../../components/Dashboard/Links"; import Office from "../../components/Dashboard/Office"; +import ShortcutHelpModal from "../../components/Modals/ShortcutHelpModal"; // User has switched back to the tab const onFocus = () => { @@ -82,25 +83,29 @@ function TeamDashboard() { }, []); return ( -
-
+ <> + -
-
- +
+
- +
+
+ + + +
+ +
+ + + +
-
- - - -
+
- - -
+ ); }